Dev: SM: Overlaying Points
Now that you have a myMap object, you can interact with it. (see Basic Map page) The basic map object looks and behaves a lot like the map you interact with on the StreetMaps website and comes with a lot of built-in Events.
Adding a point
Adding a point to the map is very Simple:
var newPoint = myMap.AddPoint(31.039006,-29.855916,'Caption!','id'); myMap.Update();
Creating a POI (Point of interest)
This Adds a point to the default POI layer. Default values are used for all the customizable attributes. You can add many points to a single points layer. You can set different methods for this point to further enrich the look and functionality.
var newPoint = myMap.AddPoint(x,y,'caption','id');
|X||(float)||X Coordinate of the new point|
|Y||(float)||Y Coordinate of the new point|
|Caption||(string)||Default caption for this new point|
Optional: Unique identifier for the point, only needed should you plan on accessing the point using it later
The default properties of the point are
- Large speech bubble for the caption
- Small black dot for the icon
- Clicking on the close button of the speech bubble will go to the icon, and vice versa.
Once the point has been added to the map, there are a number of operations you can perform on it to change the look and behaviour of it.
These examples show how to manipulate points on the default POI layer of the map. It is possible to create one or more POI layers and operate on POIs within those layers; the full API reference should be referred to for this.
Setting the Icon
|Parameter||(string)||The URL of the icon which will represent this point. It is suggested that a png or gif file is used, as the API will honour transparent backgrounds and attempt to make the PNG files work in IE6, where there are issues with PNG files and transparent images|
|Parameter||(string)||The string which will be displayed in a standard tooltip when then cursor hovers over the icon of the point|
Icon / Label Anchor
Both functions do the same thing, one controls the icon and the other the lable. Two arguments are passed to these functions
|anchorx||(string)||How the icon image will be aligned to the coordinates specified for this point
|anchory||(string)||How the icon image will be aligned to the coordinates specified for this point
|Parameter||(string)||New behaviour of this point
|Parameter||(string)||Sets the display style of this point
Set icon size
:“label”: The label an corresponding icon will both be shown .SetIconSize(newx,newy);
|newx||(integer)||Size, in pixels, of the width of the icon to be used for this point|
|newy||(integer)||Size, in pixels, of the height of the icon to be used for this point|
The map will not be updated until the Init() function is called.
To delete a point to need to call the point layer with the delete function as above and after the delete function is called you will need to call the Initialize fynction, myMap.Init().
|id||(string)||The unique identifier of the point to delete, as specified in AddPoint.|
Removing all Points
This will delete all point in that layer and again the myMap.Init() must be called after the RemoveAllPoints function.