百度地圖的使用_第1頁
百度地圖的使用_第2頁
百度地圖的使用_第3頁
百度地圖的使用_第4頁
百度地圖的使用_第5頁
已閱讀5頁，還剩5頁未讀， 繼續(xù)免費閱讀

下載本文檔

版權說明：本文檔由用戶提供并上傳，收益歸屬內(nèi)容提供方，若內(nèi)容存在侵權，請進行舉報或認領

文檔簡介

1、百度地圖使用介紹目錄效果圖：1代碼：1使用方法5修改方法5修改初始地理坐標6百度地圖提供了豐富的查詢接口，這里做一下推廣，演示如何使用它效果圖：代碼：<!DOCTYPE html PUBLIC "-/W3C/DTD XHTML 1.0 Transitional/EN" "/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="/1999/xhtml"><head><meta htt

2、p-equiv="Content-Type" content="text/html; charset=gb2312" /><meta name="keywords" content="百度地圖,百度地圖API，百度地圖自定義工具，百度地圖所見即所得工具" /><meta name="description" content="百度地圖API自定義地圖，幫助用戶在可視化操作下生成百度地圖" /><title>百度地圖API自定義地圖&l

3、t;/title><!-引用百度地圖API-><style type="text/css"> html,bodymargin:0;padding:0; .iw_poi_title color:#CC5522;font-size:14px;font-weight:bold;overflow:hidden;padding-right:13px;white-space:nowrap .iw_poi_content font:12px arial,sans-serif;overflow:visible;padding-top:4px;white-spa

4、ce:-moz-pre-wrap;word-wrap:break-word/*去除百度地圖版權*/.anchorBL display:none; </style><script type="text/javascript" src="</head><body> <!-百度地圖容器-> <div style="width:99%s;height:380px;border:#ccc solid 1px;" id="dituContent"></div>

5、</body><script type="text/javascript"> /創(chuàng)建和初始化地圖函數(shù)： function initMap() createMap();/創(chuàng)建地圖 setMapEvent();/設置地圖事件 addMapControl();/向地圖添加控件 addMarker();/向地圖中添加marker /創(chuàng)建地圖函數(shù)： function createMap() var map = new BMap.Map("dituContent");/在百度地圖容器中創(chuàng)建一個地圖 var point = new BMap.P

6、oint(105.945382,29.361842);/定義一個中心點坐標 map.centerAndZoom(point,15);/設定地圖的中心點和坐標并將地圖顯示在地圖容器中 window.map = map;/將map變量存儲在全局 /地圖事件設置函數(shù)： function setMapEvent() map.enableDragging();/啟用地圖拖拽事件，默認啟用(可不寫) map.enableScrollWheelZoom();/啟用地圖滾輪放大縮小 map.enableDoubleClickZoom();/啟用鼠標雙擊放大，默認啟用(可不寫) map.enableKeyboa

7、rd();/啟用鍵盤上下左右鍵移動地圖 /地圖控件添加函數(shù)： function addMapControl() /向地圖中添加縮放控件var ctrl_nav = new BMap.NavigationControl(anchor:BMAP_ANCHOR_TOP_LEFT,type:BMAP_NAVIGATION_CONTROL_LARGE);map.addControl(ctrl_nav); /向地圖中添加縮略圖控件var ctrl_ove = new BMap.OverviewMapControl(anchor:BMAP_ANCHOR_BOTTOM_RIGHT,isOpen:1);map.

8、addControl(ctrl_ove); /向地圖中添加比例尺控件var ctrl_sca = new BMap.ScaleControl(anchor:BMAP_ANCHOR_BOTTOM_LEFT);map.addControl(ctrl_sca); /標注點數(shù)組 /這里修改參數(shù)，title表示標題；content表示內(nèi)容；point表示初始地理坐標 var markerArr = title:"標題",content:"內(nèi)容",point:"105.945346|29.356868",isOpen:1,icon:w:23,h:

9、25,l:46,t:21,x:9,lb:12 ; /創(chuàng)建marker function addMarker() for(var i=0;i<markerArr.length;i+) var json = markerArri; var p0 = json.point.split("|")0; var p1 = json.point.split("|")1; var point = new BMap.Point(p0,p1);var iconImg = createIcon(json.icon); var marker = new BMap.Mark

10、er(point,icon:iconImg);var iw = createInfoWindow(i);var label = new BMap.Label(json.title,"offset":new BMap.Size(json.icon.lb-json.icon.x+10,-20);marker.setLabel(label); map.addOverlay(marker); label.setStyle( borderColor:"#808080", color:"#333", cursor:"pointer&qu

11、ot; );(function()var index = i;var _iw = createInfoWindow(i);var _marker = marker;_marker.addEventListener("click",function() this.openInfoWindow(_iw); ); _iw.addEventListener("open",function() _marker.getLabel().hide(); ) _iw.addEventListener("close",function() _marker

12、.getLabel().show(); )label.addEventListener("click",function() _marker.openInfoWindow(_iw); )if(!json.isOpen)label.hide();_marker.openInfoWindow(_iw);)() /創(chuàng)建InfoWindow function createInfoWindow(i) var json = markerArri; var iw = new BMap.InfoWindow("<b class='iw_poi_title'

13、title='" + json.title + "'>" + json.title + "</b><div class='iw_poi_content'>"+json.content+"</div>"); return iw; /創(chuàng)建一個Icon function createIcon(json) var icon = new BMap.Icon(" new BMap.Size(json.w,json.h),imageOffset: new

14、BMap.Size(-json.l,-json.t),infoWindowOffset:new BMap.Size(json.lb+5,1),offset:new BMap.Size(json.x,json.h) return icon; initMap();/創(chuàng)建和初始化地圖</script></html>使用方法新建記事本，復制代碼到其中保存，并修改擴展名txt為html雙擊打開變成修改方法用記事本打開Ctrl+f搜索標注點數(shù)組其中有句話var markerArr = title:"標題",content:"內(nèi)容",point

15、:"105.945346|29.356868",isOpen:1,icon:w:23,h:25,l:46,t:21,x:9,lb:12修改title:"新的標題"ontent:"新的內(nèi)容"Ctrl+S保存后效果修改初始地理坐標point:"105.945346|29.356868"首先要獲得你需要的百度地理坐標訪問百度地圖提供的地圖拾取系統(tǒng)比如現(xiàn)在要獲取深圳的坐標百度一下 關鍵字深圳點一下地圖中深圳的某一個位置坐標出現(xiàn)在右上角了然后去修改上述的point:"105.945346|29.356868"為point:"114.063525|22.55999

溫馨提示

  • 1. 本站所有資源如無特殊說明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請聯(lián)系上傳者。文件的所有權益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙，網(wǎng)頁內(nèi)容里面會有圖紙預覽，若沒有圖紙預覽就沒有圖紙。
  • 4. 未經(jīng)權益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 人人文庫網(wǎng)僅提供信息存儲空間，僅對用戶上傳內(nèi)容的表現(xiàn)方式做保護處理，對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯，并不能對任何下載內(nèi)容負責。
  • 6. 下載文件中如有侵權或不適當內(nèi)容，請與我們聯(lián)系，我們立即糾正。
  • 7. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

評論

0/150

提交評論