先上图
要求效果是鼠标经过每个乡镇变色，并显示对应乡镇的数据
想着echarts 或者antv L7 有现成的可视化方案，也没放心上，等开始做的时候直接傻眼了，他们都是精确到县级，县级以下的数据都没有， 上看了一些解决方案 ，试了一下，可行的推荐这个链接 Echarts实现区级地图_kuankaka的博客-CSDN博客_echarts 区域地图，不过个人觉得很麻烦（需要自己画出每个乡镇的genjson数据）。自己尝试发现一个临时解决方案。
这个地址可以获取乡镇级别的svg图片 地图图片生成器
（本案例用的是浙江省江山市的。）
获取到的svg图片在VScode中打开，会发现这是啥玩意。
这时我把svg图片直接放到<body></body>中。大概就是这样
效果大概就是这样
在svg最后面，会有这些定点标签。
全局搜path会发现数量对不上，有很多，这时根据这个地方text标签的数量，从后往前保留所有对应数量的path标签。（这样保留的path标签和text标签是一一对应的。）
这里我用的自己写的数据
整个js代码很少，大概就这些
最终效果
有什么其他问题欢迎一起讨论。
这里我手动给path 加上了一个对应数据的name的类名，这里可以和后端约定数据返回的顺序，根据text标签内容来返回，这样前端就不要很麻烦了，再或者字段中加一个和text标签内容对应的字段也可以。
声明：本站部分文章及图片源自用户投稿，如本站任何资料有侵权请您尽早请联系jinwei@zod.com.cn进行处理,非常感谢！