Как получить Lat Long движущегося объекта на Google Maps?

Question

Я работаю на карте, и в моей карте я должен построить движущийся объект, используя Animating Symbols статью

мой вопрос заключается в том, что я хочу, чтобы получить расположение движущихся объектов (оживляющий символ).

как символ перемещается между точками A и B, поэтому я хочу знать, на каждом титете его местоположение.

function animateCircle() { 
    var count = 0; 
    window.setInterval(function() { 
     count = (count + 1) % 200; 

     var icons = line.get('icons'); 
     icons[0].offset = (count/2) + '%'; 
     line.set('icons', icons); 

     GetLatLongAtThisPosition(); // i wants to get the current location of here each time   

    }, 20); 
} 

Answer 1

Символ не имеет позиции, но вы можете рассчитать его:

var position = google.maps.geometry.spherical.interpolate(lineCoordinates[0], lineCoordinates[1], (count/200)); 

proof of concept fiddle

function animateCircle() { 
    var infowindow = new google.maps.InfoWindow(); 
    var count = 0; 
    window.setInterval(function() { 
    count = (count + 1) % 200; 

    var icons = line.get('icons'); 
    icons[0].offset = (count/2) + '%'; 
    line.set('icons', icons); 
    var position = google.maps.geometry.spherical.interpolate(lineCoordinates[0], lineCoordinates[1], (count/200)); 
    if (!marker) { 
     marker = new google.maps.Marker({ 
      position: position, 
      map: map 
     }); 
     infowindow.setContent(marker.getPosition().toUrlValue(6)); 
     infowindow.open(map,marker); 
    } else { 
     marker.setPosition(position); 
    } 
    infowindow.setContent(marker.getPosition().toUrlValue(6)); 
    }, 20); 
} 

фрагмент кода:

// This example adds an animated symbol to a polyline. 
 

 
var line; 
 
var marker; 
 
var lineCoordinates; 
 
var map; 
 

 
function initialize() { 
 
    var mapOptions = { 
 
    center: new google.maps.LatLng(20.291, 153.027), 
 
    zoom: 6, 
 
    mapTypeId: google.maps.MapTypeId.TERRAIN 
 
    }; 
 

 
    map = new google.maps.Map(document.getElementById('map-canvas'), 
 
    mapOptions); 
 

 
    lineCoordinates = [ 
 
    new google.maps.LatLng(22.291, 153.027), 
 
    new google.maps.LatLng(18.291, 153.027) 
 
    ]; 
 

 
    // Define the symbol, using one of the predefined paths ('CIRCLE') 
 
    // supplied by the Google Maps JavaScript API. 
 
    var lineSymbol = { 
 
    path: google.maps.SymbolPath.CIRCLE, 
 
    scale: 8, 
 
    strokeColor: '#393' 
 
    }; 
 

 
    // Create the polyline and add the symbol to it via the 'icons' property. 
 
    line = new google.maps.Polyline({ 
 
    path: lineCoordinates, 
 
    icons: [{ 
 
     icon: lineSymbol, 
 
     offset: '100%' 
 
    }], 
 
    map: map 
 
    }); 
 

 
    animateCircle(); 
 
} 
 

 
// Use the DOM setInterval() function to change the offset of the symbol 
 
// at fixed intervals. 
 
function animateCircle() { 
 
    var infowindow = new google.maps.InfoWindow(); 
 
    var count = 0; 
 
    window.setInterval(function() { 
 
    count = (count + 1) % 200; 
 

 
    var icons = line.get('icons'); 
 
    icons[0].offset = (count/2) + '%'; 
 
    line.set('icons', icons); 
 
    var position = google.maps.geometry.spherical.interpolate(lineCoordinates[0], lineCoordinates[1], (count/200)); 
 
    if (!marker) { 
 
     marker = new google.maps.Marker({ 
 
     position: position, 
 
     map: map 
 
     }); 
 
     infowindow.setContent(marker.getPosition().toUrlValue(6)); 
 
     infowindow.open(map, marker); 
 
    } else { 
 
     marker.setPosition(position); 
 
    } 
 
    infowindow.setContent(marker.getPosition().toUrlValue(6)); 
 
    }, 20); 
 
} 
 

 
google.maps.event.addDomListener(window, 'load', initialize);

html, 
 
body, 
 
#map-canvas { 
 
    height: 500px; 
 
    width: 500px; 
 
    margin: 0px; 
 
    padding: 0px 
 
}

<script src="https://maps.googleapis.com/maps/api/js?libraries=geometry&ext=.js"></script> 
 
<div id="map-canvas" style="border: 2px solid #3872ac;"></div>

Answer 2

К сожалению, я не думаю, что вы можете получить Lat Long из SymbolPath с API Карт Google.

Если вы console.logicons[0] вы увидите, что iconobject только путь, масштаб и strokeColor:

console.log(icons[0].icon) 

{ 
    path: 0, 
    scale: 8, 
    strokeColor: "#393" 
}