echarts 绘制地图设置其中某些板块高亮（颜色）

迈不过友情╰ 2022-05-19 12:19 2629阅读 0赞

### 问题描述：当我们用echarts绘制了一个地图，可能需要某个位置高亮。  如下图： ###

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1RvbXdpbGRib2Fy_size_16_color_FFFFFF_t_70][]

其实有个属性，当我们传入的data数据里面加一行就可以改变它是否选中了。具体代码如下。

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1RvbXdpbGRib2Fy_size_16_color_FFFFFF_t_70 1][]

当selected：true  的时候就是显示。

那么就遇到下一个问题，有的板块需要显示有的板块不需要显示怎么办呢？

我的解决办法如下：我把要显示的板块，做成一个json。如下

**var select\_ed = \{"北京":"北京","上海":"上海","湖北":"湖北","黄冈市":"黄冈市"\}**

下面我们在获取名称的时候，只需要判断是否在上面这个json中存在就好了。判断是否存在有个方法（hasOwnProperty  通过键去判断的）  具体写法如下

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1RvbXdpbGRib2Fy_size_16_color_FFFFFF_t_70 2][]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1RvbXdpbGRib2Fy_size_16_color_FFFFFF_t_70]: /images/20220519/55fd15066f8e4dfda921ea60c6998a6e.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1RvbXdpbGRib2Fy_size_16_color_FFFFFF_t_70 1]: /images/20220519/8bfd4a3cd6d0452da2be2aadce9822f8.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1RvbXdpbGRib2Fy_size_16_color_FFFFFF_t_70 2]: /images/20220519/dba5e9dfa72b4ca7898f56ee7e4f1a41.png

发表评论取消回复

表情：

评论列表（有 0 条评论，2629人围观）

还没有评论，来说两句吧...

相关阅读

相关 Echarts中国地图各省份区域设置不同的颜色

摘要：接着《Echarts引入中国地图》续写，我们的项目需求是要求地图的背景颜色要各省份不同。看了文档同时也看了相关官网例子，写出来总结下吧，以便以后需要。实现： 1

红太狼/ 2023年10月11日 15:37/ 0 赞/ 70 阅读

相关 ECharts 地图绘制

地图模拟实例（数据不具真实性仅供学习）在绘制之前我们要了解一些Echarts的一些基本的组件： 1.geo geo 是 ECharts 图表的地理坐标系组件。

傷城~/ 2023年07月07日 05:49/ 0 赞/ 34 阅读

相关 echarts鼠标悬停发光高亮

关键代码： > //鼠标悬停时： > emphasis: { > itemStyle: { > // color: '333FFF

曾经终败给现在/ 2023年01月15日 03:41/ 0 赞/ 472 阅读

相关 Typora设置高亮

Typora设置高亮写在前面的话设置步骤 1、文件 -> 偏好设置（Ctrl+，） 2、Markdown -> Markdown

「爱情、让人受尽委屈。」/ 2022年10月22日 11:53/ 0 赞/ 551 阅读

相关一文搞定 echarts 地图轮播高亮

点击上方前端瓶子君，关注公众号回复算法，加入前端编程面试算法每日一题群 ![7cff578b9361ef9fb281113671269fb7.png][] ?

末蓝、/ 2022年09月11日 00:09/ 0 赞/ 283 阅读

相关 echarts 绘制地图设置其中某些板块高亮（颜色）

问题描述：当我们用echarts绘制了一个地图，可能需要某个位置高亮。如下图： ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow

迈不过友情╰/ 2022年05月19日 12:19/ 0 赞/ 2630 阅读

相关 notepad++设置高亮标记颜色

1. 上一篇文章讲了如何设置高亮快捷键：[https://blog.csdn.net/sinat\_29891353/article/details/83864262][htt

矫情吗；*/ 2022年04月18日 04:52/ 0 赞/ 696 阅读

相关 echarts绘制世界地图部分机场显示

<!DOCTYPE html> <html style="height: 100%";> <head> <meta char

缺乏、安全感/ 2022年04月13日 14:59/ 0 赞/ 523 阅读

相关 OpenCasCade鼠标移动高亮颜色设置与选中颜色设置

OpenCaseCade在鼠标移动至图元时会高亮显示，当图元被选中时默认也会有变化，如何更改高亮的颜色以及选中时的颜色呢这个问题以前自己尝试过自己处理改变，但是自己处理实现

Myth丶恋晨/ 2021年12月23日 16:57/ 0 赞/ 1014 阅读

相关 Echarts3实例 map地图选中高亮显示

前言 Echarts Map中实现点击区域高亮，点击事件实现实现效果 ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5na

Dear 丶/ 2021年09月17日 09:22/ 0 赞/ 2815 阅读