google infoBox position

Question

Ich versuche meine InfoBox basierend auf dem LatLng der Marker zu positionieren, habe versucht Position (LatLng) aber kein Erfolg und ich möchte nicht den PixelOffset fest codieren, da das nicht der Markerposition entsprechen wird , Habe ich auch pixelOffset (latLng), getPosition und setPosition-Methoden versucht.

Keines der oben genannten scheint richtig zu machen, es zu werden:/

for (var i = data.length - 1; i >= 0; i--){ 
      var Lat = data[i].Item.Coordinate.Lat; 
      var Lon = data[i].Item.Coordinate.Lon; 
      var LatLon = new gm.LatLng(jobLat, +jobLon); 

      var marker = new gm.Marker({ 
       position: LatLon, 
       map: map, 
       visible: true 
      }); 

      var infobox = new InfoBox ({ 
       position: marker.position or LatLon 
      }); 

      marker.newContent = document.getElementById("infobox_"+data[i].Item.Id); 

      gm.event.addListener(marker, 'click', (function (marker) { 
       return function (pin, suppressInfoWindow) { 
        if (!suppressInfoWindow) { 
          infobox.setContent(marker.newContent); 
          infobox.open(map, marker); 
        } 
      } 
} 
resultMarkers.push(marker); 

Dies scheint in Ordnung

var infoboxWidth = -650/2; 
     if(getWidth === 'xs'){ 
      infoboxWidth = -320/2; 
     } 

     var infobox = new InfoBox({ 
      pixelOffset: new gm.Size(infoboxWidth, -65), 
      alignBottom: true 
     }); 

Answer 1

Sie Schleife über Ihre data Arrays arbeiten, Erstellen von Markern.
Jedes Mal initialisieren Sie die Variable neu, um die aktuelle Position des Markers zu verwenden. Am Ende der Schleife haben Sie 1 Variable namens mit der Position des letzten Markers

Wenn Sie dann auf einen Ihrer Marker klicken, wird die Infobox an dieser Position geöffnet. Nicht die Position, die die n-te Iteration der neu erstellten Infobox-Variable im Moment der Erstellung des Markers hatte.

Alles, was Sie tun müssen, ist die Position der Infobox in Ihrem Event Listener.

for (var i = data.length - 1; i >= 0; i--){ 
    var Lat = data[i].Item.Coordinate.Lat; 
    var Lon = data[i].Item.Coordinate.Lon; 
    var LatLon = new gm.LatLng(jobLat, +jobLon); 

    var marker = new gm.Marker({ 
     position: LatLon, 
     map: map, 
     visible: true 
    }); 

    var infobox = new InfoBox(); 

    marker.newContent = document.getElementById("infobox_"+data[i].Item.Id); 

    gm.event.addListener(marker, 'click', (function (marker) { 
     return function (pin, suppressInfoWindow) { 
      if (!suppressInfoWindow) { 
        infobox.setContent(marker.newContent); 
        infobox.setPosition(marker.getPosition()); 
        infobox.open(map, marker); 
      } 
    } 
} 
resultMarkers.push(marker);