Google Maps api v3 + canvas + chrome вызывает черные ящики на видео YouTube и элементы карты

У меня возникают две проблемы.

Проблема 1 Это происходит только на хроме на маке, проверенных канарейках и более старых версиях.. прямоугольник - это элемент <canvas>.. вот скриншот этого. Кажется, черные прямоугольники - это маркер. Маркер по-прежнему доступен для просмотра, просто не может его увидеть.

enter image description here

Проблема 2 Я получаю черный ящик, охватывающий видео youtube, которые встроены в InfoBubble google maps api v3. Черный ящик обычно уходит, когда вы увеличиваете масштаб после нажатия значка маркера. Это происходит только в Chrome в окнах.

enter image description here

Сайт разработки, на который я ссылаюсь, находится здесь: http://sgaz.mapitusa.com Выберите Health & Wellness and click on the red marker icon.

Я вкладываю в это вознаграждение, так как я не могу получить ответ, и мне нужно его, чтобы переместить этот продукт в статус производства.

Вот GIST кода карты https://gist.github.com/a5515bd0b0139185ea16

вот GIST кода инициализации карты https://gist.github.com/4937a60d2402e99278b0

Update: Вот код iframe, который включает видео youtube:

<iframe width="246" height="125" src="http://www.youtube.com/embed/XFDtfg7RquI" frameborder="0" allowfullscreen=""></iframe>

Черный ящик над видео можно выбрать в chrome → проверять элемент, и это HTML..

<embed width="100%" id="video-player-flash" height="100%" type="application/x-shockwave-flash" src="http://s.ytimg.com/yt/swfbin/watch_as3-vflTsQfnT.swf" allowscriptaccess="always" allowfullscreen="true" bgcolor="#000000" flashvars="el=embedded&amp;fexp=904527%2C913102%2C913601&amp;is_html5_mobile_device=false&amp;allow_embed=1&amp;allow_ratings=1&amp;hl=en_US&amp;use_tablet_controls=0&amp;eurl=http%3A%2F%2Fsgaz.mapitusa.com%2F&amp;iurl=http%3A%2F%2Fi1.ytimg.com%2Fvi%2FXFDtfg7RquI%2Fhqdefault.jpg&amp;view_count=28&amp;probably_logged_in=1&amp;title=GermRid&amp;avg_rating=0&amp;video_id=XFDtfg7RquI&amp;length_seconds=89&amp;sendtmp=1&amp;enablejsapi=1&amp;sk=abu5-utg87bNYJgjGarozMSmFFhRfpxwC&amp;use_native_controls=false&amp;rel=1&amp;playlist_module=http%3A%2F%2Fs.ytimg.com%2Fyt%2Fswfbin%2Fplaylist_module-vflDOq0Br.swf&amp;iurlsd=http%3A%2F%2Fi1.ytimg.com%2Fvi%2FXFDtfg7RquI%2Fsddefault.jpg&amp;jsapicallback=ytPlayerOnYouTubePlayerReady&amp;playerapiid=player1&amp;framer=http%3A%2F%2Fsgaz.mapitusa.com%2F">

Ответы

Ответ 1

Добавьте в свой iFrames следующий стиль:
iframe { -webkit-transform:translate3d(0,0,0); }
Это устранило проблему для меня в Chrome и Safari в Windows 7.

Ответ 2

У вас есть ошибка междоменного скриптинга в Chrome на обеих ОС.

Небезопасная попытка JavaScript для доступа к фрейму с URL-адресом http://sgaz.mapitusa.com/ из фрейма с URL-адресом http://www.youtube.com/embed/XFDtfg7RquI. Домены, протоколы и порты должен соответствовать.

Вы можете использовать (Экспериментальный) API-интерфейс JavaScript API для iframe, чтобы обойти эту проблему. http://code.google.com/apis/youtube/iframe_api_reference.html

Я также получаю ошибку

Uncaught TypeError: свойство 'focus' объекта [object DOMWindow] является не функция http://sgaz.mapitusa.com/ строка 94

В хроме 17.0.9 на Windows XP.