百度地圖開發js案例:[1]百度地圖開發?

Tags: 地圖, 案例,

建一個名為header.js的文件,把下面的代碼複製

function loadMap()

{

//獲取id為map的div

var id=document.getElementById("Map");

//獲取id為Result的div

var result=document.getElementById("Result");

//註冊監聽事件

$("#resue").click(

function()

{

//判斷輸入書否為空

if($("#begin").val()!=""&&$("#end").val()!=""&&$("#begin").val()!=null&&$("#end").val()!=null)

{

//獲取搜索方式

var way=$('input:radio[name="route"]:checked').val();

//判斷查詢方式

if(way=="bus")

{

//調用百度地圖的公交查詢函數

var transit=new BMap.TransitRoute(map, {

renderOptions: {map: map, panel: result,autoViewport: true}

});

transit.search($("#begin").val(),$("#end").val());

}else if(way=="walk")

{

//調用百度地圖的公交查詢函數

var walk=new BMap.WalkingRoute(map, {

renderOptions: {map: map, panel: result,autoViewport: true}

});

walk.search($("#begin").val(),$("#end").val());

}else if(way=="car")

{

//調用百度地圖的公交查詢函數

var driving=new BMap.DrivingRoute(map, {

renderOptions: {map: map, panel: result,autoViewport: true}

});

driving.search($("#begin").val(),$("#end").val());

}

//顯示信息欄

$("#Result").css("display","block");

}else{

alert("你的輸入有誤,請更正!");

$("#Result").css("display","none");

}

});

//在id中創建百度地圖

var map=new BMap.Map(id);

//設置默認的座標點

var point=new BMap.Point(119.632086,35.513226);

//創建地圖標誌

var marker=new BMap.Marker(point);

var opts = {

width: 300, //定義信息框的寬度

height: 80, //定義信息框的高度

title:"快樂漁家驛站" //定義信息框的標題

}

var infoWindow = new BMap.InfoWindow("地址:秦家樓街道任家臺村19號"+"
"+"電話:(0633)8317956", opts);

//初始化

map.setCurrentCity("日照");

//在地圖上添加標誌

map.addOverlay(marker);

//設置標誌可拖動

//marker.enableDragging();

//地圖平移縮放控件

map.addControl(new BMap.NavigationControl());

//添加比例尺控件

map.addControl(new BMap.ScaleControl());

//添加縮略地圖

map.addControl(new BMap.OverviewMapControl({isOpen:true}));

//啟用地圖類型控件,並設置顯示的類型

map.addControl(new BMap.MapTypeControl({mapTypes: [BMAP_NORMAL_MAP,BMAP_HYBRID_MAP]}));

//啟用滾動縮略控件

map.enableScrollWheelZoom();

//啟用鍵盤伸縮地圖功能

map.enableKeyboard();

//初始化地圖,設置中心點座標和地圖級別

map.centerAndZoom(point, 13);

map.openInfoWindow(infoWindow, map.getCenter());

}

百度地圖開發js案例 (共1篇)

地圖, 案例,
相關問題答案