Google Maps component for Flash

AFComponents UMAP

Google has APIs - Javascript - to put its maps in any web site . vied how to accomplish the same thing with Flash!

image We start from a free component, UMAP (Universal ActionScript 3.0 Mapping API - Integrated with Google Maps), developed by AFComponents , a vertically organized companies of components for Flash / Flex really interesting and affordable. On the site, where you need to register to take advantage of free downloads, there are also versions of UMAP for ActionScript 2.0: MAP G Ver.2.6.1 . In this case we will analyze the version 0.4 Beta UMAP for ActionScript 3.0 (inside the package there is also a Flex component). That we're going to see is - obviously - a beta version and lacks, therefore, some features in version for Actionscript 2.0 ( G Ver.2.6.1 MAP ). However, watchman at the future, it seems more interesting to focus attention on this release, I tried both and, despite the release of more complete for Actionscript 2.0, Actionscript 3.0 beta version is considerably more powerful.

Among its features are:

  • Support for custom map tiles and providers
  • Updated loading algorithms for faster tile loading
  • Flash / Flex versions
  • KML Support
  • Advanced content layering
  • FLA-Based Map Controls
  • Vector shape overlays
  • Extended Info Window styling

Components UMAP Once installed the component using Adobe Extension Manager UMAP will find four new components that are all part of UMAP. The controls used in Google Maps, such as zoom (zoom control), the choice of the type of map (Map Type Control) and the cursor moves to (Position Control), is realized here as components / elements. The main component is, of course, UMAP. To this can add all the other if we wish. To do so, however, write a few lines of code ...

Click here for documentation : Ensure that the documentation contains some mistakes and tutorials are missing!

We see a prime example. Open a new Flash movie and drag the component and the component UMAP Zoom Control. . Let's name these instances, respectively umap and zoom .

StagePlayer
Components on the Stage Test Movie

It is not necessary to place the component zoom control over the component UMAP. When you test the movie it will be positioned automatically zoom to the left of the main component. The Actionscript code to be used to "add" zoom component is as follows:

1
zoom ) ; UMAP. AddControl (zoom);

The same can be done if we are to complete the view as is normally shown on Google Maps.

StagePlayer
Components on the Stage Test Movie

Even in this case name the instances of the other two components and write the following code:

1
2
3
zoom ) ; UMAP. AddControl (zoom);
maptype ) ; UMAP. AddControl (maptype);
mapposition ) ; UMAP. AddControl (mapposition);

Who is not practical in Actionscript must be careful to some error of "beating" in the documentation - as I mentioned above. After a product is free in beta!

For aprere a window (Window) customized, for example, the correct code is:

imageCustom Window
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
afcomponents . umap . core . UMap ; with imports. afcomponents. UMAP. core. UMAP;
afcomponents . umap . styles ; with imports. afcomponents. UMAP. styles;
afcomponents . umap . styles . InfoWindowStyle ; with imports. afcomponents. UMAP. styles. InfoWindowStyle;
afcomponents . umap . types . Size ; with imports. afcomponents. UMAP. types. Size;
/ /
zoom ) ; UMAP. AddControl (zoom);
maptype ) ; UMAP. AddControl (maptype);
mapposition ) ; UMAP. AddControl (mapposition);
/ /
/ / Define the style of the Window
InfoWindowStyle = new InfoWindowStyle ( ) ; var style: InfoWindowStyle InfoWindowStyle = new ();
; style. strokeAlpha = 0.8;
= new Size ( 200 , 100 ) ; style. size = new Size (200, 100);
= InfoWindowStyle . AUTO_SIZE_NONE ; style. autoSize = InfoWindowStyle. AUTO_SIZE_NONE;
height = 30 ; style. tailSize. height = 30;
; style. tailOffset = 0.10;
html = true ; style. contentStyle. html = true;
styleSheet = new StyleSheet ( ) ; style. contentStyle. styleSheet = new StyleSheet ();
styleSheet . setStyle ( "html" , { fontFamily : "arial" , fontSize : 12 , color : "#555555" } ) ; style. contentStyle. styleSheet. setStyle ("html", {fontFamily: "Arial", fontSize: 12, color: "# 555555"});
/ / Parameter Window
Object = new Object ( ) ; var param: Object = new Object ();
; param. title = "Window Title";
= "Contenuto...<br />in stile<br /><b><u>HTML</u></b>!" ; param. content = "Content ... <br /> <br /> <u> style HTML </ u> </ b>";
/ / Open the Window
param , style ) ; UMAP. openInfoWindow (param, style);

