echarts导入geojson最小demo,毫无花里胡哨参数,简单易懂
直接上代码
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>China</title>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/echarts.min.js"></script>
<style>
html, body, div {padding: 0;margin: 0;height: 100%;overflow: hidden;}
</style>
</head>
<body>
<div id="xxx"></div>
<script type="text/javascript">
//拿地图json
//axios请用axios.get
$.get('https://geo.datav.aliyun.com/areas_v2/bound/100000_full.json',(json)=>{
//注册地图
echarts.registerMap("china", json);
//拿标签
echarts.init(document.getElementById('xxx')).setOption({
series: [{
//使用上面注册的地图
map: "china",
//初始化类型写地图
type: "map",
}]
});
})
</script>
</body>
</html>
可导入本地json,把下载好的的json文件放入项目内用get导入即可
如何找地图json
地图选择器
其他参数请参考手册根据项目添加
echarts.series.map 文档