在Echarts中如何定义图片的矢量路径

52 阅读1分钟

1.在图标库中找到自己想要的图标

[www.iconfont.cn/?spm=a313x.…]  iconfont. 

2.找到复制SVG

Snipaste_2023-11-06_16-56-27.png

Snipaste_2023-11-06_16-57-22.png

3.复制到记事本上

Snipaste_2023-11-06_17-02-30.png

4.path标签属性d的值即是该图片的矢量路径,使用时加上“path://”即可

let path = "path://M960.940781 967.105138l63.038739-41.279175-202.875942-296.826063a374.968501 374.968501 0 0 0 93.630127-247.867043A385.080298 385.080298 0 0 0 525.749485 0.02048a385.208296 385.208296 0 0 0-389.176216 381.112377 374.712506 374.712506 0 0 0 87.038259 240.059199L0 948.225515l63.038739 41.343174 214.971701-314.553709a392.120158 392.120158 0 0 0 209.851803 85.438291V1024h75.774484v-263.546729a391.032179 391.032179 0 0 0 201.787965-79.294414z"

5.如果碰到有多个Path标签,将后面的Path标签的d属性的值依次加到第一个Path标签的d属性的值后面即可(中间记得空格区分)

Snipaste_2023-11-06_17-18-58.png