Подтвердить что ты не робот

Как я могу выбрать функцию выбора 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?

4b9b3361

Ответ 1

Из документации перетаскивания 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