Загрузка файлов блокирует события JavaScript? - PullRequest
0 голосов
/ 30 августа 2011

Я создаю библиотеку .Net со встроенным элементом управления WebBrowser. Библиотека обычно должна обрабатывать карты Google в других приложениях. В основном все важные события API карт Google отправляются на мой c # lib для передачи в приложение, использующее его.

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

function SetMarkerIcon(id, imageUri) {
    markers[id].setIcon(imageUri);
 }

Я отладил проблему и пришел к выводу, что javascript зависает до тех пор, пока файл изображения не загружается, и перестает отвечать на второй щелчок, который должен вызывать событие 'dblclick'. Поэтому мой первый вопрос: правильное ли это мышление?

Исходя из этого предположения, я попытался немного отложить загрузку файла, используя setTimeout:

function SetMarkerIcon(id, imageUri) {
    setTimeout(function () { markers[id].setIcon(imageUri); }, 200);
 }

но очевидно, что это решение очень «грязное» (хотя оно работает в тестовой среде, фактически оно работало с задержкой даже в 0 мс при использовании локальных файлов .js, возможно, из-за своего рода отдельного потока, который использует setTimeout, но не со сценариями на сервер), таким образом, второй вопрос: есть ли у вас какие-либо полезные идеи, как правильно решить эту ошибку?

Заранее спасибо и извините, если вопрос немного расплывчат.

1 Ответ

1 голос
/ 30 августа 2011

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

var pos = new google.maps.LatLng(0, 0);
var url = "/.../sprites.png";             // file with all icons as sprites
var size = new google.maps.Size(24, 24);  // size of 1 sprite
var origin = new google.maps.Point(0, 0);
var anchorPos = new google.maps.Point(12, 12);
var icon = new google.maps.MarkerImage(url, size, origin, anchorPos);
var marker = new google.maps.Marker({       
    position: new google.maps.LatLng(0, 0),       
    map: map,     
    icon: icon
}); 

marker.getIcon().origin = new google.maps.Point(5 * 24, 0);  // set the icon to the 5'th sprite
...