Yesterday the company asked to do a static Baidu map image generation to the local function, has not done before, this small summary
Baidu Map API See for yourself (http://developer.baidu.com/map/index.php?title=static)
Of course, first of all to call Baidu Map API, is nothing more than the front desk backstage, I am writing with JS, (http://www.cnblogs.com/kulong995/p/3368048.html) This person writes well, is to write in C # Baidu map, write very good, Can see
Baidu Map is a bunch of messy data stitching out the path, but save the picture needs to use this path, so first to get this path
In the call Baidu API, the first to have Baidu to give you the path to call the line
Like what
Not much to say, directly on the code,
<body onload= "Initmap ()" >Address:<input type= "text" name= "Address" id= "address" value= "Beijing"/> <button id= "Mapsearch" > Search </button> & Lt;input type= "button" id= "Uploadmap" value= "Export map" onclick= "saveimg ()"/> <div style= "width:540px; height:320px; border:1px solid Gray "id=" container "></div> <p> <iframe id=" Testiframe "src=" # "height=" 1 "w Idth= "1" ></iframe> <script type= "Text/javascript" >varMap =NewBmap.map ("container");//Create a Map instance varPoint =NewBmap.point (116.313127, 39.984242);//Create point coordinatesMap.centerandzoom (Point, 13); Map.addcontrol (NewBmap.navigationcontrol ()); Map.addcontrol (NewBmap.scalecontrol ()); Map.addcontrol (NewBmap.overviewmapcontrol ()); varMarker =NewBmap.marker (point);//Create a calloutMap.addoverlay (marker);//add a callout to a mapMarker.enabledragging ();//can be dragged and pulled varStaticwith = 540; varStaticheight = 220; functionInitmap () {varMapsearch = document.getElementById ("Mapsearch"); Mapsearch.onclick=function () { varAddress = document.getElementById ("Address"). Value; if(address = = "Undefined" | | address = = "") {alert ("Please enter an address, then search!" "); return; } varMygeo =NewBmap.geocoder (); Mygeo.getpoint (Address,function(point) {if(point) {marker.setposition (point);//Reset the coordinates of a calloutWindow.settimeout (function() {//Mobile MapMap.panto (point); }, 2000); } }, "Shanghai City"); } //Create a picture varMapsearch = document.getElementById ("Uploadmap"); Mapsearch.onclick=function() {teststaticmap (); } functionGetstaticmap () {if(map = = ' | | map = = ' undefined ' | | marker = = ') { return; } varCenter = map.getcenter (). LNG + ', ' +map.getcenter (). lat; varmarkers = Marker.getposition (). LNG + ', ' +marker.getposition (). lat; varZoom =Map.getzoom (); varStaticmapstr = ' http://api.map.baidu.com/staticimage?center= ' + center + ' &markers= ' + markers + ' &zoom= ' + zoom + ' &width= ' + staticwith + ' &height= ' +Staticheight; //alert (STATICMAPSTR);//Generated picture address returnStaticmapstr; } functionTeststaticmap () {varTestiframe = document.getElementById ("Testiframe"); if(Testiframe = = "undefined" | | testiframe = =NULL|| TESTIFRAME.SRC = = "undefined") { return; } testiframe.src=Getstaticmap (); Testiframe.width=Staticwith; Testiframe.height=Staticheight; Testiframe.document.execCommand ("SaveAs"); alert (testiframe); //Http://api.map.baidu.com/staticimage?center=116.313127,39.984242&markers=116.313127,39.984242&zoom =13&width=540&height=220 //downloadreportimg (Getstaticmap ()); } } </script></body>
function is not fully realized, make a look, this time is already get the image URL,, as long as the Ajax URL to the general processing program. C # Save it, ASHX,
C # Save picture Code snippet:
using (WebClient WC = new WebClient ())
{
Wc. DownloadFile (URL (picture path), SaveFile (save folder Path));
}
Gaocheng!!!
JS call Baidu Map stitching into path, C # save map pictures to local
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
