摘要：
建立Html文件；内容是：1＜html＞2＜head＞3＜metahttp equiv=“content Type”content=“text/html；charset=utf-8”/˃4＜metaname=“viewport”content=”initial scale=1.0，user scale=no“/˃5＜styletype=”text/css“˃6body，html｛100%；
创建.html文件；
内容为：
1 <html> 2 <head> 3 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 4 <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 5 <style type="text/css"> 6 body, html{ 100%;height: 100%;margin:0;font-family:"微软雅黑";} 7 #allmap{height:500px;100%;} 8 #r-result{100%; font-size:14px;} 9 </style> 10 <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=你自己的密钥"></script> 11 <title>城市名定位</title> 12 </head> 13 <body> 14 <div id="allmap"></div> 15 <div id="r-result"> 16 经度: <input type="text" /> 17 纬度: <input type="text" /> 18 <input type="button" value="查询" onclick="theLocation()" /> 19 </div> 20 </body> 21 </html> 22 <script type="text/javascript"> 23 // 百度地图API功能 24 var map = new BMap.Map("allmap",{ 25 minZoom : 1, 26 maxZoom : 20 27 }); 28 //初始化地图，设置坐标点在哪 29 map.centerAndZoom(new BMap.Point(117.283641,31.773978),20); 30 map.enableScrollWheelZoom(true); 31 32 //设置标注图片 33 var icon = new BMap.Icon("car_2.png",new BMap.Size(35,30),{ 34 anchor:new BMap.Size(10,0) 35 }); 36 37 // 用经纬度设置地图中心点 38 function theLocation(){ 39 if(document.getElementById("longitude").value != "" && document.getElementById("latitude").value != ""){ 40 map.clearOverlays(); 41 var new_point = new BMap.Point(document.getElementById("longitude").value,document.getElementById("latitude").value); 42 var marker = new BMap.Marker((new_point),{ 43 icon:icon 44 }); 45 map.addOverlay(marker); // 将标注添加到地图中 46 map.panTo(new_point); 47 } 48 } 49 function addpoint (x,y){ 50 map.clearOverlays(); 51 var ggPoint = new BMap.Point(x,y); 52 var marker = new BMap.Marker((ggPoint),{ 53 icon:icon 54 }); 55 //var marker = new BMap.Marker(ggPoint); 56 map.addOverlay(marker); 57 map.panTo(ggPoint); 58 } 59 60 61 </script>
QT下运行：
输入经纬度，点击查询按钮，标记为自定义的汽车图片
