Information on this website refers to a deprecated product, and is provided only for historical reference. Please use the Version Switcher above to select an appropriate documentation website for the product you are using.

MapImage

Type class

MapImage is a class where properties of images are defined. MapImage can display external svg, png, jpg or gif files. There are 3 predefined images: circle, rectangle and bubble.

You can also pass an svg path (this is the most flexible way to have images). MapImage can also display labels. In case some property is not defined in this class, MapMovie will use MoviesSettings class property with the same name.

Inheritance

MapImage extends MapObject.

MapImage is not extended by any other symbol.

Properties

bottom
#

Type number

Distance from bottom of a map container to the image. If centered property is false, then the distance is measured to the bottom of the image, otherwise - to the center. If you set this property, value of top property is ignored. This property can be set as a number (of pixels) or as a percent value, like: image.bottom = "10%";. The image will not be bounded to the map if this property is set. Use latitude and longitude properties if you want the image to move with the map.

centered
#

Type boolean

Specifies if the image's center should be placed in the provided coordinates. If false, top-left corner will be at provided coordinates. This property doesn't work with images set as svgPath.

height
#

Type number

Height of an image. Works with predefined images (if type is set) and loaded images (imageURL is set). If svgPath is set, use scale property to change it's size.

imageURL
#

Type string

Url of an image. Images can be svg, jpg, png or gif files. Note, you can't control color, outlineColor, outlineAlpha and outlineThickness of loaded images. Use svgPath property if you need to change these properties.

labelBackgroundAlpha
#

Type number

Opacity of label background alpha.

labelBackgroundColor
#

Type Hex string

Color of label background.

labelColor
#

Type string

Label color.

labelFontSize
#

Type number

Font size of a label.

labelPosition
#

Type string

Position of the label. Allowed values are: left, right, top, bottom and middle.

labelRollOverColor
#

Type string

Label roll-over color.

labelShiftX
#

Type number

Default 0

In some cases you might want to adjust label position a bit. Use this property to shift label horizontally.

labelShiftY
#

Type number

Default 0

In some cases you might want to adjust label position a bit. Use this property to shift label vertically.

latitude
#

Type number

Latitude of the image. of the image. Set this property if you want the image to be bounded to the map. Otherwise use left/right/top/bottom properties.

left
#

Type Number/String

Distance from left of a map container to the image. If centered property is false, then the distance is measured to the left of the image, otherwise - to the center. The image will not be bounded to the map if this property is set. Use latitude and longitude properties if you want the image to move with the map. This property can be set as a number (of pixels) or as a percent value, like: image.left = "10%";

longitude
#

Type number

Longitude of the image. Set this property if you want the image to be bounded to the map. Otherwise use left/right/top/bottom properties.

outlineAlpha
#

Type number

Opacity of image outline. This will affect only predefined images (with "type" property set) and images with svgPath set. This property won't affect bitmap images and loaded SVG images.

outlineColor
#

Type string

Color of image outline. This will affect only predefined images (with "type" property set) and images with svgPath set. This property won't affect bitmap images and loaded SVG images.

outlineThickness
#

Type number

Thickness of image outline. This will affect only predefined images (with "type" property set) and images with svgPath set. This property won't affect bitmap images and loaded SVG images.

percentHeight
#

Type number

Height of an image, in percents of map container. Works with predefined images (if type is set) and loaded images (imageURL is set). If svgPath is set, use scale property to change it's size.

percentWidth
#

Type number

Width of an image, in percents of map container. Works with predefined images (if type is set) and loaded images (imageURL is set). If svgPath is set, use scale property to change it's size.

right
#

Type number

Distance from right of a map container to the image. If centered property is false, then the distance is measured to the right of the image, otherwise - to the center. If you set this property, value of left property is ignored. The image will not be bounded to the map if this property is set. This property can be set as a number (of pixels) or as a percent value, like: image.right= "10%"; Use latitude and longitude properties if you want the image to move with the map.

rollOverScale
#

Type number

Scale of the image when hovered. Use value like 1.5 - 2 to enlarge image when user rolls-over it.

scale
#

Type number

Default 1

Scale of the image. Works only with images created using svgPath. Use width/height properties for all other images.

selectedLabelColor
#

Type string

Color of a label when image is selected.

selectedScale
#

Type number

Scale of the image if it is selected. Use value like 1.5 - 2 to enlarge selected image.

svgPath
#

Type string

SVG path, for example: M9,0C4.029,0,0,4.029,0,9s4.029,9,9,9s9-4.029,9-9S13.971,0,9,0z M9,15.93 c-3.83,0-6.93-3.1-6.93-6.93S5.17,2.07,9,2.07s6.93,3.1,6.93,6.93S12.83,15.93,9,15.93 M12.5,9c0,1.933-1.567,3.5-3.5,3.5S5.5,10.933,5.5,9S7.067,5.5,9,5.5 S12.5,7.067,12.5,9z The line above will create a target icon. For more icons we recommend visiting this page: http://raphaeljs.com/icons/ Simply click on an icon you like and you will get SVG path in the bottom. This is the recommended way to create icons/images in AmMap.

top
#

Type number

Distance from top of a map container to the image. If centered property is false, then the distance is measured to the top bound of the image, otherwise - to the center. The image will not be bounded to the map if this property is set. This property can be set as a number (of pixels) or as a percent value, like: image.top = "10%"; Use latitude and longitude properties if you want the image to move with the map.

type
#

Type string

Type of a predefined image. Allowed values are: circle, rectangle and bubble.

width
#

Type number

Width of an image. Works with predefined images (if type is set) and loaded images (imageURL is set). If svgPath is set, use scale property to change it's size.