Of course you can use the component UMAP, and others, directly from code, without that drag the window component on the Stage. It is also possible to add the marker (or Balloon) to indicate locations on the map.

imageMarker
1
2
3
4
5
6
7
8
9
10
11
afcomponents . umap . core . UMap ; with imports. afcomponents. UMAP. core. UMAP;
afcomponents . umap . styles . GeometryStyle ; with imports. afcomponents. UMAP. styles. GeometryStyle;
afcomponents . umap . overlays . Marker ; with imports. afcomponents. UMAP. overlays. Marker;
afcomponents . umap . types . LatLng ; with imports. afcomponents. UMAP. types. LatLng;
/ /
: UMap = new UMap ( ) ; var map: UMAP UMAP = new ();
setSize ( 300 , 300 ) ; map. setSize (300, 300);
addChild ( map ) ; this. addChild (map);
/ /
Marker = new Marker ( { name : "Titolo Marker" , position : new LatLng ( 10 , 10 ) , description : "Questo è il testo del corpo del Marker" } , { fill : GeometryStyle . RGB , fillRGB : 0xffcc00 } ) ; var m: Marker = new Marker ({name: "Heading Marker", position: new LatLng (10, 10), description: "This is the body text of the marker"}, {fill: GeometryStyle. RGB fillRGB: 0xFFCC00 });
addOverlay ( m ) ; map. addOverlay (m);

We'll come back soon to this component, also waiting for other releases - since it's a beta!

5 comments to "Google Maps component for Flash"

  1. February 10, 2009 Simo:

    Hello! I have a problem with the map ... if I put it in a swf is fine. But if I recall it from the index and load the map "crazy" and does not charge!
    I tried to insert a stop (); after the code, but nothing. I need to insert the map
    in "where we are."
    I have a file that invokes the index.swf homepage.swf menu.swf and then by loading the various chapters menu.swf including dovesiamo.swf map ... but so wrong! Can you help me?

  2. March 18, 2009 Daniel Torres

    Hola, I keep a problem with este component. Ya no me funcion y instal it, ¿Tengo algo más que hacer en el Escenario Apartamento De colocation?, Cuando Me Muestra the public with a cuadro parpadeante los Componentes adicionales but amontonados. A ayuda por favor.

  3. April 12, 2009 Juan Felipe :

    Listo, the averigué ya, the Solucion esta es, you alguien with hay otra Solucion tambien serious saberla bueno:

    1
    2
    3
    4
    ZoomControl = new ZoomControl ; //creamos el control de zoom var pc: = new ZoomControl ZoomControl / / el control de zoom creamos
    = new Align ( Align . RIGHT , Align . BOTTOM ) ; //lo ubicamos en la esquina inferior derecha pcs. align = new Align (Align. RIGHT Align. BOTTOM) / / the ubicamos en la Esquina inferior derecha
    Point ( 100 , 100 ) ; //le damos un padding para ubicarlo donde queremos pcs. padding = new Point (100, 100); / / the padding para Damos place it whence Queremos
    pc ) ; //Por ultimo lo agregamos al mapa mapa. AddControl (PC) / / Por at least the agregamos Map

    Exitos!. : P

  4. April 12, 2009 Juan Felipe :

    Hola, como Hago para los posicionar Controles the MAFF (zoom, type y mapa de Posicion) en otra area, por ejemplo en la Esquina inferior derecha??

Leave a comment

XHTML TAG PERMIT: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> INSERTION CODE:
 <pre></pre> // blocco generico <code></code> // blocco generico [cc_actionscript][/cc_actionscript] // Actionscript [cc_actionscript3][/cc_actionscript3] // Actionscript 3 [cc_css][/cc_css] // CSS Style Sheet [cc_html][/cc_html] // HTML [cc_js][/cc_js] // Javascript [cc_objc][/cc_objc] // Objective-C [cc_php][/cc_objc] // PHP [cc_sql][/cc_sql] // SQL 


Stop SOPA