Baidu map API-javascript-web map application,

Baidu map API-javascript-web map application,

Html code

<Div class = "maxwidth"> <div class = "address clearfix"> <div class = "map-box fl"> <div id = "allmap"> </div> </div> <div class = "maptitle fr"> <span> Jianhe Plastic Materials Co., Ltd. </span> <p> Contact person: mr. Hu </p> <p> Email: hudb@pvc123.com </p> <p> contact address: </p> <div class = "qqinline"> <a href = "#"> QQ online consulting </a> </div>/ div> <div class = "mapimg fr">  </div> <div class =" hot ">  </div>

 

Css code

.maxwidth{width:1200px;margin:0px auto;}/*map*/.map-box{background-color:#fff;width:750px;height:538px;border:1px solid #eee;}#allmap{width:730px;height:518px;margin:10px;}span.BMap_Marker label.BMapLabel{border:1px solid #000;border-radius: 3px;}/*map end*/

 

JavaScript code

<Script src = "../js/jquery. min. js"> </script> <script type = "text/javascript" src = "http://api.map.baidu.com/api? Ak = nbAwc69Hb3sgKdGHko1HWhSP & amp; v = 2.0 "> </script> <script type =" text/javascript "> // Baidu map API function var map = new BMap. map ("allmap"); var point = new BMap. point (113.732756, 22.992607); map. centerAndZoom (point, 19); var marker = new BMap. marker (point); // creates a map annotation. addOverlay (marker); // Add the annotation to the map var label = new BMap. label ("Jianhe Plastic Materials Co., Ltd.", {offset: new BMap. size (20,-10)}); label. setStyle ({borderColor: "black"}); // marker. addEventListener ("click", function () {// click the pop-up button to remove the comment marker. setLabel (label); // open the Information Window //}); // click the pop-up button to remove the comment </script>

 

As follows:

 

　　Mark:

Baidu map Builder

Http://api.map.baidu.com/lbsapi/creatmap/index.html

Coordinate System for Baidu map picking
Http://api.map.baidu.com/lbsapi/getpoint/index.html

Baidu map JavaScript API
Http://lbsyun.baidu.com/index.php? Title = jspopular