Постоянно обновлять границы прямоугольника очень медленно в API Карт Google v3

Question

Я не нашел какого-либо элемента управления для выбора области на карте, которая мне понравилась, поэтому я решил написать свою собственную. Работает нормально, но в IE мучительно медленно обновляет поле выбора. Я использую объект прямоугольника в Google Maps API v3 для отображения области выбора на карте, перерисовывая ее при каждом событии перемещения мыши.

Я нашел похожую реализацию, использующую v2 API, которая работает отлично. Есть ли значительное снижение производительности между v2 и v3, или просто слишком дорого перерисовывать прямоугольник при каждом событии перемещения мыши? Если мой контроль обречен быть медленным, есть ли способ реализовать ту же функциональность другим способом? Я также пытался использовать таймер, чтобы поймать только некоторые движения мыши, но безуспешно.

Я (в первую очередь) не запрашиваю ссылку на работающий элемент управления v3, который не уступает моему, меня больше интересует, что я могу сделать, чтобы оптимизировать собственный код (или, если это тупик) .

Пример моего контроля можно найти здесь: [edit: больше не доступен]

Код Javascript здесь: http://pastie.org/private/6xlg4kqh9hvqqyntbc8bfw

Спасибо.

Answer 1

Очень поздно здесь, но если кто-то другой ищет, как я ... IE 8, кажется, почти бесполезно медленно работает с кругами Google Maps.Собственный код Google: http://code.google.com/apis/maps/articles/mvcfun.html отлично работает на моем старом компьютере с процессором Pentium 4 в Firefox 3.6, Safari 5 и, конечно, Chrome 10, но глупо медленен в IE8.Запуск XP, поэтому я не знаю о IE9.

Answer 2

self._rectangle.setMap(...)

вызовы из функции DrawRectangle для повышения производительности. Вызов setMap каждый раз, когда вы изменяете границы прямоугольника, бесполезен. Просто измените границы.

И звоните

self._rectangle.setMap(self.Map);

только один раз в clickListener при настройке начальной точки прямоугольника.

Хотя я не тестировал его в IE, в Chrome и Firefox произошло серьезное улучшение производительности.

Answer 3

Вы можете попытаться установить тайм-аут, чтобы ограничить ответы при перемещении мыши интервалом, достаточно коротким для вашего браузера.Например:

interval = 100;
waiting = false;

function respond () {
    if (waiting) {
        return;
    }
    waiting = true;
    // do something useful here
    setTimeout('waiting = false;', interval);
}

document.body.onmousemove = respond;

Настройте интервал (в настоящее время 100 миллисекунд или одну десятую секунды) и цель события по своему вкусу, а затем вставьте свой код рендеринга в обратный вызов.