百度地图Api进阶教程-地图鼠标左右键操作实例和鼠标样式6.html

来源:互联网 发布:淘宝买家退款率怎么查 编辑:程序博客网 时间:2024/05/02 00:51

转载: http://blog.csdn.net/sd0902/article/details/8478435


[html] view plaincopy
  1. <!DOCTYPE html>  
  2. <html>  
  3. <head>  
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
  5. <title>百度地图</title>  
  6.   
  7.   
  8. <script type="text/javascript">  
  9.     var iscreatr=false;  
  10.     function initialize() {  
  11.         //---------------------------------------------基础示例---------------------------------------------  
  12.         var map = new BMap.Map("allmap",{minZoom:12,maxZoom:20});            // 创建Map实例  
  13.         //map.centerAndZoom(new BMap.Point(116.4035,39.915),15);  //初始化时,即可设置中心点和地图缩放级别。  
  14.         map.centerAndZoom("成都",13);                     // 初始化地图,设置中心点坐标和地图级别。  
  15.         map.enableScrollWheelZoom(true);//鼠标滑动轮子可以滚动  
  16.           
  17.   
  18.         //---------------------------------------------鼠标右键(放大,缩小)操作---------------------------------------------  
  19.         var menu = new BMap.ContextMenu(); //右键菜单  
  20.         var txtMenuItem = [  //右键菜单项目  
  21.             {  
  22.                 text:'放大',  
  23.                 callback:function(){map.zoomIn()}  
  24.             },  
  25.             {  
  26.                 text:'缩小',  
  27.                 callback:function(){map.zoomOut()}  
  28.             },  
  29.             {  
  30.                 text:'放置到最大级',  
  31.                 callback:function(){map.setZoom(18)}  
  32.             },  
  33.             {  
  34.                 text:'查看全国',  
  35.                 callback:function(){map.setZoom(4)}  
  36.             },  
  37.             {  
  38.                 text:'在此添加标注',  
  39.                 callback:function(p){  
  40.                 var marker = new BMap.Marker(p), px = map.pointToPixel(p);  
  41.                     map.addOverlay(marker);  
  42.                 }  
  43.             }  
  44.         ];  
  45.   
  46.   
  47.         for(var i=0; i < txtMenuItem.length; i++){  
  48.             menu.addItem(new BMap.MenuItem(txtMenuItem[i].text,txtMenuItem[i].callback,100)); //菜单添加项目  
  49.             if(i==1 || i==3) {  
  50.                 menu.addSeparator();  //添加右键菜单的分割线  
  51.             }  
  52.         }  
  53.            
  54.         map.addContextMenu(menu);  
  55.   
  56.         //---------------------------------------------改变鼠标样式---------------------------------------------  
  57.         //需要自己制作。cur格式的静态光标  
  58.         //map.setDefaultCursor("url('01.cur')");        //设置地图默认的鼠标指针样式   
  59.         //map.setDraggingCursor("url('03.cur')");         //设置地图拖拽时的鼠标指针样式  
  60.     }  
  61.    
  62.     function loadScript() {  
  63.        var script = document.createElement("script");  
  64.        script.src = "http://api.map.baidu.com/api?v=1.4&callback=initialize";  
  65.        document.body.appendChild(script);  
  66.     }  
  67.    
  68.     window.onload = loadScript;  
  69. </script>  
  70.   
  71.   
  72. </head>  
  73.  <body>  
  74.     <div id="r-result" style="float:left;width:100px;">打印坐标</div>  
  75.     <div id="allmap" style="width: 800px; height: 500px"></div>  
  76. </body>  
  77. </html>  
  78.   
  79. <script type="text/javascript">  
  80.     // 移动到某点 map.panTo(new BMap.Point(116.409, 39.918));    
  81.      // map.setZoom(14);   //放到到14级  
  82. </script> 

原创粉丝点击