widthAndHeightUnits
#

Type string

Default pixels

You can set miles or kilometers as a unit of width/height of an image. This works only with predefined movies (type is set).

alpha
#

Type number

Inherited from MapObject

Opacity of map object.

balloonText
#

Type string

Inherited from MapObject

Text which is displayed in a roll-over balloon. You can use the following tags: [[title]], [[description]], [[value]] and [[percent]].

color
#

Type string

Inherited from MapObject

Color of MapObject

customData
#

Type object

Inherited from MapObject

A custom data holder.

description
#

Type string

Inherited from MapObject

Description of MapObject. Description is displayed in DescriptionWindow (when user clicks on an object). It can also be displayed in a roll-over balloon. DescriptionWindow can display HTML formatted code.

descriptionWindowHeight
#

Type number

Inherited from MapObject

Height of description window.

descriptionWindowWidth
#

Type number

Inherited from MapObject

Width of description window.

descriptionWindowX
#

Type number

Inherited from MapObject

X position of description window. In case it is not set, window will be placed near the mouse pointer.

descriptionWindowY
#

Type number

Inherited from MapObject

X position of description window. In case it is not set, window will be placed near the mouse pointer.

fixedSize
#

Type boolean

Default true

Inherited from MapObject

Specifies if the object should change the size together with the map or keep fixed size. This applies for objects with lat and long properties set, as they move together with the map.

groupId
#

Type string

Inherited from MapObject

Id of a group. You can group MapObjects to groups. Grouped objects will change color together with this object when you roll-over it or click it. You can show/hide them using showGroup(groupId) and hideGroup(groupId) methods of AmMap class. You can also use map.zoomToGroup(groupId) methot to zoom-in the map so that all grouped objects are visible.

id
#

Type string

Inherited from MapObject

Unique id of the object. In case it's area, id should match svg path id from SVG file. Id can be used with linkToObject property of MapObject - you can link one object to another using it.

images
#

Type array

Inherited from MapObject

Array of MapImage objects.

lines
#

Type array

Inherited from MapObject

Array of MapLine objects.

linkToObject
#

Type MapObject

Inherited from MapObject

linkToObject can be a reference or id of some other MapObject - MapArea, MapImage or MapLine. It can also be a reference to another DataSet (but not an id). Then user clicks on this object the application would zoom-in to this objects' zoom position (if it is set) and then act as if the linkToObject was clicked. This can also be used for selecting the object you want to be selected right after the map is initialized, as DataSet extends MapObject class, you can specify linkToObject for your DataSet. When you link to another DataSet, you can build drill-down maps.

mouseEnabled
#

Type boolean

Default true

Inherited from MapObject

Set this to false to make the object be irresponsive to any interactions like hover or click events.

objectType
#

Type string

Inherited from MapObject

Read-only, type of the Object. Possible values are: "DataSet", "MapImage", "MapLine" and "MapArea".

passZoomValuesToTarget
#

Type boolean

Default false

Inherited from MapObject

Specifies if current zoom values should be passed to target MapObject. Useful when building drill down maps.

remainVisible
#

Type boolean

Default true

Inherited from MapObject

Specifies if the MapObject and other objects of the same level should remain visible if it was clicked and it has children MapObjects.

rollOverColor
#

Type string

Inherited from MapObject

Roll over color of of the object.

selectable
#

Type boolean

Default false

Inherited from MapObject

Specifies if the object can be selected even if it is not clickable. Map object is clickable if zoom properties are set or it has description or has children objects. Sometimes even non of the listed conditions is met you might need it to be clickable. You should set this property to true in this case.

selectedColor
#

Type string

Inherited from MapObject

Color of an object when it is selected (somebody clicked on it).

showAsSelected
#

Type boolean

Default false

Inherited from MapObject

Specifies if selectedColor should be applied to the object. AmMap can have only one selected item at a time, however there might be situations when multiple objects (areas, movies, lines) have to look like they are selected. By setting this property to true, you will be able to produce this result.

showInList
#

Type boolean

Inherited from MapObject

Specifies if this object must be displayed in ObjectsList Title should be defined in order the object to appear there.

title
#

Type string

Inherited from MapObject

Title of a MapObject. It can be displayed in the roll-over balloon and in the header of description window. All areas in SVG maps distributed with amMap has country names (titles) hard coded in the SVG file.

url
#

Type string

Inherited from MapObject

Url of an object. The application will go to this url when you click on the object.

urlTarget
#

Type string

Default _self

Inherited from MapObject

Target of an URL, if URL is a string, for example: "_blank", "_top".

useTargetsZoomValues
#

Type boolean

Default false

Inherited from MapObject

Specifies if MapObject's, specified in the url zoom values should be used. Useful when building drill down maps.

zoomLatitude
#

Type number

Inherited from MapObject

Specifies latitude to which map should be moved when this object is clicked

zoomLevel
#

Type number

Inherited from MapObject

Specifies map scale to which map should be rescaled when this object is clicked.

zoomLongitude
#

Type number

Inherited from MapObject

Specifies longitude to which map should be moved when this object is clicked.

zoomX
#

Type number

Inherited from MapObject

Specifies x position (in percents of stage width) to which map should be moved when this object is clicked. You can also use zoomLat and zoomLong instead of zoomY and zoomY.

zoomY
#

Type number

Inherited from MapObject

Specifies y position (in percents of stage height) to which map should be moved when this object is clicked. You can also use zoomLat and zoomLong instead of zoomY and zoomY.

There are 33 inherited items currently hidden from this list.

Methods

MapImage does not have any methods.

Events

MapImage does not have any events.

Adapters

MapImage does not have any adapters.