Как мне заставить работать вместе выбор функций OpenLayers и перетаскивание Javascript?

Я пишу приложение, которое использует OpenLayers, чтобы пользователи могли перетаскивать файлы на заранее определенный набор функции, которые отправляются на сервер с помощью AJAX. Сами файлы представляют собой необработанные данные с геофизического оборудования, которые будут отображаться сервером в виде растрового слоя.

У меня есть перетаскивание для карты:

var mapelem = $id("map");
mapelem.addEventListener("dragover", FileDragHover, false);
mapelem.addEventListener("dragleave", FileDragHover, false);
mapelem.addEventListener("drop", FileSelectHandler, false);

И я выделил при наведении указателя мыши на этот код:

var sf = new OpenLayers.Control.SelectFeature(boxes, {
    hover: true,
    multiple: false,
    highlightOnly: true
});
map.addControl(sf);
sf.activate();

Остальной код в основном представляет собой Пример блоков - вектор.

Проблема в том, что при перетаскивании файла на холст карты выбор при наведении курсора OpenLayers больше не работает, и я хотел бы получить обратную связь, которую он дает пользователю, чтобы убедиться, что он перетаскивает файл там, где он его ожидает.

Я могу получить положение курсора на холсте:

map.events.register("mousemove", map, function(e) { 
    lonlat = map.getLonLatFromPixel(e.xy);
});

Так что я, возможно, смогу провести тест на указатель в этой функции, но было бы неплохо иметь возможность использовать существующую функциональность.

Есть ли способ передать сообщение перетаскивания на мой слой OpenLayers?


javascript drag-and-drop openlayers
person MerseyViking    schedule 21.06.2012    source источник

Ответы (1)


arrow_upward
3
arrow_downward

Из документации MDN по перетаскиванию [1]: «Обратите внимание, что запускаются только события перетаскивания; такие события мыши, как mousemove, не запускаются во время операции перетаскивания ».

Таким образом, вы не сможете зарегистрировать обработчик перетаскивания в div карты. Может быть, вы могли бы попробовать зарегистрировать обработчик перетаскивания для каждой функции. Вот наполовину протестированный код (и только с рендерером SVG):

boxes.features.forEach(function(f){
    elem = $(f.geometry.id);
    elem.addEventListener("dragover", FileDragHover, false);
    elem.addEventListener("dragleave", FileDragHover, false);
    elem.addEventListener("drop", FileSelectHandler, false);
})

Надеюсь, что это поможет.

1 - https://developer.mozilla.org/En/DragDrop/Drag_and_Drop

person tonio    schedule 19.07.2012
comment
тогда вы сможете программно выбрать функцию в своем обработчике. - person tonio; 19.07.2012