AIR and Google Maps Javascript V3 Street View

Question

I'm getting super crazy with an SWF, ran by Windows 7 Adobe AIR runtime, and Google Maps Javascript V3 embedded into a super-basic html page.

The SWF just load the latter html and shows the map.

Navigation through the classics 2d map works perfectly but, when the street view mode starts, air generate tons of javascript errors. The same html, loaded by any browser, works flawlessly.

I created a super simple SWF as proof of concept. This is the super minimal mxml source code:

<mx:WindowedApplication
    xmlns:mx="http://www.adobe.com/2006/mxml"
    creationComplete="init();"
>
    <mx:UIComponent
        id="bxMap"
        width="100%" height="100%"
    />

    <mx:Script>
    <![CDATA[

    private var _browser:HTMLLoader;
    private var _sprite:Sprite;

    private function init():void {

        _browser = new HTMLLoader();
        _browser.width = bxMap.width;
        _browser.height = bxMap.height;
        _sprite = new Sprite();

        _browser.addEventListener(Event.COMPLETE, map_Ready);
        _browser.load(new URLRequest("https://google-developers.appspot.com/maps/documentation/javascript/examples/full/map-simple?hl=it"));
    }

    private function map_Ready(event:Event):void {

        _sprite.addChild(_browser);
        bxMap.addChild(_sprite);

    }

    ]]>
    </mx:Script>

</mx:WindowedApplication>

As you can see, the html is taken from a google example, so it should not contain any kind of weird stuff... Anyway, i tried also super minimal html written by me and the same problem occours.

This is the typical javascript error catched by AIR console. Just move the mouse around in the street view to generate hundreds of error like this:

TypeError: Result of expression 'a' [undefined] is not an object.
Hu at  : 2
 at  : 9
ag at https://maps.gstatic.com/intl/it_it/mapfiles/api-3/14/3/main.js : 25
 at https://maps.gstatic.com/intl/it_it/mapfiles/api-3/14/3/main.js : 24
lC at  : 13
 at  : 10
 at https://maps.gstatic.com/intl/it_it/mapfiles/api-3/14/3/main.js : 9
 at https://maps.gstatic.com/intl/it_it/mapfiles/api-3/14/3/main.js : 19
 at https://maps.gstatic.com/intl/it_it/mapfiles/api-3/14/3/main.js : 21
 at https://maps.gstatic.com/intl/it_it/mapfiles/api-3/14/3/main.js : 19
 at https://maps.gstatic.com/intl/it_it/mapfiles/api-3/14/3/main.js : 21
 at https://maps.gstatic.com/intl/it_it/mapfiles/api-3/14/3/main.js : 19
Fr at  : 73
 at  : 72
 at https://maps.gstatic.com/intl/it_it/mapfiles/api-3/14/3/main.js : 20

Any idea about why this happens and how to get rid of it?

I tried to notify this behaviour to google (at https://code.google.com/p/gmaps-api-issues/ ) but someone deleted my issue after just few minutes. No one told me WHY my issue had to be deleted.

Answer 1

Don't use HTMLLoader. It's convenient, but it is not full-featured. Instead, switch to StageWebView, which is the recommended way for displaying most web content in AIR. You will have to deal with it not being in the Display List, but I can confirm it works. I built a Google Maps Flex component using it just last week to allow for Google Maps on mobile.

HTMLLoader uses the built in AIR Webkit render engine, which isn't a very complete engine and has issues with many things. StageWebView, on the other hand, uses the system's browser (Safari on OS X and iOS, IE on Windows, Chrome/Browser on Android) to render the content, which is generally far more reliable.

I can confirm that both my component (which actually generates an HTML page incorporating the Maps v3 API on-the-fly) and the link you provided work using StageWebView on Android, OS X, and iOS. I don't have a Windows computer to test on, but it should work there as well.