Im experiencing two problems..
Problem 1
This only happens on chrome on a mac, tried canary and older versions.. the rectangle is a <canvas>
element.. here is a screenshot of it. It appears the black rectangles are where the marker would be. The marker is still clickable, just unable to see it.
Problem 2 I am getting a black box covering youtube videos that are embedded in the InfoBubble of google maps api v3. The black box typically goes away when you zoom in after clicking the marker icon. This only occurs on Chrome in windows.
The development site i am referring to is located here: http://sgaz.mapitusa.com
Select Health & Wellness and click on the red marker icon.
I'm putting a bounty on this, as i can't get an answer and i need one in order to move this product into production status.
Here is a GIST of the map code https://gist.github.com/a5515bd0b0139185ea16
here is a GIST of the map init code https://gist.github.com/4937a60d2402e99278b0
Update: Here is the iframe code that embeds the youtube video:
<iframe width="246" height="125" src="http://www.youtube.com/embed/XFDtfg7RquI" frameborder="0" allowfullscreen=""></iframe>
The black box over the video is selectable in chrome -> inspect element and this is the 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&fexp=904527%2C913102%2C913601&is_html5_mobile_device=false&allow_embed=1&allow_ratings=1&hl=en_US&use_tablet_controls=0&eurl=http%3A%2F%2Fsgaz.mapitusa.com%2F&iurl=http%3A%2F%2Fi1.ytimg.com%2Fvi%2FXFDtfg7RquI%2Fhqdefault.jpg&view_count=28&probably_logged_in=1&title=GermRid&avg_rating=0&video_id=XFDtfg7RquI&length_seconds=89&sendtmp=1&enablejsapi=1&sk=abu5-utg87bNYJgjGarozMSmFFhRfpxwC&use_native_controls=false&rel=1&playlist_module=http%3A%2F%2Fs.ytimg.com%2Fyt%2Fswfbin%2Fplaylist_module-vflDOq0Br.swf&iurlsd=http%3A%2F%2Fi1.ytimg.com%2Fvi%2FXFDtfg7RquI%2Fsddefault.jpg&jsapicallback=ytPlayerOnYouTubePlayerReady&playerapiid=player1&framer=http%3A%2F%2Fsgaz.mapitusa.com%2F">
Event if you switch to satellite or terrain views inside Google maps the black screen still loads app on top of the map. To solve, the problem, all you have to do is just disable hardware acceleration.
If you're using Google Maps content in an online video (e.g. YouTube) primarily for educational, instructional, recreational, or entertainment purposes, you don't need to request permission – but you must still follow our general guidelines and attribute properly.
You have a cross-domain scripting error, in Chrome on both OS's.
Unsafe JavaScript attempt to access frame with URL http://sgaz.mapitusa.com/ from frame with URL http://www.youtube.com/embed/XFDtfg7RquI. Domains, protocols and ports must match.
You can use the (Experimental) JavaScript Player API for iframe embeds to circumvent this issue. http://code.google.com/apis/youtube/iframe_api_reference.html
I also get the error
Uncaught TypeError: Property 'focus' of object [object DOMWindow] is not a function http://sgaz.mapitusa.com/ line 94
In chrome 17.0.9 on windows XP.
Add the following style to your iFrames:iframe { -webkit-transform:translate3d(0,0,0); }
That fixed the problem for me in Chrome and Safari on Windows 7.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With