echarts地图选中后的颜色

echarts yekong 882℃

最近在开发数据可是胡大屏地图,发现明明设置了地图选中后的颜色为浅白色,但是鼠标移开后,又变为了黄色,这不是我想要的效果。经过研究发现地图设置有两种,一种是鼠标移入后的颜色,一种是选中后的颜色,分别由两个字段控制。

echarts地图选中后的颜色

选中后的颜色有select控制

selectedMode: "single", //选择模式,单选,只能选中一个地市
select: {//这个就是鼠标点击后,地图想要展示的配置
  disabled: false,//可以被选中
  itemStyle: {//相关配置项很多,可以参考echarts官网
    areaColor: "#77e8e4"//选中
  },
  label: {
    show: true,
    color: '#fff',
    emphasis: {
      color: 'white',
      show: true
    }
  },
},

鼠标移入后的颜色由emphasis控制

emphasis: {
    areaColor: '#abcdda',
    borderWidth: 0,
    color: '#fff'
},

实例

series: [
  {
    type: 'lines',
    z: 10000,
    effect: {
      show: true,
      period: 4, //箭头指向速度,值越小速度越快
      trailLength: 0.1, //特效尾迹长度[0,1]值越大,尾迹越长重
      symbol: 'arrow', //箭头图标
      symbolSize: 4, //图标大小
    },
    tooltip: {
      trigger: 'item',
    },
    label: {
      show: false,
      color: '#fff',
      emphasis: {
        color: 'white',
        show: true
      }
    },

    lineStyle: {
      normal: {
        color: '#11a3ff', // 将飞线颜色更改为红色
        type: 'dashed',
        width: 0.5, //尾迹线条宽度
        opacity: 0.5, //尾迹线条透明度
        curveness: 0.3 //尾迹线条曲直度
      }
    },
    data: fData,
  },
  {
    type: 'map',
    mapType: 'china',
    geoIndex: -1,
    zoom: 1.1, //默认显示级别
    label: {
      show: true,
      color: '#aad0ff',
      emphasis: {
        color: 'white',
        show: true
      }
    },
    itemStyle: {
      normal: {
        areaColor: '#09415f',
        shadowColor: '#09415f',
        borderColor: '#2de7f9',
        borderWidth: 1
      },
      emphasis: {
        areaColor: '#abcdda',
        borderWidth: 0,
        color: '#fff'
      },
    },
    selectedMode: "single", //选择模式,单选,只能选中一个地市
    select: {//这个就是鼠标点击后,地图想要展示的配置
      disabled: false,//可以被选中
      itemStyle: {//相关配置项很多,可以参考echarts官网
        areaColor: "#77e8e4"//选中
      },
      label: {
        show: true,
        color: '#fff',
        emphasis: {
          color: 'white',
          show: true
        }
      },
    },
    data: mapdata
  },
]
喜欢 (0)