Я построил круговую диаграмму, которая представляет собой изображение с клиентской картой изображений. Карта изображений изначально определена на странице, но координаты обновляются с помощью манипуляций DOM JavaScript, чтобы сделать что-то полезное. Почему манипулирование DOM для координат карты изображения эффективно только в некоторых браузерах, в то время как другие просто игнорируют изменения? Есть ли простая причина и исправление? Круговую диаграмму можно увидеть в правом нижнем углу: http://catza.net/en/browseall/
Я протестировал это на Windows 7, и оно работает на Chrome 15.0 (WebKit), Firefox 7.0 (Gecko) и Safari 5.1 (WebKit). В этих браузерах отображаются правильные ссылки перехода по секторам к поисковой системе, а также заголовки, когда указатель мыши находится над круговой диаграммой. Internet Explorer 8 (Trident) и Opera 11.52 (Presto) просто придерживаются начальных координат. На основании этого ограниченного тестирования обновление DOM для координат карты изображения работает с Gecko и Webkit, но не с Trident и Presto. Дополнительные результаты теста приветствуются.
Вот некоторая справочная информация о реализации. Источник страницы http://catza.net/en/browseall/ показывает тег изображения <img id="viz_dist "и тег карты <map name="map_dist">. На карте все остальное готово, но нет правильных координат, поскольку они еще не известны. Диаграмма и правильные координаты карты предоставляются Google Image Charts API. Код обновления http://catza.net/js_site/dist.js активируется в $ (документ) .ready , а затем обрабатывает данные JSON, полученные в DOM. JQuery attr . Сброс исходного кода можно найти в Google Code: http://code.google.com/p/catz/
Я знаю, что есть много обходных путей. Я мог бы загрузить координаты на сервер и установить их правильно при создании страницы. Но это означает, что страницу нельзя отправить, пока я не получу координаты от Google. Я мог бы использовать более новые инструменты Google Chart Tools, но мои тесты показывают, что я получаю более быстрое отображение страниц, особенно на медленных рабочих станциях с Google Image Charts API. Я также мог бы динамически создавать теги img и map для DOM, используя JavaScript, но я бы скорее создал полную страницу на сервере.