中国符号地图

梦兮呀

已于 2024-01-02 20:49:07 修改

阅读量463

点赞数 9

文章标签： echarts

于 2024-01-02 20:28:31 首次发布

本文链接：https://blog.csdn.net/isluya/article/details/135349331

版权

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>符号地图</title>
		<script src="js/echarts.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/jquery-1.11.2.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/china.js"></script>
	</head>
	<body>
		
		<div id="main" style="width: 800px; height:600px;"></div>
		<script type="text/javascript">
			
			// 基于准备好的dom，初始化echarts实例
			var myChart = echarts.init(document.getElementById('main'));
			
			var option = {
				geo:{
					type:'map',
					map:'china',
				},
				series:[
					{
						data:[
							{name:'广东省',value:[113.280637,23.125178,110760.94]},
							{name:'西藏自治区',value:[88.388277,31.56375,1902.74]},
						],
						type:'scatter',
						coordinateSystem:'geo',
						symbolSize:function(arg){
							// console.log(arg);
							return Math.sqrt(arg[2])/20;
						}
					}
				]
			};
			
			$.ajax({
				url:'data/GDP2020.json',
				dataType:'json',
				success:function(result){
					// console.log(result);
					var map = echarts.getMap('china');
					var geoCoordMap = {};
					for(let i=0;i<map.geoJson.features.length;i++){
						let p = map.geoJson.features[i]
						geoCoordMap[p.properties.name] = p.properties.centroid
					}
					// console.log(echarts.getMap('china'));
					var retArr = [];
					for(var i = 0; i < result.length; i++){
						var geoCoord = geoCoordMap[result[i].name];
						if (geoCoord){
							retArr.push({
								name:result[i].name,
								value:geoCoord.concat(result[i].value)
							});
						}
					}
					option.series[0].data = retArr;
					// 使用刚指定的配置项和数据显示图表。
					myChart.setOption(option);
				}
			})
			
			
		</script>
	</body>
</html>

GDP2020.json内容

[{"name":"广东省","value":110760.94},
{"name":"江苏省","value":102719},
{"name":"山东省","value":73129},
{"name":"浙江省","value":64613},
{"name":"河南省","value":54997.07},
{"name":"四川省","value":48598.8},
{"name":"福建省","value":43903.89},
{"name":"湖北省","value":43443.46},
{"name":"湖南省","value":41781.49},
{"name":"上海市","value":38700.58},
{"name":"安徽省","value":38680.6},
{"name":"河北省","value":36206.9},
{"name":"北京市","value":36102.6},
{"name":"陕西省","value":26181.86},
{"name":"江西省","value":25691.5},
{"name":"辽宁省","value":25115},
{"name":"重庆市","value":25002.79},
{"name":"云南省","value":24521.9},
{"name":"广西壮族自治区","value":22156.69},
{"name":"贵州省","value":17826.56},
{"name":"山西省","value":17651.93},
{"name":"内蒙古自治区","value":17360},
{"name":"天津市","value":14083.73},
{"name":"新疆维吾尔自治区","value":13797.58},
{"name":"黑龙江省","value":13698.5},
{"name":"吉林省","value":12311.32},
{"name":"甘肃省","value":9016.7},
{"name":"海南省","value":5532.39},
{"name":"宁夏回族自治区","value":3920.55},
{"name":"青海省","value":3005.92},
{"name":"西藏自治区","value":1902.74}]