本文档介绍了如何使用Echarts在地图上添加纹理，通过HTML和JavaScript实现，详细展示了代码示例，包括数据映射、纹理应用和解决鼠标移入覆盖问题的方法。同时，提供了版本信息、注意事项和解决高亮问题的方案，以及最终效果展示。适用于Echarts地图可视化开发人员参考。
有个可视化需求给地图添加纹理，翻了好久没翻到成品，希望这篇文章对后面的人有所帮助吧。
虽然echarts文档里面也有说明，但是echarts文档对一些配置属性确实不敢恭维
实现是以html实现的，vue其实一样的道理，不会差距太大
html代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script type="application/javascript" src="js/echarts.js"></script>
<script type="application/javascript" src="js/jquery.min.js"></script>
</head>
<body style="background: url(img/bg.png);background-repeat: no-repeat;background-size: 100%;overflow: hidden;">
<div style="width: 100%;height: 100vh;" id="map"></div>
<img src="img/1.jpg" id="img1" style="display: none;" />
<img src="img/2.jpg" id="img2" style="display: none;" />
<img src="img/3.jpg" id="img3" style="display: none;" />
<img src="img/4.jpg" id="img4" style="display: none;" />
<img src="img/5.jpg" id="img5" style="display: none;" />
&l
最低0.47元/天 解锁文章
扫一扫
1806
到【灌水乐园】发言
