Points (POIs) and InfoWindows
Points of Interest, commonly referred to as POIs, are specific locations that someone may find useful or interesting. In mapping applications, POIs and InfoWindows are usually paired to visually show locations and location detail.
This page covers the creation and stylization of the POI objects and InfoWindows. If you're interested in adding a group of POIs, GeoRSS or KML files to a map, see the Collections and KML and GeoRSS pages. Similarly, if you're interested in searching for POIs from MapQuest's hosted data or your own custom data tables and adding them to the map, see the Search page.
- Basic POI
- Custom POI
- POI Alternate States
- POI Decluttering
- InfoWindow Configuration Options
- Manual InfoWindow Toggling
- HTML POI
POI support is built into the basic API download. To place a POI on a map, use the following code where map is a reference to
In addition to the provided POI icon, it is possible to use custom images instead.
POI Alternate States
You can set an alternate state for a POI under certain conditions. The following example alternates the POI based on the
mouseout events by changing the icon used. All of the customizable attributes of a POI can have an alt state set by using the
setAltPropertyName convention (e.g.
setAltIcon is the alternate for
MQA.Poi.setAltState(true||false) can be called directly -- no event is needed to use this functionality.
You can automate the decluttering of POIs when multiple locations are plotted in the same spot or close to one another.
InfoWindows are the tooltips that pop up when the POI receives a
mouseover event (default). Notice the difference between the
mouseover and click actions on this POI as opposed to the example above.
Support of InfoWindows are included in the basic API download.
InfoWindow Configuration Options
You can configure InfoWindows in several ways and the below sample will give you an idea of its capabilities. To learn more about customizing the look and feel of your mapping application, visit the Customizing the User Interface page.
Manual InfoWindow Toggling
You can toggle an InfoWindow using the
HTML POIs are essentially regular POIs except there are no icons and you are required to provide the HTML for the content. These are ideal for labeling and when simply changing the icon is not sufficient for your needs.
As seen in the samples above, the
addListener() event handler is used to listen for an event on the source object and call a custom function when the specified event occurs. Visit the Events page for a complete list of available Event Listeners.