echarts 根据经纬度坐标在地图上描点

时间:2024-02-29 18:19:04
var mapData = [
{\'latitude\':30.67, \'longitude\':104.07},
{\'latitude\':34.76, \'longitude\':113.65},
{\'latitude\':29.65, \'longitude\':91.13},
{\'latitude\':43.82, \'longitude\':87.62}
]
 
series: [
//根据经纬度在地图上描点
{
type: \'effectScatter\',
coordinateSystem: \'geo\',
// animation: true,
rippleEffect: {
brushType: \'stroke\'
},
symbolSize: function (val,params) {
return 30;
},
data: dmtData.map(function (itemOpt) {
return {
// name: itemOpt.name,
value: [
itemOpt.longitude,
itemOpt.latitude,
// itemOpt.value //数量
],
label: {
emphasis: {
position: \'right\',
show: false
}
},
itemStyle: {
normal: {
// color: itemOpt.color //色值
color: RandomItemStylecolor()
}
}
};
}),
symbolSize: function (val) {
return 5;//描点的大小
},
}
]
 
-----------------------------------------------------------------------------------------------------
 

javaScript向对象数组赋值 存储以下格式的数据:

var mapData = [
{\'latitude\':30.67, \'longitude\':104.07 , \'name\':\'四川\', \'value\':1, \'color\':\'#0394d9\'},
{\'latitude\':34.76, \'longitude\':113.65 , \'name\':\'河南\', \'value\':3, \'color\':\'#d94d02\'},
{\'latitude\':29.65, \'longitude\':91.13 , \'name\':\'*\', \'value\':4, \'color\':\'#b42fd5\'},
{\'latitude\':43.82, \'longitude\':87.62 , \'name\':\'*\', \'value\':5, \'color\':\'#0394d9\'},
]

 

 

//改变成动态数据

$.ajax({
url: "xxxx.do",
type: "POST",
dataType: "json",
data: {
  treeId:86
},
success: function (data) {


var dmtData = [];

for (var i = 0; i < data.length; i++) {

latitude= data[i].latitude;
longitude= data[i].longitude;
dmtData.push({latitude:latitude,longitude:longitude});
}

}

})