echarts散点图的圆点设置成不同的自定义图片且使用本地静态资源图片的写法

最新推荐文章于 2025-08-07 15:52:31 发布

原创

最新推荐文章于 2025-08-07 15:52:31 发布 · 1.3k 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#echarts

文章描述了如何在ECharts散点图中将每个点设置为不同的本地静态资源图片，通过修改symbol属性为image://加上图片URL实现个性化节点表示。

现在要实现的功能是：

散点图的每个点都不再是小圆点而是一张图片！！！！！
即：

散点图的圆点设置成不同的自定义图片、且使用本地静态资源图片的写法

首先举个栗子，假设有个echarts散点图，以下是他的options

const option = {
   
   
        backgroundColor: 'rgba(255, 255, 255, 0)',
        xAxis: {
   
   
          min: 0,
          max: 1000,
          show: false,
          type: 'value'
        },
        yAxis: {
   
   
          min: 0,
          max: 1000,
          show: false,
          type: 'value'
        },
        series: [
          {
   
   
            type: 'graph',
            z: 99