百度地图

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<script src="http://api.map.baidu.com/api?v=1.3" type="text/javascript"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<style type="text/css">
   html{height:100%}
body{height:100%;margin:0px;padding:0px}
   #search{
    100%;
    height: 5%;
   }
   #main{
float:left;
    height:95%;
100%;
   }
   #result{
    float:left;
    height: 95%;
    0%;
   }
</style>
<title>百度地图源码</title>
</head>

<body>
<div id="search">
    公交路线查询：<input id="begin" />到<input id="end"/><input type="button" id="btn_search" value="搜索"/>
   </div>
   <div id="main"></div>
   <div id="result"></div>
    <script type="text/javascript">
     //创建地图实例
     var map=new BMap.Map("main");

     //创建点坐标
     var point=new BMap.Point(108.95345,34.265865);

     //初始化地图，设置中心点坐标和地图级别
     map.centerAndZoom(point, 15);

     //向地图添加控件
     map.addControl(new BMap.NavigationControl()); //地图平移缩放控件，默认左上角
   map.addControl(new BMap.OverviewMapControl({isOpen: 1})); //缩略地图控件，默认右下角
     map.enableScrollWheelZoom(true);        //启用鼠标滚动缩放地图
     map.enableKeyboard();        //启用键盘上下左右键移动地图


//创建标注 ,并将标注添加到地图中
var marker = new BMap.Marker(point);
map.addOverlay(marker);

//给标注添加事件
marker.addEventListener("click", function(e){
    map.openInfoWindow(infoWindow, e.point); //打开信息窗口
});

//启用标注拖拽功能,并及时获取标注最新位置
marker.enableDragging();
marker.addEventListener("dragend", function(e){
    alert("当前位置：" + e.point.lng + ", " + e.point.lat);
})

//创建信息窗口对象
var opts = {
   width : 100,     // 信息窗口宽度
   height: 50,     // 信息窗口高度
   title : "这是钟楼" //信息窗口标题
}
var infoWindow = new BMap.InfoWindow("", opts);

//公交查询
$("#btn_search").click(function (){
   $("#main").css("width","80%");
   $("#result").css("width","20%");
   var transit = new BMap.TransitRoute(map, {
    renderOptions: {map: map, panel: "result",autoViewport: true }
   });
   transit.search($("#begin").val(), $("#end").val());
});
    </script>
</body>
</html>