<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <style type="text/css"> html { height: 100% } body { height: 100%; margin: 0; padding: 0 } #map_canvas { height: 100% } </style> <script type="text/javascript" src="http://api.map.baidu.com/api?v=1.4"></script> <script type="text/javascript" src="http://developer.baidu.com/map/jsdemo/demo/convertor.js"></script> <title>Ark Zhang Baidu Map</title> <script type="text/javascript"> var map = undefined; var polyline = undefined; var carMarker = undefined; var pointCount = 0; var LatLong = []; //初始化地图显示 function initialize() { map = new BMap.Map("allmap"); var point = new BMap.Point(116.397428, 39.90923); map.centerAndZoom(point, 15); map.enableScrollWheelZoom(); map.addControl(new BMap.NavigationControl({ anchor: BMAP_ANCHOR_TOP_LEFT, type: BMAP_NAVIGATION_CONTROL_SMALL})); //setMapCenter(116.397428, 39.90923); //addTrackLine("116.397,39.909|116.398,39.904|116.394,39.905") } //设置地图大小 function setMapSize(width, height) { var nWidth = parseInt(width); var nHeight = parseInt(height); if (nWidth <= 0 || nHeight <= 0) return ; document.getElementById("map_canvas").style.height = nHeight; document.getElementById("map_canvas").style.width = nWidth; } //设置地图中心位置 function setMapCenter(lng, lat) { if (map == undefined) return; var ggPoint = new BMap.Point(parseFloat(lng), parseFloat(lat)); BMap.Convertor.translate(ggPoint, 2, mapCenterCallback); } //设置地图中心位置坐标转化回调 mapCenterCallback = function (point) { map.setCenter(point); } //移动车辆 function placeCar(id, longitude, latitude, direction) { if (map == undefined) return; var ggPoint = new BMap.Point(parseFloat(longitude), parseFloat(latitude)); BMap.Convertor.translate(ggPoint, 2, placeCarCallback); } //移动车辆坐标转化回调 placeCarCallback = function (point) { if (carMarker != undefined) { carMarker.setPosition(point); return ; } var myIcon = new BMap.Icon("car.PNG", new BMap.Size(32, 32)); carMarker = new BMap.Marker(point, {icon: myIcon}); map.addOverlay(carMarker); } //新增轨迹 function addTrackLine(point_list) { if (map == undefined) return; var Lat = []; var Long = []; var temp = point_list.split("|"); var i = 0; pointCount = temp.length; for(;i < temp.length;i++) { Lat.push(temp[i].split(",")[0]); Long.push(temp[i].split(",")[1]); var ggPoint = new BMap.Point(parseFloat(Long[i]), parseFloat(Lat[i])); BMap.Convertor.translate(ggPoint, 2, addTrackLineCallback); } } //新增轨迹坐标转化回调 addTrackLineCallback = function (point) { // if (polyline != undefined) // { // return ; // } LatLong.push(point); pointCount--; if (!pointCount) { var polyline = new BMap.Polyline(LatLong, {strokeColor:"blue", strokeWeight:6, strokeOpacity:0.5}); map.addOverlay(polyline); } } //删除轨迹 function clearTrackLine() { if (map == undefined) return; //map.clearOverlays(); pointCount = 0; } </script> </head> <body onload="initialize()"> <div id="allmap" style="width:196px;; height:500px;"></div> </body> </html>
可替换前面的google地图，百度地图部分代码没有完全实现
