溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

百度地圖API-調用后臺接口畫出點位

發(fā)布時間:2020-04-30 01:21:23 來源:網絡 閱讀:1125 作者:lly0205 欄目:web開發(fā)
<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <style type="text/css">
    body, html,#allmap {width: 100%;height: 100%;overflow: hidden;margin:0;font-family:"微軟雅黑";}
    </style>
  <script src="https://cdn.bootcss.com/jquery/1.10.2/jquery.min.js">
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=您的密鑰"></script>
    <title>地圖展示</title>
</head>
<body>
    <div id="allmap"></div>
</body>
</html>
<script type="text/javascript">
    // 百度地圖API功能
    var map = new BMap.Map("allmap");    // 創(chuàng)建Map實例
    map.centerAndZoom(new BMap.Point(110.28670182010947, 20.004970779693032), 10);  // 初始化地圖,設置中心點坐標和地圖級別
    //添加地圖類型控件
    map.addControl(new BMap.MapTypeControl({
        mapTypes:[
            BMAP_NORMAL_MAP,
            BMAP_HYBRID_MAP
        ]}));     
    map.setCurrentCity("???);          // 設置地圖顯示的城市 此項是必須設置的
    map.enableScrollWheelZoom(true);     //開啟鼠標滾輪縮放

    $.ajax({url:"http://114.55.xx.xx:xxxx/cloud/rygl/api/np/v2/cloud/getStaffArea.read?tenantId=5bb0e1c08f254e499e1e5973eb82f294&staffId=f1d5970e0abd4f5db0b9a0e03915cff6&dateStr=2018-06-21",success:function(result){
          var str="";
          var lists=result.data;
           $.each(lists,function(index,dataItem){
            $.each(dataItem,function(index,item){
               var points;
               points=new Array();
               var color=randomHexColor();
               $.each(item,function(index,iItem){
                  var tempPoint=new BMap.Point(iItem.lngDone,iItem.latDone);
                  points.push(tempPoint); 
                 });
               var polyline = new BMap.Polyline(points, {strokeColor:color, strokeWeight:5, strokeOpacity:1});
                  map.addOverlay(polyline);
            });
          });
          alert(result.msg);
        }});

    function randomHexColor() { //隨機生成十六進制顏色
     var hex = Math.floor(Math.random() * 16777216).toString(16); //生成ffffff以內16進制數
     while (hex.length < 6) { //while循環(huán)判斷hex位數,少于6位前面加0湊夠6位
      hex = '0' + hex;
     }
     return '#' + hex; //返回‘#'開頭16進制顏色
    }

</script>
向AI問一下細節(jié)

免責聲明:本站發(fā)布的內容(圖片、視頻和文字)以原創(chuàng)、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯(lián)系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。

AI