高德地图信息框

最新推荐文章于 2022-11-23 17:40:03 发布

WR男神

最新推荐文章于 2022-11-23 17:40:03 发布

阅读量572

点赞数

文章标签：高德地图

本文链接：https://blog.csdn.net/weixin_43893764/article/details/93007033

版权

在高德地图官网生成了一个地图
想要信息框默认是打开的状态
求怎么改。。
源码

    <html>
    <head>
      <meta charset="utf-8">
      <meta name="keywords" content="高德地图,DIY地图,高德地图生成器">
      <meta name="description" content="高德地图，DIY地图，自己制作地图，生成自己的高德地图">
      <title>高德地图 - DIY我的地图</title>
      <style>
        body { margin: 0; font: 13px/1.5 "Microsoft YaHei", "Helvetica Neue", "Sans-Serif"; min-height: 960px; min-width: 100%; }
        .my-map { margin: 0 auto; width: 100%; height: 500px; }
        .my-map .icon { background: url(http://lbs.amap.com/console/public/show/marker.png) no-repeat; }
        .my-map .icon-cir { height: 31px; width: 28px; }
        .my-map .icon-cir-red { background-position: -11px -5px; }
        .amap-container{height: 100%;}
      </style>
    </head>
    <body>
      <div id="wrap" class="my-map">
        <div id="mapContainer"></div>
      </div>
      <script src="//webapi.amap.com/maps?v=1.3&key=8325164e247e15eea68b59e89200988b"></script>
      <script>
      !function(){
        var infoWindow, map, level = 18,
          center = {lng: 116.442227, lat: 39.923178},
          features = [{type: "Marker", name: "联系我们", desc: "单位名称：王立军刑事辩护网<br/>电话：13301332875<br />邮箱：463661080@qq.com<br />地址：北京市朝阳区朝外大街乙12号昆泰国际大厦16层", color: "red", icon: "cir", offset: {x: -9, y: -31}, lnglat: {lng: 116.442227, lat: 39.923178}}];
  
        function loadFeatures(){
          for(var feature, data, i = 0, len = features.length, j, jl, path; i < len; i++){
            data = features[i];
            switch(data.type){
              case "Marker":
                feature = new AMap.Marker({ map: map, position: new AMap.LngLat(data.lnglat.lng, data.lnglat.lat),
                  zIndex: 3, extData: data, offset: new AMap.Pixel(data.offset.x, data.offset.y), title: data.name,
                  content: '<div class="icon icon-' + data.icon + ' icon-'+ data.icon +'-' + data.color +'"></div>' });
                break;
              case "Polyline":
                for(j = 0, jl = data.lnglat.length, path = []; j < jl; j++){
                  path.push(new AMap.LngLat(data.lnglat[j].lng, data.lnglat[j].lat));
                }
                feature = new AMap.Polyline({ map: map, path: path, extData: data, zIndex: 2,
                  strokeWeight: data.strokeWeight, strokeColor: data.strokeColor, strokeOpacity: data.strokeOpacity });
                break;
              case "Polygon":
                for(j = 0, jl = data.lnglat.length, path = []; j < jl; j++){
                  path.push(new AMap.LngLat(data.lnglat[j].lng, data.lnglat[j].lat));
                }
                feature = new AMap.Polygon({ map: map, path: path, extData: data, zIndex: 1,
                  strokeWeight: data.strokeWeight, strokeColor: data.strokeColor, strokeOpacity: data.strokeOpacity,
                  fillColor: data.fillColor, fillOpacity: data.fillOpacity });
                break;
              default: feature = null;
            }
            if(feature){ AMap.event.addListener(feature, "click", mapFeatureClick); }
          }
        }
    
        function mapFeatureClick(e){
          if(!infoWindow){ infoWindow = new AMap.InfoWindow({autoMove: true}); }
          var extData = e.target.getExtData();
          infoWindow.setContent("<h5>" + extData.name + "</h5><div>" + extData.desc + "</div>");
          infoWindow.open(map, e.lnglat);
        }
    
        map = new AMap.Map("mapContainer", {center: new AMap.LngLat(center.lng, center.lat), level: level});
        
        loadFeatures();
    
        map.on('complete', function(){
          map.plugin(["AMap.ToolBar", "AMap.OverView", "AMap.Scale"], function(){
            map.addControl(new AMap.ToolBar);
          map.addControl(new AMap.OverView);
          map.addControl(new AMap.Scale);
          });
        })
        
      }();
      
      </script>
    
    </body>
    </html>