echarts使用

209 阅读1分钟

地图

geo中使用的json数据可以在该网站选择下载 地图下载

1、地图,并有一些折线指向标注

需要使用多个series实现, 通过data的值根据需求改变现象

或者使用labelLine + labelLayout配置项(经实践无法满足需求)

series: [
    {type: 'map'}, //对于地图
    {type: 'lines'} // 对应折线
    {type: 'scatter'} // 对应散点
]

2、地图,点击可以选中

series中添加

series: { type: 'map', geoIndex: 0 }

3.地图 不同区域显示不同的指定颜色

通过series中的type = 'map' 模块配置,当使用了 geo 时不生效

series: [
    {
        type: 'map',
        data: [
          { name: 'xx', itemStyle: {areaColor: '#fff'}}
        ]
    }
]

4. 地图 使用第三点配置完不同颜色区域之后,第一点不生效

因为对应折线以及对应散点的模块都是通过geoIndex绑定的,当geo不存在的时候就绑定不了数据 所以可以再定义一个geo用来做其余series中的数据项

 geo: {
      type: 'map',
      map: 'zz',
      label: {
        show: false
      }
    },
series:  [
  {
    type: 'map',
    map: "zz",
    z: 0,
    label: {
      show: true,
      color: "#fff",
      fontSize: 16
    }
    ]
    

5. 雷达图 显示单轴数据

参考链接:显示单轴数据

6.雷达图 显示tooltip

需要设置option.tooltip.trigger = 'item' 否则不会触发