flexlib :: library Documentation | All Packages | All Classes | Index | Frames No Frames |
ImageMap

Package | flexlib.controls
Class | public class ImageMap
Inheritance | ImageMap mx.controls.Image

The `ImageMap` control is an implementation of a client-side image map component, like it is supported in HTML.

`ImageMap` is an extension of the Image class, so you can specify the `source` attribute just like you would for a standard `Image` component. The `map` property is used to define the actual image map and all the `area` items that make up the map. The `map` property can be defined either in MXML or by setting it with Actionscript.

The intent is for you to be able to generate your image map in whatever program you use to create image maps, and be able to cut and paste it into your MXML component with minimal changes.

Example MXML usage:

       <ImageMap xmlns="flexlib.controls.
       		source="usa.jpg"
       		showToolTips="true"
       		shapeClick="navigateToURL(new URLRequest(event.href), event.linkTarget)"
       		>
          		<map>
       			<area alt="WA" shape="POLY" coords="85,11,133,11,134,42,114,42,100,47,96,45,91,48,83,40,76,40,75,29,70,23,71,18,82,20,87,18" href="http://en.wikipedia.org/wiki/Washington" target="_blank"/>
       			<area alt="OR" shape="POLY" coords="76,40,83,40,90,48,96,45,101,47,115,43,134,43,138,46,133,57,134,84,72,84,71,71,76,56" href="http://en.wikipedia.org/wiki/Oregon" target="_blank"/>
       		</map>
          </ImageMap>

See also

http://www.w3.org/TR/html4/struct/objects.html#client-side-maps

Public Properties

| Property | Defined By
--- | --- | ---
|  | map : Array The <map /> HTML block that is normally used for the image map in an HTML file. | ImageMap
|  | showToolTips : Boolean = false Indicates whether tool tips should be shown for each area. | ImageMap
|  | toolTipField : String = alt Field of the <area /> item that will be used for the tooltip. | ImageMap

Public Methods

| Method | Defined By
--- | --- | ---
|  | ImageMap() | ImageMap

Protected Methods

| Method | Defined By
--- | --- | ---
|  | createChildren():void [override] | ImageMap
|  | updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void [override] | ImageMap

Events

| Event | Summary | Defined By
--- | --- | --- | ---
|  | shapeClick | Fired when an area is clicked. | ImageMap
|  | shapeDoubleClick | Fired when an area is double clicked. | ImageMap
|  | shapeDown | Fired when the mouse is pressed down on an area. | ImageMap
|  | shapeOut | Fired when the mouse moves out of an area. | ImageMap
|  | shapeOver | Fired when the mouse moves over an area. | ImageMap
|  | shapeUp | Fired when the mouse is released on an area. | ImageMap

Styles

| Style | Description | Defined By
--- | --- | --- | ---
|  | fillAlpha | Type: Number Format: Length CSS Inheritance: no Alpha transparency of the fill of each area. Default is 0 so the areas are invisible. The default value is`0`. | ImageMap
|  | fillColor | Type: uint Format: Color CSS Inheritance: no Fill color of each area. The default value is`0xff0000`. | ImageMap
|  | outlineAlpha | Type: Number Format: Length CSS Inheritance: no Alpha transparency of the outline of each area. Default is 0 so the outlines are invisible. The default value is`0`. | ImageMap
|  | outlineColor | Type: uint Format: Color CSS Inheritance: no Color of the outline of each area. The default value is`0xff0000`. | ImageMap
|  | outlineThickness | Type: Number Format: Length CSS Inheritance: no Thickness of the outline of each area. The default value is`1`. | ImageMap

Property Detail

map | property

`map:Array`

The `<map />` HTML block that is normally used for the image map in an HTML file. This should be wrapped as an XMLList and can either be cuopy/pasted straight into the MXML file, or set via Actionscript.

Implementation
`public function get map():Array`
`public function set map(value:Array):void`

showToolTips | property |

`public var showToolTips:Boolean = false`

Indicates whether tool tips should be shown for each area.

The default value is `false`.

toolTipField | property |

`public var toolTipField:String = alt`

Field of the `<area />` item that will be used for the tooltip.

The default value is `"alt"`.

Constructor Detail

ImageMap | () | Constructor

`public function ImageMap()`

Method Detail

createChildren | () | method

`override protected function createChildren():void`

updateDisplayList | () | method |

`override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void`

Parameters

| `unscaledWidth:Number`
| `unscaledHeight:Number`

Event Detail

shapeClick | Event

Event Object Type: `flexlib.events.ImageMapEvent`
ImageMapEvent.type property = `flexlib.events.ImageMapEvent.SHAPE_CLICK`

Fired when an area is clicked.

shapeDoubleClick | Event |

Event Object Type: `flexlib.events.ImageMapEvent`
ImageMapEvent.type property = `flexlib.events.ImageMapEvent.SHAPE_DOUBLECLICK`

Fired when an area is double clicked.

shapeDown | Event |

Event Object Type: `flexlib.events.ImageMapEvent`
ImageMapEvent.type property = `flexlib.events.ImageMapEvent.SHAPE_DOWN`

Fired when the mouse is pressed down on an area.

shapeOut | Event |

Event Object Type: `flexlib.events.ImageMapEvent`
ImageMapEvent.type property = `flexlib.events.ImageMapEvent.SHAPE_OUT`

Fired when the mouse moves out of an area.

shapeOver | Event |

Event Object Type: `flexlib.events.ImageMapEvent`
ImageMapEvent.type property = `flexlib.events.ImageMapEvent.SHAPE_OVER`

Fired when the mouse moves over an area.

shapeUp | Event |

Event Object Type: `flexlib.events.ImageMapEvent`
ImageMapEvent.type property = `flexlib.events.ImageMapEvent.SHAPE_UP`

Fired when the mouse is released on an area.

Mercredi Juillet 4 2012, 09:36 PM +02:00