Question

在“谷歌地图”中,该地图覆盖了100%的广度,大约占100%,我有横向透明,用Z-index和CSS将地图左侧推上。

当我生动地增加我的标识时,我首先用空洞的博隆物体,将其一带延伸到一带,以遏制新的拉坦。然而,有时,标识出现在我具有透明度的四下,包含其他内容。

我要说的是,我的透明四分五位,宽250个。

我想做的是,一旦我划定了显示所有标识的束缚,我再一次延长它们,以扩大谷歌地图的浏览量,这样,如果我适应这些束缚,这些标识现在就在离左边至少看上去了250个 p子,以便它们不受透明四分五裂的影响。

我尝试使用<条码>Map Projection. FromPoint ToLatLng和MapCanvas Projection. FromDiv Point ToLatLng,但因之未能取得可预测的结果。

欢迎任何建议或实例。

Answer 1

希望这一迅速和 d脏的解决办法将有助于(即APIC诉3)

<html>
  <head>
    <style>
      #over {
        position: absolute;
        z-index: 99999;
        width: 250px;
        height: 600px;
        opacity: 0.7;
        top: 0px;
        border: 2px solid black;
        left: 0px;
        background: white;
      }
    </style>

    <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
    <title>Google Maps Bounds</title>
    <script src="http://code.jquery.com/jquery-1.4.4.js"></script>
    <script
      type="text/javascript"
      src="http://maps.google.com/maps/api/js?sensor=false"
    ></script>
    <script type="text/javascript">
      var map;
      var bounds;
      var overlay;
      //the witdh of your overlay (probably should get it dynamically
      var overlayWidth = 250;

      function initialize() {
        var chicago = new google.maps.LatLng(41.875696, -87.624207);
        var myOptions = {
          zoom: 11,
          center: chicago,
          mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        map = new google.maps.Map(
          document.getElementById("map_canvas"),
          myOptions
        );
        overlay = new google.maps.OverlayView();

        overlay.draw = function() {};

        overlay.setMap(map);
      }

      function addMarker() {
        maywood = new google.maps.LatLng(41.8823, -87.8487);
        var marker = new google.maps.Marker({
          position: maywood,
          map: map
        });
        bounds = map.getBounds();

        point = overlay.getProjection().fromLatLngToContainerPixel(maywood);
        //point is under overlay
        if (point.x < overlayWidth) {
          //calculate offset by which to extend
          offset = new google.maps.Point(point.x - overlayWidth, 0);
          extendByX = overlay
            .getProjection()
            .fromContainerPixelToLatLng(offset);
          //here you might want to check if all your existing markers will fit into new bounds before applying the new bounds
          newBounds = new google.maps.LatLngBounds(
            extendByX,
            bounds.getNorthEast()
          );
          map.fitBounds(newBounds);
        }
      }
    </script>
  </head>
  <body onload="initialize()">
    <div id="over">OVERLAY</div>
    <div id="map_canvas" style="width: 900px;height: 600px;"></div>
    <input
      type="button"
      value="Add Marker & Expand Bounds"
      onclick="addMarker()"
    />
  </body>
</html>

友情链接