Google Maps API v3, пользовательские точки не отображаются - только в Chrome

Question

http://stage.clevelandstreetdistrict.com/map

Если вы заходите на этот сайт в Chrome (или Safari), я получаю Uncaught Error: INDEX_SIZE_ERR: ошибка JavaScript 1 DOM Exception 1, и мои маркеры не отображаются. Во всех других браузерах без веб-сайтов я не вижу этой проблемы. Я чувствую, что это может быть связано с недавним обновлением Chrome, потому что у меня никогда не было этой проблемы раньше. Кто-нибудь может дать мне какие-либо указания относительно того, как выяснить, что вызывает это? Я в полной растерянности.

Вы можете увидеть javascript карты здесь: http://stage.clevelandstreetdistrict.com/javascripts/behaviors/maps.js

Заранее спасибо. Дайте мне знать, какие разъяснения помогут.

-b

ОБНОВЛЕНИЕ: Оказывается, если я укажу немного более старую версию API, например, 3.2, она будет работать. Поэтому я думаю, что собираюсь просто сделать это. Интересно, что изменилось в новейшем API ....

Answer 1

У меня была такая же проблема, и я нашел другое решение.Я не смог вернуться к версии 3.2, потому что я использую API Адресов и загружаю API Карт с помощью Google Loader.

 google.load("maps", "3", {callback: initMap, other_params:"libraries=places&sensor=false"});

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

Как вы можете видеть в этой теме, http://code.google.com/p/gmaps-api-issues/issues/detail?id=3103, отрицательные значения смещения вызывают ошибки в Chrome с API Карт версии 3.4.

new google.maps.Point(-10, 10) // error
new google.maps.Point(0, 0)    // ok

Что я нашелВ результате положительные значения также приводят к ошибке, если они анимируются за пределами изображения (временно становятся отрицательными значениями).Происходит, например, при перетаскивании маркера и перемещении тени.

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

// marker image 57x34px
var src = "http://maps.gstatic.com/intl/en_gb/mapfiles/markers/marker_sprite.png";

var marker = new google.maps.Marker({
  icon:new google.maps.MarkerImage(src, new google.maps.Size(20, 34)),
  shadow:new google.maps.MarkerImage(src, 
         new google.maps.Size(27, 34),
         new google.maps.Point(30, 0), // would throw an error if it was Point(31, 0) because 27 (size) + 31 (origin) is bigger than 57 (image width)
         new google.maps.Point(0, 34))
});

Хитрый.Я надеюсь, что Google исправит это.

Answer 2

Я не мог понять, что именно вызвало это, но я понял, что это как-то связано с последним API и несовместимостью с моим кодом.Оказывается, если я укажу немного более старую версию API, например, 3.2, это сработает.Поэтому я думаю, что собираюсь просто сделать это.Интересно, что изменилось в новейшем API ....

Вы можете указать версию API следующим образом: http://maps.google.com/maps/api/js?v=3.2&sensor=false

Answer 3

Не совсем уверен, что это ваша проблема, но ваш HTML, кажется, искажен при каждом div 'black_box'.(В частности, li):

   <div class="black_box">
   <ul class="menu_links">
    <li class="first">
        <a href="/dining/guide" title="Dining Directory">Dining Directory</a>
    <li>
        <a href="/dining/tonys-pizzeria-ristorante-delicious" title="Tony’s Pizzeria &amp; Ristorante is Delicious Pizza and So Much More">Tony’s Pizzeria &amp; Ristorante is Delicious Pizza and So Much More</a>
    <li class="last">
        <a href="/map/dining" title="Interactive Map">Interactive Map</a>
    </ul>
    </div>

В любом случае, похоже, что инструменты разработчика Chrome указывают на DOM / html, а не на js, что указывает на проблему с html.