data=[{name:"南京",hjmj:"26",kq:"30",td:"35" },
{name:"徐州",hjmj:"21",kq:"12",td:"30"},
{name:"苏州",hjmj:"4",kq:"",td:"3" }]
//data后台返回的数据。
var NAME = []
var HJMJ = []
var KQ = []
var TD = []
for (var i = 0i <data.lengthi++) {//将json格式转换为Echarts的数组格式
NAME.push(data[i].name || ",")
HJMJ.push(data[i].hjmj || ",")
KQ.push(data[i].kq || ",")
TD.push(data[i].td || ",")
}
var chart = document.getElementById('column')//div的id；
var echart = echarts.init(chart)
var option = {
title: {
padding:50,
text: '江苏省登记统计数'
},
grid: {
x: 100,
y: 100,
borderWidth: 1
},
tooltip: {
trigger: 'axis'
},
legend: {
padding: 50,
data: ['在建矿山','生产矿山','废弃矿山'],
orient: 'horizontal'
},
calculable: false,
xAxis: [
{
type: 'category',
data: NAME
}
],
yAxis: [
{
type: 'value'
}
],
series: [
{
name: '在建矿山',
type: 'bar',
data: HJMJ
},
{
name: '生产矿山',
type:'bar',
data: KQ
},
{
name: '废弃矿山',
type:'bar',
data: TD
},
]
}
echart.setOption(option)
function eConsole(param) {
console.log(param)
}
echart.on("click", eConsole)
})
</script>
<body >
<div id="column" style="width: 1000pxheight: 550pxdisplay:none "></div>//高度，宽度自己定义
</body>
可以在电脑版的echarts地图选择地点然后标记，具体步骤如下：
1、打开echarts地图地图。
2、选择地图功能区中的工具箱，选择标记功能。
3、点击d出的工具箱中的标记标志，选择想要进行标记的地点。
4、标记想要的地点后，输容入标记地点的名称并点击保存。
注意事项：
1、以计算机为主体的电子设备在制图中的广泛应用，地图不再限于用符号和图形表达在纸（或类似的介质）上，它可以数字的形式存储于磁介质上，或经可视化加工表达在屏幕上；
2、由于航天技术的发展，出现了卫星遥感影像，这不但给地图制作提供了新的数据源，还可以把影像直接作为地理事物的表现形式，同时把人们的视野拓展到月球和其他星球。
3、多媒体技术的发展，使得视频、声音等都可以成为地图的表达手段。
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）