zoukankan      html  css  js  c++  java
  • 【web端】百度地图api

    百度地图js加载

    页面引入:

    修改申请的密钥:<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=您的密钥"></script>

    下面的js跟css用于点击创建的地图标注弹窗信息框
    <script type="text/javascript" src="http://api.map.baidu.com/library/SearchInfoWindow/1.5/src/SearchInfoWindow_min.js"></script>
    <link rel="stylesheet" href="http://api.map.baidu.com/library/SearchInfoWindow/1.5/src/SearchInfoWindow_min.css" />

    // 百度地图   经度 纬度 地址信息
            function showMap(Longitude, Latitude,address) {
                setTimeout(function () {//添加延时加载。解决问题地图缩放
                    var map = new BMap.Map("maps");
                    var myCity = new BMap.LocalCity();
                    myCity.get(function (res) {
                        map.centerAndZoom(res.center, res.level);
                    });
                    //根据经纬度添加地图标签
                    if(Longitude!=""&&Longitude!=null&&Latitude!=null&&Latitude!=""){
                          var new_point = new BMap.Point(Longitude,Latitude);
                          var marker = new BMap.Marker(new_point);  // 创建标注
                          map.addOverlay(marker);    
                          map.centerAndZoom(new_point, 15);
                      //添加点击标注弹窗
                          var searchInfoWindow3 = new BMapLib.SearchInfoWindow(map, address, {
                              title: "地址信息", //标题
                               290, //宽度
                              height: 40, //高度
                              panel : "panel", //检索结果面板
                              enableAutoPan : true, //自动平移
                              searchTypes :[
                              ]
                          });
                          marker.addEventListener("click", function(){          
                              searchInfoWindow3.open(marker);
                          });
                    }
                    map.enableScrollWheelZoom(true);
                }, 300);
            }
  • 相关阅读:
    node 父子进程传递对象
    js 按照字母进行分组
    native react 代码智能提示
    VScode 使用emmet
    c# webapi swagger
    c# 前台和后台线程
    Java——字节和字符的区别
    Java——类的访问修饰符
    Java——面向对象
    Java——内存中的数组
  • 原文地址:https://www.cnblogs.com/miskis/p/5557196.html
Copyright © 2011-2022 走看看