echarts地图demo

poetPg

于 2019-07-23 13:51:55 发布

阅读量1.8k

点赞数 1

分类专栏： js

本文链接：https://blog.youkuaiyun.com/weixin_42488404/article/details/96988902

版权

本文介绍了一个使用echarts制作的江苏各市区学校数统计地图的demo，包括如何引入jq和echarts库，设置地图显示区域，以及解决获取json数据的问题。通过一个获取地区json的网站下载所需数据，并提供了部分关键API的使用和注释，适合echarts地图初学者参考。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

echarts是一款常用的数据可视化工具，不过通常都是用来做折线图，饼图，柱状图之类的图表，很少用到地图，所以我对地图的api就比较陌生。下面是我练习写的一个demo。

上图是江苏各个市区代理的学校数的统计地图。

使用echarts必须引入jq和echarts，然后页面上放置一个显示地图的区域

<div id="map" style="width: 500px;height: 500px;border:1px solid #333;"></div>

绘制地图需要有你所要的地区的json，网上找了很多获取json的材料，很多有bug,无法显示出地图，最终还是找到了这个网站(获取地区json的网站)，在这个网站下载你想要的地区json就可以了，接下来就只剩编写js了。

下面就是上图的代码。

var myChart = echarts.init(document.getElementById('map'));

        myChart.showLoading();

        $.get('js/echart