使用echarts加载某一个省份的地图（甘肃为例子）

最新推荐文章于 2023-12-15 17:48:45 发布

魏亚强

最新推荐文章于 2023-12-15 17:48:45 发布

阅读量6k

点赞数 5

分类专栏：前端

本文链接：https://blog.youkuaiyun.com/wyq188945/article/details/99694495

版权

前端专栏收录该内容

22 篇文章

订阅专栏

说明：gansu.js是在https://github.com/apache/incubator-echarts/tree/master/map/js/province下载的，里面有每个省份的地图，每个市的地图，
需要注意的是map: ‘甘肃’,需要和你下载的省份的名称对应，否则不会显示地图

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<div id="main" style="height:800px;"></div>
	</body>
	<script type="text/javascript" src="js/echarts.min.js" ></script>
	<script type="text/javascript" src="js/gansu.js"></script>
	<script>
        var chart = echarts.init(document.getElementById('main'));
        chart.setOption({
            series: [{
                type: 'map',
                selectedMode : 'single',
                map: '甘肃',
                itemStyle:{  
                    normal:{label:{show:true}},  
                    emphasis:{label:{show:true}}  
                }
            }]
        });
	</script>
</html>

地图展示
在这里插入图片描述