Скрипт гугл карт с 2 на третью версию

S
На сайте с 21.12.2019
Offline
44
148

Добрый вечер, есть такой скрипт 

<script type="text/javascript">
    function pad(num, count) {
      var lenDiff = count - String(num).length;
      var padding = "";
      
      if (lenDiff > 0)
        while (lenDiff--)
          padding += "0";
      
      return padding + num;
    }

    function Rectangle(bounds, opt_weight, opt_color) {
      this.bounds_ = bounds;
      this.weight_ = opt_weight || 2;
      this.color_ = opt_color || "#888888";
    }
    Rectangle.prototype = new GOverlay();

    Rectangle.prototype.initialize = function(map) {
      var div = document.createElement("div");
      div.style.border = this.weight_ + "px solid " + this.color_;
      div.style.position = "absolute";

      map.getPane(G_MAP_MAP_PANE).appendChild(div);

      this.map_ = map;
      this.div_ = div;
    }

    Rectangle.prototype.remove = function() {
      this.div_.parentNode.removeChild(this.div_);
    }

    Rectangle.prototype.copy = function() {
      return new Rectangle(this.bounds_, this.weight_, this.color_,
                           this.backgroundColor_, this.opacity_);
    }

    Rectangle.prototype.redraw = function(force) {

      if (!force) return;

      var c1 = this.map_.fromLatLngToDivPixel(this.bounds_.getSouthWest());
      var c2 = this.map_.fromLatLngToDivPixel(this.bounds_.getNorthEast());

      this.div_.style.width = Math.abs(c2.x - c1.x) + "px";
      this.div_.style.height = Math.abs(c2.y - c1.y) + "px";
      this.div_.style.left = (Math.min(c2.x, c1.x) - this.weight_) + "px";
      this.div_.style.top = (Math.min(c2.y, c1.y) - this.weight_) + "px";
    }

    function initialize() {
      var myLatlng = new google.maps.LatLng(55.7, 37.5);
      var myOptions = {
      zoom: 6,
      center: myLatlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }
 
    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

        google.maps.event.addListener(map,"click", function(overlay,latlng) {     
          if (latlng) {   
            var lat = latlng.lat();
            var lon = latlng.lng();

            map.clearOverlays();
            var rectBounds = new google.maps.LatLngBounds(
                new google.maps.LatLng(Math.floor(lat/2)*2,   Math.floor(lon/3)*3), 
                new google.maps.LatLng(Math.floor(lat/2)*2+2, Math.floor(lon/3)*3+3));
            map.addOverlay(new Rectangle(rectBounds));
            var rectBounds = new google.maps.LatLngBounds(
                new google.maps.LatLng(Math.floor(lat*3)/3,     Math.floor(lon*2)/2), 
                new google.maps.LatLng(Math.floor(lat*3)/3+1/3, Math.floor(lon*2)/2+1/2));
            map.addOverlay(new Rectangle(rectBounds, 1, "#222222"));

            var plat = lat;
            var plon = lon;

            var ltr = (plat<0 ? "x" : "" ) + String.fromCharCode("A".charCodeAt(0) + Math.abs(plat) / 4); 
            var sq001 = ltr + "-" + Math.floor((plon+180)/6+1).toFixed(0);
            var sq500 = sq001 + "-" + (1 + 2   -  2*Math.floor(((plat+100)%4)/2)   + Math.floor(((plon+180)%6)/3) ).toFixed(0);
            var sq200 = sq001 + "-" + pad( Math.ceil(1 + 30  -  6*Math.floor(((plat+100)%4)/2*3) + Math.floor(((plon+180)%6))),   2 );
            var sq100 = sq001 + "-" + pad( Math.ceil(1 + 132 - 12*Math.floor(((plat+100)%4)*3)   + Math.floor(((plon+180)%6)*2)), 3 );
            var sq050 = sq100 + "-" + (1 + 2   -  2*Math.floor(((plat+100)%(1/3))*6)   + Math.floor(((plon+180)%(1/2))*4) ).toFixed(0);
            var sq025 = sq050 + "-" + (1 + 2   -  2*Math.floor(((plat+100)%(1/6))*12)   + Math.floor(((plon+180)%(1/4))*8) ).toFixed(0);

            var myHtml = "<table><tr><td>WGS: <td>(" + lat.toFixed(5) + ", " + lon.toFixed(5) + ")" + 
//                "<tr><td>Pulkovo: <td>(" + plat.toFixed(5) + ", " + plon.toFixed(5) + ")" +
                "</table>" + 
                "<table>" + 
                "<tr><td> 1 : 1000000 </td><td> " + sq001 + " </td>" +
                "<tr><td> 1 : 500000 </td><td> " + sq500 + " </td>" +
                "<tr><td> 1 : 200000 </td><td> " + sq200 + " </td>" +
                "<tr><td> 1 : 100000 </td><td> " + sq100 + " </td>" +
                "<tr><td> 1 : 50000 </td><td> " + sq050 + " </td>" +
                "<tr><td> 1 : 25000 </td><td> " + sq025 + " </td>" +
                "</table>";
            map.openInfoWindow(latlng, myHtml);
          }
        });

      }
    </script>

Ранее он работал на второй версии APi Гугл карт, но на третьей уже нет. Подскажите, как его подогнать под третью версию? 

Частично код уже подогнал, карта стала отображаться, но функционал не работает, а именно при клике на карту должна всплывать информация. По идее все дело в GOverlay но как это решить не знаю вообще. Скрипт был готовый и поэтому за помощью пришел сюда. Сам не решу. Спасибо! 

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий