Flex Mobile Development – Adding Maps with the MapQuest AS3/Flash API!

December 6, 2011By 15 Comments

A topic that has come up often in my conversations with developers lately is how to easily add mapping components to their their Flex and Flash mobile apps. Now I’m super excited to share this latest AS3/Flash API for mobile from MapQuest for everyone to check out! The new version contains touch-friendly maps and controls and was streamlined for performance on mobile.

To get started, first check out this sample application I’ve included the source and fxp for that was written by my friend Darin Weakley over at MapQuest. He’s done a great job of showcasing the fun cool features available in this app. I’ve included some screen shots below to give an idea of what it entails:


Map Component


Search Business


Search Results


Results on Map


Result Item Detail


Directions



Directions by Map

If you have an Android device, be sure to download the showcase application for free to your device!

To implement this in your own app you will need to create yourself an app key and join the developer program here before using the APIs. It’s fast and easy. Click ‘Join Now’. Also, don’t forget to include the latest MapQuest Flash API 7.07 mobile swc file in your project (see the sample for reference). This link also has documentation and other examples on the right side of the page to check out for more info!


MapQuest Flash Maps API Quick Links

Mobile Flash Maps API
Web/Desktop Flash Maps API
OpenStreetMap Mobile Flash Maps API – more information about OpenStreetMap (OSM)
OpenStreetMap Web/Desktop Flash Maps API

Filed in: Adobe AIRAdobe FlexFlash Builder 4.6Flex 4.5Flex 4.5/MobileFlex 4.6Flex MobileMobile Development Tags:

About the Author ()

Comments (15)

Trackback URL | Comments RSS Feed

  1. 420 Colorado says:

    Nice! I love the MapQuest Api 7.0.6, a sure sign that Flash is alive and well when there’s awesome 3rd party API’s being developed. The sample app is a bit complicated for beginners to get started with learning the API, but it’s an awesome app to load up and use on your devise!

  2. Lionel says:

    Oh yeah! Thanks Holly. Keep those articles coming.

  3. JCLang says:

    Hello Holly,
    thanks for your posts about Flex! That’s what we ask for!

  4. Matt Sheehan says:

    Holly,

    Great article. We’ve been working with the MapQuest AS3/Flash API for a while. Darin and the folks at MapQuest have done a great job. The link below shows a demo video of a check-in/data collection app, running in an Android smartphone, using the MapQuest api

    http://www.webmapsolutions.com/checkin-data-collection

    –Matt

  5. Michael says:

    MapQuest is a really well documented library. One thing that put me off though is that the directions are not supporting smaller countries. Only perhaps through the open source commits but it should be in the main version as well, globalization is important.

    Other than that their maps render smoothly on older 2.2 android devices too.

  6. Jasen says:

    I’m receiving an error message with I switch to Design Mode with the new Flex 4.6 SDK. This is the error message: “design mode not supported – incompatible SDK version” . Any suggestions Holly?

  7. She says:

    is there any tutorial on how to use this for beginners?

  8. Saif says:

    How to search Latlng Collection?

  9. Johan says:

    oh my!! this is awesome !! I was worried since Google Earth API supports Flash no more..thank you for this blog too!

  10. That is great work, keep it coming. :)

  11. Norman says:

    Hi Holly,

    I got a new Samsung galaxy Tab 7.7 coz I wanted to test a map-based video application in a faster 1.4 Ghz device to guarantee video performance. However, I am having a problem connecting the device through the FB 4.6 emulator. I tried the online tutorial but to no avail. I think a guy entered a query in the Adobe Forums since Mar 1 but no answer. Any ideas how I may resolve this issue? I hate to take the Tab back and buy an older model so that FB can support it. Seems absolutely silly to develop using AIR if future phones/tabs can’t be supported.

  12. Bob Cudmore says:

    Directions and Traffic only seem to work in the USA. UK/EU Zip/Post Codes do not seem to be recognised. I have contacted MQ about traffic in the EU and they state that there are no plans to include this feature in the near future!

  13. Andy says:

    Hey Holly,
    Im using MapQuest in my Flex Mobile App after reading this article. All working really well, except for one problem that I hope you can advise on…

    How would I stop the viewport being scrolled, when the user interacts with the map? Seems like it should be easy, so Im sure Im missing something really obvious!

    Im integrating a map within a viewport with other omponents (Labels, Buttons) They are all within a VGroup which is within a Scroller. Problem is, when you pan on the map up or down it also pans the whole viewport up or down. I tried disabling the Scroller on TouchStart etc, but that didnt seem to have any effect. Basically, on touch start I just want the View to scroll as normal, UNLESS the user is touching the map, in which case, dont scroll the View.

    The more I think about it, it seems an obvious thing to try and achieve so I must be missing something dumb here!

    Any advice please, up against a deadline…

    Thanks!

    • Andy says:

      Sorted!

      Here was my fix, in case it helps someone else…

      Added an eventlistener
      this.myMap.addEventListener(MouseEvent.MOUSE_DOWN, myMap_mouseDownHandler );

      and then in the myMap_mousedownHandler I set:
      event.stopPropagation();

      which stops the mouseclick bubbling up to the parent Scroller.

      Simple and seems to work okay.

  14. news says:

    Had some questions that were answer on MapQuest by reading here. Thank you

Leave a Reply