Google Maps v3 - Delete vertex on Polygon
Google Maps имеет библиотеку Drawing для рисования полилиний, полигонов и других вещей.
Пример этой функциональности здесь: http://gmaps-samples-v3.googlecode.com/svn-history/r282/trunk/drawing/drawing-tools.html
Я хочу, при рисовании и редактировании полигона, иметь возможность удалить одну точку/вершину на пути. В документации по API нет никаких намеков на это.
4 ответа
В настоящее время это невыполненный запрос функции (подтвержденный Google), выпуск 3760 .
Вот мое решение: http://jsbin.com/ajimur/10 . Он использует функцию, которая добавляет кнопку удаления к переданному полигону (под кнопкой отмены).
В качестве альтернативы кто-то предложил этот подход: щелкните правой кнопкой мыши, чтобы удалить ближайшую вершину , которая работает нормально, но в некоторых случаях не хватает изящества пользовательского интерфейса. Я основывался на коде по ссылке, чтобы проверить, был ли щелчок внутри (или в пределах 1 пикселя) узла - в JSBin здесь: http://jsbin.com/ajimur/ .
РЕДАКТИРОВАТЬ: как Амр Бехит указал - этот подход в настоящее время не работает, так как события должны быть привязаны к многоугольнику.
Карты Google теперь предоставляют объект обратного вызова « PolyMouseEvent » для событий, которые запускаются с полигона или полилинии.
Чтобы опираться на другие ответы, в которых предлагалось решение, включающее щелчок правой кнопкой мыши, все, что вам нужно сделать, это следующее в последних версиях API V3:
// this assumes `my_poly` is an normal google.maps.Polygon or Polyline
var deleteNode = function(mev) {
if (mev.vertex != null) {
my_poly.getPath().removeAt(mev.vertex);
}
}
google.maps.event.addListener(my_poly, 'rightclick', deleteNode);
Вы заметите, что любые сложные вычисления того, приближаемся ли мы к этой точке или нет, больше не нужны, поскольку API Карт Google теперь сообщает нам, на какой вершине мы щелкнули.
Примечание: это будет работать только тогда, когда Полилиния / Полигон находится в режиме редактирования. (Именно тогда вершины, которые вы, возможно, захотите удалить, становятся видимыми.)
В качестве заключительной мысли вы могли бы вместо этого использовать событие щелчка или двойного щелчка. «Щелчок» достаточно умен, чтобы не вызывать перетаскивания, хотя использование триггера одним щелчком может все же удивить некоторых ваших пользователей.
Я столкнулся с ситуациями, когда мне нужно было удалить узлы из многоугольников, содержащих несколько путей. Вот модификация кода Шона и Зла:
shape.addListener('rightclick', function(event){
if(event.path != null && event.vertex != null){
var path = this.getPaths().getAt(event.path);
if(path.getLength() > 3){
path.removeAt(event.vertex);
}
}
});
Просто подумал, что я внесу свой вклад, потому что я тоже искал решение для этого, вот моя реализация:
if (m_event.hasOwnProperty('edge') && m_event.edge >= 0 &&
GeofenceService.polygon.getPath().getLength() > 3) {
GeofenceService.polygon.getPath().removeAt(m_event.edge);
return;
}
if (m_event.hasOwnProperty('vertex') && m_event.vertex >= 0 &&
GeofenceService.polygon.getPath().getLength() > 3) {
GeofenceService.polygon.getPath().removeAt(m_event.vertex);
return;
}
Это позволяет обрабатывать удаление вершинных узлов И краевых узлов и поддерживает минимум постоянный многоугольник формирования треугольника, проверяя длину пути> 3.