Sunday, December 20, 2009
Street View Within Flex API for AGS
There is this great sample in our code gallery where a Google Streetview is integrated with a map based on the Flex API for AGS. However, what I wanted is to have the street view to be part of the map, not an HTML sibling element. Found this project (flex-iframe) on google code, where you can display an HTML page inside a flex application. So I went ahead and merged the two projects. One of the requirements is to modify the template html file that is generated by Flex Builder with additional javascript code that enables the bridging between the flash and javascript world. I was not thrilled with fooling around with generated code, then I remembered the JavaScript flex tag by Abdul Qabiz. This flex element enables you to put javascript code _in_ a flex application, and on initialization it will be "evaled" and injected into the parent document DOM. So I merged all three projects together and this is you get. Check out it and tell me what you think. And like usual, the source code is here. There are some gems in there, like a custom symbol and I've adjusted the JavaScript flex tag. I've tried the app on my mac using safari, firefox and chrome, and it worked fine. However, I had issues with firefox on vista. IE worked for me.
Subscribe to:
Post Comments (Atom)
12 comments:
Pretty cool. One minor bug, dunno if it can be solved, if you try to drag the window downwards quickly, it gets stuck sometimes...basically if your mouse passes into the iframe, flash stops getting mouse move events.
Cool idea. The window is just black when it's small - but works if you use full screen mode.
As I said - it is a bit of a hack :-( there is a better seamless solution like earthmine - http://www.earthmine.com/index
Great post! The best solution would be for google to add a StreetView object in their flex api, it is a flash object after all. This has been high on the request list for over a year, but still nothing from google.
I think you have a Dec. 20th post that is spam...for sure the link to the website is interesting.. but needs to be removed, just hope i didn't get a virus going there.
...my comment:
nice job. I've been using this flex/iframe solution for sometime,and it's nice to know someone else approves of it.
I thought the issue of dropping google streetview into the flash player was a done deal... here is a demo from your original reference:
http://development.gcs-holdings.net/flexagsstreetview/
but, I just took a look and they pirated the bottom part of the html page... aagh! fooled me.
nice, so you used the popupmanager title window app from your previous post; and the js-flex-tag is a surprise;
( what is the advantage of keeping the code with your flex app?, oh... you keep related coding in js or as3 more orgainized!)
and the Custom Symbol is great.. I needed that.
I would say the app is not buggie and works just like the iframe always does.
To avoid loosing the mouse and other refresh issues, on mouse down or move/drag on the title bar, the iframe needs to be invisible until your done moving it.
A better work around is if the iframe content could be captured as a bitmap and replaced the iframe on a mouse down event, then refreshed at the same spot once your done on mouse up..
that's a little tough for me, so I just toggle the visible parameter to get around the issue... the trick is getting the right event to set visible to true, I still don't have it right... can you advise?
firefox seems to have a hardtime with iframes in general.. but i do find that some issues are fixed by inserting into the Main html page, the lines -
wmode="opaque" or "wmode", "opaque",
I just looked up the iframe documentation and there are alot of improvements including a section on the top of the wiki, under gotchas. the example html templates that are provided are already set if you need to see how to do this.
I updated my svn link.. i was at version 1.3.2... long before the loading bar component...
Well done... and Thanks!
mansour
any plans to update for the web mercator based services? (rather than the wgs84 ones used now...)
thanks!
-m
sure - will adjust
Mansour - very nice!
Kevin
Thanks, this is great!. I'm receiving an error, m_lastLocation is undefined, in your example. I receive the same error in my implementation.
Here is a quick fix for streetview.html
function setMapLatLonYaw(yaw)
{
try
{
if(m_lastLocation)
{
window.parent.flexApp.setLatLonYaw(m_lastLocation.latlng.lat(), m_lastLocation.latlng.lng(), yaw);
}
}
catch(e)
{
alert(e.message);
}
}
Make sure flush ur browser cache for the change to take effect
hi there
How to set the street name inside the 3D image?
Post a Comment