echart的symbol自定义图片问题

最新推荐文章于 2024-05-10 11:47:36 发布

安逸IT仔赵大宝

最新推荐文章于 2024-05-10 11:47:36 发布

阅读量2.6k

点赞数

分类专栏： echart

本文链接：https://blog.csdn.net/zhao_66/article/details/103744000

版权

本文介绍了ECharts如何使用image://和path://方式自定义图表的symbol。image://支持外网或内网图片链接，包括dataURI格式。path://则允许设置矢量路径。推荐使用阿里图标库获取矢量图标，并提供了在线工具帮助转换图片为dataURI或矢量路径。

摘要由CSDN通过智能技术生成

echart的symbol支持自定义图片：

可以通过 ‘image://url’ 设置为图片，其中 URL 为图片的链接，或者 dataURI。

URL 为图片链接例如：
‘image://http://xxx.xxx.xxx/a/b.png’
URL 为 dataURI 例如：
‘image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7’

图片转成dataURL的工具可以在线搜索，这里提供
http://tu.chacuo.net/imagetodataurl
http://www.atool9.com/img2base64.php
注意：如果想要使用image://方法，有两种方式：
1.外网：将图片上传到某个网站过个人网站上，然后将图片路径粘贴到//后面
2.内网