代码整理-网站集成必应地图

说明

• 网站集成必应地图

操作

• 登录必应地图开发者中心，成为开发者
  • 地址：www.bingmapsportal.com
• 创建一个key
• 核心代码

  <script type='text/javascript' src='https://cn.bing.com/api/maps/mapcontrol?branch=experimental&setmkt=zh-cn&key=YOURKEY&callback=loadMapScenario' async defer></script>
  <script type='text/javascript'>
  window.onload = function () {
      // 必应地图
      let _bingMap = $("#bingMap");
      if (_bingMap.length > 0) {
          function showBingMap() {
              let _map = new Microsoft.Maps.Map(_bingMap.get(0), {});
              let _location = new Microsoft.Maps.Location(30.12345, 120.12345);
              _map.setView({
                  mapTypeId: Microsoft.Maps.MapTypeId.aerial,
                  center: _location,
                  zoom: 15
              });
              let _infoBox = new Microsoft.Maps.Infobox(
                  _location,
                  {title: 'XXX公司', description: '地址：XXX'}
              );
              let _pushpin = new Microsoft.Maps.Pushpin(_location, {title: ''});
              let _layer = new Microsoft.Maps.Layer();
              _layer.add([_pushpin]);
              _map.layers.insert(_layer);
              _infoBox.setMap(_map);
              _infoBox.setOptions({showPointer: true, showCloseButton: true});
          }
  
          showBingMap();
      }
  }
  </script>

  • 注意：记得把加载地图的js代码中的YOURKEY替换成你创建的key