echart 实现地图坐标轴带图标

最新推荐文章于 2025-01-06 16:58:37 发布

热忱学习

最新推荐文章于 2025-01-06 16:58:37 发布

阅读量1.1k

点赞数 3

分类专栏： vue 保存代码记录代码文章标签： echarts

本文链接：https://blog.youkuaiyun.com/qq_42180156/article/details/119913421

版权

本文将介绍如何利用Echarts库实现设计稿中地图坐标轴带有图标的特效，详细解析配置项设置和实现步骤。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

需要实现设计图的效果

  // 排名图
    drawColumbar () {
      var icon = {
        frist: require('@/assets/images/icon/1.png'),
        second: require('@/assets/images/icon/2.png'),
        thrid: require('@/assets/images/icon/3.png')
      }
      let columchart = echarts.init(this.$refs.columbarchart)
      let columchart1 = echarts.init(this.$refs.columbarchart1)
      let datalist = this.ElectricDaylist
      // datalist.push({
      //   customerName:'测试室',
      //   eday:0.4
      // })

      let xdata = []
      let ydata = []
      for (let i = 0; i < (datalist.length > 10 ? 10 : datalist.length); i++) {
        let name = datalist[i].customerName.length > 6 ? datalist[i].customerName.substr(0, 6) + '…' : datalist[i].customerName