分享一些关于svg,制图辅助工具,svg图形的导入(4)
1.在demos里面利用表达式与动点导入贝塞尔曲线圆椭圆等以二次贝塞尔函数为例,你可以设置三个动点,一边手动调节曲线弧度,用公式表示第4个点横坐标x(t)(1−t)2⋅x02t(1−t)⋅x1t2⋅x2x(t)(1−t)2⋅x02t(1−t)⋅x1t2⋅x2纵坐标y(t)(1−t)2⋅y02t(1−t)⋅y1t2⋅y2y(t)(1−t)2⋅y02t(1−t)⋅y1t2⋅y2设立第4个动点,这样就可以表示贝塞尔曲线,但是你会发现,这个写起来好麻烦,一条曲线你就要写4,5行公式,还有就是,虽然demos可以导入图片,就算你绘画技术不是很好的情况下也可以导入参考图进行绘画,对于上色很麻烦,主要原因是因为混合着贝塞尔曲线,直线,甚至是圆的图形,形状很不规则,对于多种颜色,范围,形状都很难定义。那有没有有更加方便自由的方法呢?2.在Godsvg中绘制svg那就是Godsvg,这是一个比较轻量的工具,对于path可以直接生成一条曲线,自动实时读取点的坐标,设置一切关于svg的相关属性,画布,宽高,实时生成代码但有一个缺点就是,对于画技不是很好的人很不友好,因为该程序对于导入的参考图似乎要求比较高,也就是说,我试过的大部分图都不可以导入,包括.png.web.bmp等,就算是svg格式的图片导入进去也比较困难.3.阿里巴巴矢量图标库1.内容丰富,不管是图标还是插画,2.支持中文搜索3.下载代码即svg图片可以下载SVG图片,在浏览器中打开,按F12就可以实时看每个图片资源的分区4.图片转格式工具,以及如何导入svg图像资源,在SVGcode—Convert raster images to SVG vector graphics这个网页中在项目中导入svg图片方法一,直接在SVGcode—Convert raster images to SVG vector graphics复制svg代码方法二将svg图片作为静态图片img src图片路径/文件名.svg alt描述 width200 height200方法三作为css背景图div stylewidth: 200px; height: 200px; background-image: url(图片路径/文件名.svg);/div