гугл карты середина полилинии (центроид?) - PullRequest
Новая
       23

гугл карты середина полилинии (центроид?)

3 голосов
/ 19 октября 2011

У меня есть список полилиний, как и в Google Maps делает , когда я нажимаю на ломаную линию, я хочу, чтобы информационное окно отображалось там, где я нажал, и оно прекрасно работает с этой функцией 

function mapsInfoWindow(polyline, content) {
    google.maps.event.addListener(polyline, 'click', function(event) {            
        infowindow.content = content;
        infowindow.position = event.latLng;
        infowindow.open(map);
    });
}

проблема возникает, когда я нажимаю на список (используя ту же функцию для этого), событие , очевидно, не имеет latLng , но я бы хотел, чтобы информационное окно показывалось в любом случае, в середине ломаной линии, как это происходит при нажатии на список в ссылке на Google Maps , о которой я упоминал ранее .

Tried LatLngBounds (); но это дает действительный центр области, которую создают полилинии, а не середину, в которой я нуждаюсь.

Есть идеи, как это сделать?

Ответы [ 5 ]

5 голосов
/ 19 декабря 2011

Так что это (немного хакерское) решение.

Используйте библиотеку http://www.geocodezip.com/scripts/v3_epoly.js, затем подсчитайте общую длину вашей полилинии (разными способами), разделите ее пополам и вызовите .GetPointsAtDistance из epoly.() работает над ним.

Это должно вернуть точку LatLng, но иногда она действует немного странно, возвращая две точки или даже поворачивая эту точку как-то «сломанной».Поэтому самое безопасное, что вы можете сделать, это, вероятно, следующее: 

var pointInHalf = polyline.GetPointsAtDistance(polylineLength);
var pointCoordinate = new google.maps.LatLng(pointInHalf[0].lat(), pointInHalf[0].lng());

Ну, лучше, чем ничего.

4 голосов
/ 01 февраля 2012

С http://www.geocodezip.com/v3_polyline_example_geodesic_proj.html

Без расширений и предполагается, что ломаная является прямой линией.

Возможно преобразовать координаты широты / долготы в положения точки (x, y) и вычислить среднее между ними Это даст вам центральное положение пикселя. Затем вы можете преобразовать эту позицию обратно в значение для построения карты. 

var startLatLng = startMarker.getPosition(); 
var endLatLng = endMarker.getPosition(); 
var startPoint = projection.fromLatLngToPoint(startLatLng); 
var endPoint = projection.fromLatLngToPoint(endLatLng); 
// Average 
var midPoint = new google.maps.Point( 
    (startPoint.x + endPoint.x) / 2, 
    (startPoint.y + endPoint.y) / 2); 
// Unproject 
var midLatLng = projection.fromPointToLatLng(midPoint); 
var midMarker = createMarker(midLatLng, "text");

Дополнительная информация об изменении проекции http://code.google.com/apis/maps/documentation/javascript/reference.html#Projection

2 голосов
/ 21 марта 2016

Может быть и немного староват, но почему бы не добавить информационный блок по клику? 

infowindow.setPosition(event.latLng);
infowindow.open(this.getMap());

Если это клик, то это.

2 голосов
/ 11 сентября 2015

, чтобы получить координаты вашей полилинии, вы должны сделать: 

var widePath = new google.maps.Polyline({
path: waypointsCoordinates,
strokeColor: '#3366FF',
strokeOpacity: 0.0,
editable: true,
draggable: true,                       
strokeWeight: 3
});

и делай: 

var latLng [];
latLng = widePath.getPath().getArray();
2 голосов
/ 19 октября 2011

Итак, во-первых, вам нужно использовать библиотеку геометрии, которая рассчитывает расстояния.Добавьте библиотеки = геометрия к вашему вызову JS, например, 

<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?libraries=geometry"></script>

Предполагая, что вы знаете начальную и конечную точки вашей полилинии, вы сможете сделать это: 

var inBetween = google.maps.geometry.spherical.interpolate(startLatlng, endLatlng, 0.5);  
infowindow.position = inBetween;

Iугадайте, если вы еще не знаете начальную и конечную точки, вы можете решить это из polyline.getPath ().

...