近期《思图云平台》更新了形状组件,可自定义SVG形状,具体实现方法有如下三种。
一、使用SVG编辑器—Method Draw
Method Draw(http://editor.method.ac/)是一款在线 SVG 编辑器,是 SVG Edit 的一个分支。
1.将画布的宽和高都改为70.(很重要,形状所在的svg使用到了viewBox="0,0,70,70"属性,形状的显示都是在70×70的画布上的。深入了解可以参考
http://tutorials.jenkov.com/svg/svg-viewport-view-box.html)。在该画布上进行形状的绘制。
2.绘制完成后保存形状,此时该文件会被下载,格式为.svg
3.找到下载的文件,点击右键——>用记事本打开该文件后将代码全选(Ctrl+A)复制(Ctrl+C)到思图云平台的形状——>我的形状——>自定义SVG中
注意此时是复制代码时,开头及结尾的格式为<svg ...></svg>
二、网页上捕获.SVG形状代码
在网页上看到一个好的.SVG形状,可提取该代码,实现方式如下图所示
1.点开需提取代码的页面——>右键——>审查元素
2.点击左下方类似放大镜的图标——>选中所需的SVG形状——>下方则会显示相应代码
3.右键SVG形状对应的代码——>Edit as HTML (编辑HTML)
4.将代码选中复制到思图云平台即可
5.如下图所示
三、网上下载 .SVG格式的文件
1.百度搜索“SVG素材”
2.下载自己所需要的素材后,用记事本打开
3.复制代码到思图云平台即可,如上所述,本处不多做介绍
注意:此时是复制代码时,开头及结尾的格式为<svg ...></svg>,可用查找功能(Ctrl+F),并输入<svg ——查找下一个
小见童鞋,稍懂点儿产品,懂点儿运营,喜欢琢磨“新”的事物,欢迎沟通交流,微信 3095315714