<html>
<head>
<meta charset="utf-8">
</head>
<body>
<div id="main" style="100%; height: 100%;"></div>
</body>
<script src="jquery.min.js"></script>
<script src="echarts.min.js"></script>
<script src="beijing.js"></script>
<script>
var myChart = echarts.init(document.getElementById('main'));
var data = [
{name: '腾翼人家', value: 0},
{name: '千方老鸭汤(房山店)', value: 0},
{name: '李庄大队洗浴中心', value: 0},
{name: '房山李庄', value: 0},
{name: '李庄村五区', value: 1},
{name: '顺德时尚建材公司', value: 0},
{name: '北京腾翼建筑工程公司', value: 0},
{name: '北京房山琉璃河李庄精粉厂', value: 0},
{name: '琉璃河镇李庄村民委员会', value: 0},
{name: '北京市房山区琉璃河红叶老年公寓', value: 0},
{name: '旭东超市', value: 0},
{name: '北京通和生态比较医学研究所', value: 0},
{name: '房山李庄东', value: 0},
{name: '房山李庄北', value: 0},
{name: '中共李庄支部委员会', value: 0},
{name: '燕春饭店', value: 0},
{name: '锦都自助烤涮肉', value: 0},
{name: '燕谷饭店', value: 0},
{name: '美蛙鱼头', value: 0},
{name: '金果林家园', value: 1},
{name: '金果林家园二区-2号楼', value: 1},
{name: '琉璃河二街北区1号', value: 1},
{name: '金果林家园二区-1号楼', value: 1},
{name: '金果林家园一区-2号楼', value: 1},
{name: '金果林家园二区-3号楼', value: 1},
{name: '云吉饭店', value: 0},
{name: '超强华诚超市', value: 0},
{name: '胜利超市', value: 0},
{name: '世纪家家福超市', value: 0},
{name: '易捷便利店(北京市琉璃河综合检查站东北)', value: 0},
{name: '龙江烟酒茶超市', value: 0},
{name: '德安玉雕批发市场', value: 0},
{name: '中国联通(琉璃河营业厅)', value: 0},
{name: '琉璃河中心小学', value: 0},
];
var geoCoordMap = {
'腾翼人家':[116.004851,39.607719],
'千方老鸭汤(房山店)':[116.009839,39.60361],
'李庄大队洗浴中心':[116.009904,39.603522],
'房山李庄':[116.007274,39.604958],
'李庄村五区':[116.006958,39.604256],
'顺德时尚建材公司':[116.007113,39.601652],
'北京腾翼建筑工程公司':[116.005328,39.607787],
'北京房山琉璃河李庄精粉厂':[116.009689,39.603611],
'琉璃河镇李庄村民委员会':[116.009849,39.603719],
'北京市房山区琉璃河红叶老年公寓':[116.006175,39.60797],
'旭东超市':[116.010455,39.603549],
'北京通和生态比较医学研究所':[116.019998,39.604875],
'房山李庄东':[116.010219,39.603194],
'房山李庄北':[116.011672,39.608314],
'中共李庄支部委员会':[116.01003,39.603504],
'燕春饭店':[116.024764,39.600686],
'锦都自助烤涮肉':[116.028952,39.603351],
'燕谷饭店':[116.024158,39.601597],
'美蛙鱼头':[116.026584,39.602208],
'金果林家园':[116.025302,39.601135],
'金果林家园二区-2号楼':[116.026776,39.600456],
'琉璃河二街北区1号':[116.027418,39.603545],
'金果林家园二区-1号楼':[116.026817,39.600814],
'金果林家园一区-2号楼':[116.025762,39.600137],
'金果林家园二区-3号楼':[116.026678,39.600068],
'云吉饭店':[116.023175,39.601689],
'超强华诚超市':[116.026595,39.602407],
'胜利超市':[116.026217,39.60219],
'世纪家家福超市':[116.029862,39.604686],
'易捷便利店(北京市琉璃河综合检查站东北)':[116.024922,39.600208],
'龙江烟酒茶超市':[116.029819,39.60419],
'德安玉雕批发市场':[116.024953,39.601079],
'中国联通(琉璃河营业厅)':[116.027735,39.603554],
'琉璃河中心小学':[116.028069,39.60387],
};
var convertData = function (data) {
var res = [];
for (var i = 0; i < data.length; i++) {
var geoCoord = geoCoordMap[data[i].name];
if (geoCoord) {
res.push({
name: data[i].name,
value: geoCoord.concat(data[i].value)
});
}
}
return res;
};
option = {
backgroundColor: '#404a59',
title: {
text: '功能区',
left: 'center',
textStyle: {
color: '#fff'
}
},
tooltip : {
trigger: 'item'
},
legend: {
orient: 'vertical',
y: 'bottom',
x:'right',
data:['pm2.5'],
textStyle: {
color: '#fff'
}
},
dataRange: {
orient: 'horizontal',
show:true,
precision:1,
splitNumber:2,
min : 0,
max : 1,
color:['red','lightgreen'],
text:['住宅','其他'],
textStyle:{color:'#FFF'}
},
geo: {
map: '北京',
label: {
emphasis: {
show: false
}
},
roam: true,
itemStyle: {
normal: {
areaColor: '#323c48',
borderColor: '#111'
},
emphasis: {
areaColor: '#2a333d'
}
}
},
series : [
{
name: '',
type: 'scatter',
coordinateSystem: 'geo',
data: convertData(data),
symbolSize: 3,
label: {
normal: {
formatter: '{b}',
position: 'right',
show: false
},
emphasis: {
show: true
}
},
itemStyle: {
normal: {
color: '#ddb926'
}
}
} ]
};
myChart.setOption(option);
</script>
</html>

这是现在的样子和数据的样子，求大神帮帮忙