echart实现地图展示

最近做的页面中需要展示省级地图精确到市级且悬浮到地区上时会显示一些信息

然后参考了网址:

“绿色金融” - 江西省 - category-work,geo地理坐标,legend,series-map地图,series-scatter散点图,title标题,tooltip提示框,visualMap视觉映射 - makeapie echarts社区图表可视化案例

首先我们要获取对应的区域的地图,可以在阿里云数据可视化平台获取地图文件:

DataV.GeoAtlas地理小工具系列

我是选择了其它类型下的FeatureCollection类型然后直接下载到本地,在项目里面引入的

到vue里面实现代码的方式会和样例中有一些不同。

效果图类似:

echart实现地图展示_第1张图片

直接贴出了用到的代码,希望可以提供帮助。

但是实现的时候发现了一个问题平台下载下来的地图文件是有一百多kb的有点大。我们可以尝试使用某些方式来压缩来避免一些可能的问题。

 

你可能感兴趣的:(echarts,前端,javascript)