UPDATE:
Я выпустила библиотеку расширений: https://bitbucket.org/mutopia/earth
См https://bitbucket.org/mutopia/earth/src/master/sample/index.html, чтобы запустить его.
См drag() method in the sample code class, который вызывает setDragMode()
и addDragEvent()
разрешить перетаскивание из KmlPolygon
.
Я успешно реализовал это при помощи takeOverCamera в earth-api-utility-library и три событий:
setDragMode: function (mode) {
// summary:
// Sets dragging mode on and off
if (mode == this.dragMode) {
Log.info('Drag mode is already', mode);
} else {
this.dragMode = mode;
Log.info('Drag mode set', mode);
if (mode) {
this.addEvent(this.ge.getGlobe(), 'mousemove', this.dragMouseMoveCallback);
this.addEvent(this.ge.getGlobe(), 'mouseup', this.dragMouseUpCallback);
this.addEvent(this.ge.getView(), 'viewchange', this.dragViewChange, false);
} else {
this.removeEvent(this.ge.getGlobe(), 'mousemove', this.dragMouseMoveCallback);
this.removeEvent(this.ge.getGlobe(), 'mouseup', this.dragMouseUpCallback);
this.removeEvent(this.ge.getView(), 'viewchange', this.dragViewChange, false);
}
}
},
Это в коммунальной библиотеке в гораздо более крупном проекте. dragMode
- булев, который добавляет и удаляет события. Эти три события управляют тем, что происходит при перетаскивании. addEvent
и removeEvent
мои собственные функции оболочки:
addEvent: function (targetObject, eventID, listenerCallback, capture) {
// summary:
// Convenience method for google.earth.addEventListener
capture = setDefault(capture, true);
google.earth.addEventListener(targetObject, eventID, listenerCallback, capture);
},
removeEvent: function (targetObject, eventID, listenerCallback, capture) {
// summary:
// Convenience method for google.earth.removeEventListener
capture = setDefault(capture, true);
google.earth.removeEventListener(targetObject, eventID, listenerCallback, capture);
},
не обращая внимания на мелкие детали, все важные вещи в обратных вызовах к этим событиям. Событие mousedown
блокирует камеру и устанавливает многоугольник, который я перетаскиваю как dragObject
(это просто переменная, которую я использую). Он сохраняет исходные длинные координаты.
this.dragMouseDownCallback = lang.hitch(this, function (event) {
var obj = event.getTarget();
this.lockCamera(true);
this.setSelected(obj);
this.dragObject = obj;
this.dragLatOrigin = this.dragLatLast = event.getLatitude();
this.dragLngOrigin = this.dragLngLast = event.getLongitude();
}
В mousemove
обновлении обратного вызова в последние Lat Long координаты:
this.dragMouseMoveCallback = lang.hitch(this, function (event) {
if (this.dragObject) {
var lat = event.getLatitude();
var lng = event.getLongitude();
var latDiff = lat - this.dragLatLast;
var lngDiff = lng - this.dragLngLast;
if (Math.abs(latDiff) > this.dragSensitivity || Math.abs(lngDiff > this.dragSensitivity)) {
this.addPolyCoords(this.dragObject, [latDiff, lngDiff]);
this.dragLatLast = lat;
this.dragLngLast = lng;
}
}
});
Здесь я использую некоторые фантазии значение чувствительности, чтобы предотвратить обновление этого слишком часто.Наконец, addPolyCoords
также является моей собственной функцией, которая добавляет длинные значения к существующим координатам многоугольника - эффективно перемещая его по всему миру. Я делаю это со встроенными функциями setLatitude()
и setLongitude()
для каждой координаты. Вы можете получить координаты, как это так, где многоугольник является KmlPolyon
объект:
polygon.getGeometry().getOuterBoundary().getCoordinates()
И конечно, mousedown
обратного вызова выключает режим перетаскивания так, что перемещение мыши не продолжает тянуть многоугольник:
this.dragMouseUpCallback = lang.hitch(this, function (event) {
if (this.dragObject) {
Log.info('Stop drag', this.dragObject.getType());
setTimeout(lang.hitch(this, function() {
this.lockCamera(false);
this.setSelected(null);
}), 100);
this._dragEvent(event);
this.dragObject = this.dragLatOrigin = this.dragLngOrigin = this.dragLatLast = this.dragLngLast = null;
}
});
и, наконец, _dragEvent
призван обеспечить, чтобы конечные координатами являются фактическими координатами события мышей отделанного (а не последним mousemove
вызова):
_dragEvent: function (event) {
// summary:
// Helper function for moving drag object
var latDiff = event.getLatitude() - this.dragLatLast;
var lngDiff = event.getLongitude() - this.dragLngLast;
if (!(latDiff == 0 && lngDiff == 0)) {
this.addPolyCoords(this.dragObject, [latDiff, lngDiff]);
Log.info('Moved ' + latDiff + ', ' + lngDiff);
}
},
Обратный вызов mousemove
не слишком важен и может быть фактически проигнорирован - единственная причина, по которой я его использую, - показать перемещение многоугольника, когда пользователь перемещает свою мышь. Удаление этого объекта приведет к перемещению объекта, когда они поднимут мышь.
Надеюсь, этот невероятно длинный ответ даст вам некоторое представление о том, как реализовать перетаскивание в API Google Планета Земля. И я также планирую выпустить свою библиотеку в будущем, когда я сглажу кинки :)
Я обновил свой ответ библиотекой, чтобы справиться с этим ниже. –