有了以上函数,综合起来就流程清晰了。以下坐标,均通过坐标拾取器获取。
// 机器类:经度,纬度,名称 function Machine(longitude, latitude, name){ this.longitude = longitude; this.latitude = latitude; this.name = name; } // 确定地图的中心位置与缩放级别 var center = new BMap.Point(110.423997,31.40979); map.centerAndZoom(center, 6); // 级别 6,跨省视图 // 添加图例,自由写 html addLegend("<div>总部:<img src='http://www.likecs.com/head.png' /> 设备:<img src='http://www.likecs.com/machine.png' /></div>"); // 总部位置 var head = { longitude : 112.918702343957, latitude : 28.30070516 }; addMarker(head.longitude, head.latitude, 'head', '总部'); // 所有机器位置 var machineList = [ new Machine(114.876143,38.113315,'石家庄'), new Machine(112.521289,37.822014,'太原'), new Machine(108.989008,34.328175,'西安'), new Machine(117.230997,31.881961,'合肥'), new Machine(103.984944,30.553819,'成都'), new Machine(108.400295,22.862517,'南宁'), new Machine(113.257181,23.169067,'广州'), new Machine(120.174565,30.298715,'杭州'), new Machine(102.881106,24.959705,'昆明') ]; // 添加所有机器并连线 for(var i=0; i<machineList.length; i++){ addMarker(machineList[i].longitude, machineList[i].latitude, 'machine', machineList[i].name); addLine(head.longitude, head.latitude, machineList[i].longitude, machineList[i].latitude); } 3. 结语本文完整代码可从此处下载:
https://github.com/triplestudio/helloworld/blob/master/baidu_map_demo.html
在此基础上,可以根据需要进一步扩展功能,具体参考百度地图开放平台开发文档: