[JavaScript知识库]echarts地图添加图片

需求：地图的各区域添加图标

解决方案：

? ? ? ? 通过散点图与地图的结合，为地图添加上图片；

option: {
        geo: [
          {
            map: 'xx省',//要显示地图的地区名
            roam: false,
            zlevel: 1,
            zoom: 1.2,
            label: {
              normal: {
                show: false
              },
              emphasis: {
                show: false
              }
            },
            itemStyle: {
              normal: {
                borderColor: '#052783',
                borderWidth: 1,
                areaColor: '#052783',
                shadowColor: '#052783',
                shadowBlur: 0,
                shadowOffsetX: 0,
                shadowOffsetY: 20
              },
              emphasis: {
                borderWidth: 1,
                areaColor: '#052783',
                borderColor: '#052783'
              }
            }
          }
        ],
        series: [
          {
            type: 'map',
            zlevel: 3,
            map: 'xx省',
            zoom: 1.2,
            label: {
              show: true,
              color: '#fff',
              fontSize: 12
            },
            itemStyle: {
              normal: {
                borderColor: '#5AC3EB',
                borderWidth: 1
              },
              emphasis: {
                areaColor: 'rgba(39, 196, 153, 1)'
              }
            },
            data: []
          },
         {
          type: 'scatter',
          coordinateSystem: 'geo',
          //自定义图片的 位置（lng, lat）
          data: [{
            value: xxx,
            symbolSize:30,
            symbol:图片,
            symbolOffset:[0,0]
          },{
            value: xxx,
            symbolSize:30,
            symbol:图片,
            symbolOffset:[0,0]
          },...],
          zlevel: 3
         }
        ],
        ...
      }

?效果图

?完整代码请加我微信

????????

?