Echarts实战案例代码(56)：geomap实现地区划分区域点击选中高亮效果

漏刻有时

于 2021-02-03 10:56:13 发布

阅读量1.2k

点赞数

分类专栏： echarts

LOCKDATAV出品，为避免断章取义走弯路，请注意环境配置和时间。

本文链接：https://blog.csdn.net/weixin_41290949/article/details/113588896

版权

该博客介绍了如何使用Echarts的geomap组件，结合数据格式和单击事件，实现地图上地区划分区域的点击选中并高亮显示的效果，同时提供了地图封装函数的详细说明。

摘要由CSDN通过智能技术生成

在这里插入图片描述

数据格式

var zjData = [
        {
   "name": "杭州市", "value": 16596, "selected": 0},
        {
   "name": "宁波市", "value": 9714, "selected": 0},
        {
   "name": "温州市", "value": 12065, "selected": 0},
        {
   "name": "绍兴市", "value": 8256, "selected": 0},
        {
   "name": "湖州市", "value": 5820, "selected": 0},
        {
   "name": "嘉兴市", "value": 3915, "selected": 0},
        {
   "name": "金华市", "value": 10942, "selected": 0},
        {
   "name": "衢州市", "value": 8845, "selected": 0},
        {
   "name": "台州市", "value": 9411, "selected": 0},
        {
   "name": "丽水市", "value": 17298, "selected": 0},
        {
   "name": "舟山市", "value": 1440, "selected": 0}
    ];

    var zjData1 = [
        {
   "name": "杭州市", "value": 16596, "selected": 1},
        {
   "name": "宁波市", "value": 9714, "selected": 0},
        {
   "name": "温州市", "value": 12065, "selected"