Pushpin API Documentation

Pushpin API Documentation (Version 1.3)

Getting a Map
Adding a Pin to the Map
Adding Controls
Opening an Info Window
Adding Overlays
Handling Clicks
Attaching Events
Opening an Info Window above a Marker
Tabbed Info Windows
Creating Custom Icons
Getting Multiple Maps on One Page
Geocoding
Finding a Place *NEW
Geographic Breadcrumbs *NEW
Using XML
Managing Markers
Printing Map Images *NEW
Using a Different API Version

Dynamic Layers API Examples

Toggling Map Layers Off
Creating a Custom Map Type
Adding Thematic Variables
Changing Thematic Colors on the Map
Changing the Number of Thematic Breaks
Setting Custom Thematic Breaks *NEW
Merging Map Layers on the Client Side

Widgets

Adding a Widget
Adding Predefined Widgets
Customizing Widget Styles

Overlay Sets and Filtering *NEW

Adding Overlay Sets
Adding Attributes and Filters
Displaying Filters
Adding Predefined Marker Sets *NEW
Filtering Marker Sets by Icons *NEW

Class Reference

PMap
PInfoWindow
PInfoWindowTab
PMarker
PPolyline
PPolygon
POverlaySet *NEW
PIcon
PEvent
PEventListener
PClientGeocoder
PPlaceLoader *NEW
PPlace *NEW
PPlaceType *NEW
PPlaceTypeConfig *NEW
PAddress
PMarkerManager
PPoint
PSize
PBounds
PLatLng
PLatLngBounds
PAttribute
PAttributeFilter
PXmlHttp
PXml
PXslt
PLargeMapControl
PSmallMapControl
PMapTypeControl
PUnload
PDownloadUrl
PGetVersion

Extended Class Reference

PMapType
PMapLayer
PIndicatorLoader
PIndicator
PLegend
PColor
PColorRamp
PWidget
PPlaceContainmentWidget *NEW

Legal Notices

Browse Pushpin Collections for data from ESRI, Claritas, NAVTEQ and more!

View Documentation for Version 1.2 Version 1.1 Version 1.0 Version 0.9 Version 0.8
If you're unsure which version of the API you're using, use the global function PGetVersion().

Getting Started

Placebase's Pushpin provides an easy to use JavaScript Application Programming Interface (API) for embedding scrollable maps into your website. The following code example shows how to create a 500x300 pixel scrollable map centered on Los Angeles:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"  xmlns:v="urn:schemas-microsoft-com:vml" >
  <head>
	<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>

	<title>Pushpin JavaScript API Example: Getting Started</title>
	<script src="http://api.pushpin.com/js?key=A8C2B4DB310FF6A1987E1C06FCE83516"
			type="text/javascript">
	</script>

	<script type="text/javascript">
	//<![CDATA[

	function onLoad() {
		// Creates a map and centers it on Los Angeles.
		var map = new PMap(document.getElementById("map"));
		map.setCenter(new PLatLng(34.045, -118.235), 13);
	}

	//]]>
	</script>
  </head>

  <body onload="onLoad()" onunload="PUnload()">
	<div id="map" style="position: relative;
		width: 500px; height: 300px; border: 1px solid #979797"></div>
  </body>
</html>

Here is a link to a page where you can view this example in action (start.html).

The URL in the example above, http://api.pushpin.com/js?key=A8C2B4DB310FF6A1987E1C06FCE83516, is the location of the pushpin code. In order for that URL to work, you will need a valid key value. Upon subscribing to Pushpin you will receive a key. This key will only work for web pages served from your site.

More Examples

Getting a Map

As shown in the Getting Started example above, getting a map consists primarily of two lines of JavaScript code, one to construct the PMap object, and another to center and zoom the map at a particular geographic coordinate (34.045, -118.235) at zoom level 13:

var map = new PMap(document.getElementById("map"));
map.setCenter(new PLatLng(34.045, -118.235), 13);

View example (start.html)

Adding a Pin to the Map

The PMarker object is used to add a Pushpin to a point on the map.

View example (addpin.html).

The example above uses the same method as the Getting A Map example to center and zoom the map to a geographic coordinate (34.045, -118.235), but also adds a point to the map. The PMarker constructor takes a PLatLng object. Once created, the marker is added to the map using the map.addOverlay() method. The following two lines of code from this example creates a marker at a given point, and overlays that marker on the map:

var marker1 = new PMarker(point1);
map.addOverlay(marker1);

Adding Controls to the Map

The map object offers methods that overlay a variety of controls on the map. The following example shows how to add simple zoom in / zoom out and pan controls to the map.

View example (smallmapcontrol.html).

The example above shows how to add a small map control (PSmallMapControl) to the map. The control allows users to zoom and pan. The following line of code adds the control to the map:

map.addControl(new PSmallMapControl());

Other types of controls can also be added to the map, such as PLargeMapControl and PSmallMapControl. Click here for all controls supported by the API.

Opening an Info Window

Information windows that appear as cartoon-like bubbles can be displayed on the map. In their simplest version, these windows contain text.

View example (infowindow.html).

The above example shows how to add a simple info window to the map. The following line opens the window.

map.openInfoWindow(map.getCenter(),
		   document.createTextNode("Hello, world!"));

Adding Overlays to the Map

Many overlays can be added to the same map. The following example loops through and adds 10 random pins, 4 lines and a triangle to the map .

View example (overlay.html).

Handling Clicks

Points can be added to the map via clicks using event listening. The following example shows how to support adding markers to the map at whatever point a user clicks.

View example (click.html).

The addListener function waits for a user click, at which point a new PMarker is added to the map.

PEvent.addListener(map, 'click', function(overlay, point) {
    if (overlay) {
        map.removeOverlay(overlay);
    } else if (point) {
        map.addOverlay(new PMarker(point));
    }
});

Attaching Events

In addition to clicks, other events can also be attached and handled with the event listener. The following example prints out several events as they occur. Click here for a list events that can be attached to PMap.

View example (events.html).

Opening an Info Window above a Marker

Info windows can be added to markers themselves in order to annotate the pins.

View example (infowinmarkup.html).

The addListener function is used to add a listener to a specific PMarker object called marker.

PEvent.addListener(marker, 'click', function() {
	marker.openInfoWindowHtml(html);
});

The following example adds info windows above multiple markers.

View example (infowinmarkers.html).

Tabbed Info Windows

Multiple tabs can be created for info windows. The following example shows how to open an info window with 2 tabs above a marker.

View example (tabs.html).

// Create tabs
var infoTabs = [
  new PInfoWindowTab("Tab 1", "This is content for Tab 1"),
  new PInfoWindowTab("Tab 2", "This is content for Tab 2")
];

// Add marker and open info window
var marker = new PMarker(map.getCenter());
PEvent.addListener(marker, "click", function() {
  marker.openInfoWindowTabsHtml(infoTabs);
});
map.addOverlay(marker);
marker.openInfoWindowTabsHtml(infoTabs);

Creating Custom Icons

You can use your own custom icons on the maps using Pushpin. Setting the PIcon properties like image and (optionally) shadow to a URL pointing to the image to use will enable overlay of custom images on the map. Click here for a list of predefined icons from Pushpin.

View example (icon.html).

Getting Multiple Maps on One Page

Multiple maps can be configured to appear on the same page as in the following example:

View example (multimap.html).

Each map is declared as a separate variable (in this case map and map2), and each can be controlled distinctly by its handle.

var map2 = new PMap(document.getElementById("map2"));
map2.setCenter(new PLatLng(33.952, -118.155), 6);

Geocoding (Converting an Address to a Point)

The process of taking an address and converting it to a geographical point is called Geocoding. As shown in the example below, the showAddress function takes an address and adds a marker to that point. Geocoding is an inherently messy process and often addresses will not resolve to specific coordinates. Therefore showAddress checks to see if the point returned is valid. The getLatLng function needs to be passed a callback function to be called after the response comes back.

View example (geocode.html).

Finding a Place (Geographic Boundary)

The Pushpin API contains different types of places (PPlaceType), which are geographic boundaries like state, county or zip codes. Click here for a list of the current place types supported. These are primarily used with thematic data to determine the appropriate type to use per zoomlevel. The specific place (PPlace), e.g. Los Angeles County or 90013, contains information like the name, type, bounding box, centroid and area, and can also be used to find the value of an indicator for the place. The following example shows how to search for a place using PClientGeocoder.getPlace(). It uses the vertices returned to highlight the matching place.

View example (findplace.html).

Geographic Breadcrumbs

In the same way that "breadcrumb" trails are used for keeping track of your location or path within programs or documents, Pushpin offers something similar for geographic locations. A useful way to do this is by showing clickable geographies that contain the current map that you are viewing, e.g. California > Los Angeles > 90013, and to update the map as you drag, pan or zoom. PClientGeocoder.getPlaceContainment() lets you specify a PLatLng and a PPlaceType and returns an array with the closest PPlace along with all places that contain it (in order, largest first). You can then use this array to build your breadcrumbs, pulling out only the place types that you desire.

View example (breadcrumbs.html).

The API provides a quick way to put all this together. First, there is PPlaceContainmentWidget that lets you conveniently build standard looking breadcrumbs, with a few customizable options.

// Create the place containment (breadcrumbs) widget
var breadcrumbs = new PPlaceContainmentWidget(
	map,
	document.getElementById("breadcrumbs"),
	[PPlaceType.STATE, PPlaceType.COUNTY, PPlaceType.CITY, PPlaceType.ZIP]
);

There is also PPlaceTypeConfig.PPLACECONTAINMENT that breaks down what place type to look for at different zoomlevels.

PEvent.addListener(map, 'moveend', function() {
	geocoder.getPlaceContainment(
		map.getCenter(),
		PPlaceTypeConfig.PPLACECONTAINMENT.getTypeByAbsoluteZoom(map.getAbsoluteZoom()),
		function(places) {
			breadcrumbs.refresh(places);
		}
	);
});

Using XML

The Pushpin API contains classes and methods that load and parse XML files in the latest browsers. For example, PXmlHttp.create() creates a new instance of a browser independent XmlHttpRequest. The following example shows how to download a static XML file (data.xml), parse it and create markers and info windows with the information.

View example (xml.html).

The function PDownloadUrl is used to download the data asynchronously and PXml is used to parse the XML.


// Download the data in data.xml and load it on the map.
PDownloadUrl("data.xml", function(data, responseCode) {
	var xml = PXml.parse(data);
	var markers = xml.documentElement.getElementsByTagName("marker");
	for (var i = 0; i < markers.length; i++) {
		var point = new PLatLng(parseFloat(markers[i].getAttribute("lat")),
								parseFloat(markers[i].getAttribute("lng")));
		var html = PXml.value(markers[i].getElementsByTagName("label")[0]);
		html += "<br>" + PXml.value(markers[i].getElementsByTagName("description")[0]);
		map.addOverlay(createMarker(point, html));
	}
});

Managing Markers

Displaying hundreds of markers on a map can cause slow downs. To make these maps more efficient, use PMarkerManager to manage markers on a map. PMarkerManager automatically groups markers into clusters depending on the number of markers currently in the map view and only draws markers that are located within the map view. The following example demonstrates this. You will see that some of the markers are clustered. Clicking on the clustered markers will display an info window stating how many markers it represents. Zoom in to see the individual markers. You can also zoom out until all markers are represented by one cluster marker.

View example (markermanager.html).

Create a new PMarkerManager.

var markerManager = new PMarkerManager(map);

Add markers to the map using the addMarker() function.

markerManager.addMarker(createMarker(point, i + 1));

Printing Map Images

The Pushpin API allows you to save a map as one image for printing purposes. The following example provides a link that opens an image of the current map in a new window, with the specified size of 500x500 pixels. If the size is not specified, the current map view size will be used. Optional center and / or zoom level parameters can be added too, otherwise the current zoom level and center of the map will be used. As well, a marker can be specified, otherwise, if a marker already exists on the map, that will automatically be included in the image (as shown in this example). Note that if more than one marker were added, only the first one will be used.

View example (printmap.html).

The following code returns the URL of the image.

map.printImage(new PSize(500,500));

The window.open function opens this URL in a new window.

Using a Different API Version

To upgrade to a new API version, you can contact us to update your key to point to the new version. An easy way to test this out first, would be to use an existing API key and pass in the v parameter in the url's query string. You can use the method PGetVersion if you're not sure what version you have. Here's an example script tag that uses version 1.0 of the API rather than the latest and greatest:

<script src="http://api.pushpin.com/js?key=A8C2B4DB310FF6A1987E1C06FCE83516&v=1.0" type="text/javascript"></script>

View example (version.html).

Dynamic Layers API - Examples

Pushpin map images are constituted of familiar map elements such as parks, streets, and labels that are known as GIS layers. The Pushpin Dynamic Layers extension has functions that support control over the layers that make up the basemap image. By default, GIS layers are merged on the server-side before being handed over as a single set of tiles (though they can be sent to the client as separate layers as well).

The Dynamic Layers API extension supports mapping, toggling on and off standard layers, and reordering layers in the stack. As such several, new classes are available through the API (such as PMapLayer -- see class reference below), and new functions have been added to some existing classes (such as PMap).

Toggling Map Layers Off

The following example shows how to toggle a layer within the stack of GIS layers that make up the image. In this example the PMapLayer.POLY, which contains polygons like parks and water bodies, is switched off. Click here for a list of available layers.

// Turn off poly layer
PMapLayer.POLY.off();

You can also access the PMapLayer objects in a PMapType to see what they are.

// Get the array of PMapLayer objects in the current PMapType and display
var layers = map.getCurrentMapType().getMapLayers();
var layerlist = "";
for (var i=0; i<layers.length; i++)
	layerlist += layers[i].getLabel() + ": " + layers[i].isOn() + "\n";
alert (layerlist);

View example (layers.html).

Creating a Custom Map Type

The following example shows how to create a custom map type using predefined layers and add it to the map. Custom layers can be created with Rendermap and the layer object made accessible. Click here for a list of currently available layers.

// Create custom map layers and map types
var base = new PMapLayer(PMapLayer.BASE);
var pointline = new PMapLayer(PMapLayer.POINTLINE);
var maptype = new PMapType([base,pointline]);

Custom zooms for a map type can also be defined.

// Create custom zooms
maptype.enableAbsoluteZooms([5,6,7,8,9,10,11,12,13]);

The following sets the map to view the custom map type.

// Set map type
map.setMapType(maptype);

The following shows how to add a layer after a map type has been created.

// Add another map layer (predefined) on top
maptype.addMapLayer(PMapLayer.CITIES);

You can also change the opacity of map layers.

// Change opacity of cities layer
PMapLayer.CITIES.setOpacity(0.5);

View example (maptype.html).

Adding Thematic Variables to the Map

Thematic mapping refers to color-coding of the map by region. Variables can be added to maps using the PIndicatorLoader class. Click here for our catalog of indicators and datasets from a variety of sources including ESRI, Claritas and Census. Value-added market information data can be purchased separately in transaction bundles. The following example is a quick way to underlay a thematic variable on a map.

// Add indicator to map with ID
map.setIndicatorById(168064);

View example (thematic.html).

Another way to add indicators is by loading the indicators first using PIndicatorLoader. The following example shows how to do this.

function onLoad() {
	// Load indicator
	PIndicatorLoader.load([168002,168524,168064],loadIndicators);
}

function loadIndicators(indicators) {
	...

	// Add indicator to map
	map.setIndicator(indicators[1]);
}

View example (thematic2.html).

Changing Thematic Colors on the Map

The thematic shading colors or color ramp can be changed. The default is a predefined green color ramp. Click here for a list of predefined color ramps. The following example shows how to create a custom color ramp and apply it to the map.

// Create custom color ramp
var mycolorramp = new PColorRamp('mine',
	[new PColor('F26522'), new PColor('F68E56'), new PColor('FBAF5D'), new PColor('FFF200'),
	new PColor('ACD373'), new PColor('A3D39C'), new PColor('7ACCC8'), new PColor('6DCFF6')]);

// Set map's legend to new color ramp
map.getLegend().setColorRamp(mycolorramp);

View example (colorramp.html).

Changing the Number of Thematic Breaks

The number of breaks or ranges can be changed for thematic layers. The default is 8. Valid values are from 3 to 8. The following example shows how to change the number of breaks on the map.

// Set map's legend with new number of breaks
map.getLegend().setNumberOfBreaks(4);

View example (breaks.html).

Setting Custom Thematic Breaks

You can define your own breaks or ranges in the API. Use PIndicator.setCustomBreaks() to set the new ranges, passed as a comma delimited string. An optional place type can be passed to set breaks for that place type (PIndicator.getPlaceTypes() gives you the place types available for the indicator). Otherwise, the current place type shaded on the map will be used. An optional period can also be passed to set breaks for a specific period (PIndicator.getPeriods() returns the periods available for the indicator). To restore the default breaks (based on quantile calculations), use PIndicator.restoreBreaks().

ind.setCustomBreaks('0,2000,4000,6000,8000,10000,12000,20000,40000',PPlaceType.CENSUSTRACT)

View example (custombreaks.html).

Merging Map Layers on the Client Side

By default, map layers are merged on the server side into a single tileset before being handed over to the browser. This is usually the best method for typical maps. Occasionally, it will make more sense to do certain overlays on the client side Some applications may involve users frequently toggling map layers on and off at a single location, which would see performance advantages because individual tiled map layers get stored on the client. However, the more layers that get merged on the client side will cause slower map loads and dragging. This example shows how to change the default behavior, by making the city map layer merge on the client side. Notice that the toggling of the city layer is much faster, and doesn't cause the tiles to be reloaded.

// Merge city layer on client side
PMapLayer.CITIES.mergeClient();

A similar method can be used to set all map layers in a maptype to be merged client or server side, e.g. PMapType.NORMAL.mergeClient(). Layers can be set differently to create a hybrid of client / server side merged layers.

View example (mergeclient.html).

Widgets

The Pushpin API provides the ability to add and embed custom and predefined widgets that control the map. Click here for a list of predefined widgets. These widgets can be dragged, collapsed and closed like standard windows. As well, the content in these widgets will update appropriately when certain functions are called. For widgets to work, the map object must first be declared globally, outside of the onLoad function e.g. var map = null.

Adding a Widget

Adding a widget is similar to embedding a map. The following example shows how to add a custom widget next to the map.


<script type="text/javascript">
//<![CDATA[

var map = null;

function onLoad() {
  // Creates a map
  map = new PMap(document.getElementById("map"));

  // Creates a new draggable widget
  var widget = new PWidget(map, document.getElementById("widget"));
  widget.setLabel("Custom Widget");
  var sampleHTML = "<br>This is a customizable and draggable widget.<br><br>";
  sampleHTML += "For example, you can add a link to place a pin on the map:<br><br>";
  sampleHTML += "<a href='javascript:map.addOverlay(new PMarker(new PLatLng(34.045, -118.235)))'>";
  sampleHTML += "Add pin</a><br><br>";
  widget.setContentHtml(sampleHTML);
  widget.enableDragging();

  // Initialize map -- center and zoom and add control
  map.setCenter(new PLatLng(34.045, -118.235), 8);
  map.addControl(new PLargeMapControl());
}

//]]>
</script>

<body onload="onLoad()" onunload="PUnload()">
  <div id="map" style="float:left; position:relative; width:450px; height:300px; border:1px solid #ccc">
  </div>
  <div style="float: left; padding-left: 10px; width: 250px">
    <div id="widget" style="float: left; position: relative; width: 250px"></div>
  </div>
</body>

View example (widget.html).

Adding Predefined Widgets

The Pushpin API has a library of predefined widget IDs. The following example adds the map layer widget. This widget allows you to toggle the map layers in the current map type.

// Creates a map layer widget
var widget1 = new PWidget(map, document.getElementById("widget1"), P_WIDGET_LAYER_ID);

The following example demonstrates how to add the thematic widget for choosing indicators. A list of indicators should be set when creating the widget. Click here for a list of available indicators. This widget will update the indicator, color ramp and breaks automatically if they are changed.

// Creates an indicator chooser widget for displaying thematic data
map.setIndicatorListByIds([168002,168524,168064]);
var widget2 = new PWidget(map, document.getElementById("widget2"), P_WIDGET_INDICATOR_ID);

View example (widgets.html).

Customizing Widget Styles

You can customize the look and feel of a widget by modifying CSS style objects for different parts of the widget. Click here for a list of properties that are customizable. The following example shows a widget with a different style and added on top of the map.

// Modify widget style
widget.background.style.backgroundColor = "#EFB500";
widget.background.style.border = "1px solid #333";
widget.box.style.border = "1px solid #cc6600";
widget.heading.style.backgroundColor = "#E78418";
widget.heading.style.border = "1px solid #cc6600";

View example (widgetstyle.html).

Overlay Sets and Filtering

The Pushpin API provides the ability to group overlays, such as markers and polylines, into sets which can then be turned on and off like layers. As well, markers and polylines can have attributes and when added to a set, filters can be applied which query by these attributes.

Adding Overlay Sets

The following example adds a set of random markers and a set of random polylines to the map, and adds the predefined overlay sets widget to control them.

// Create overlay sets and set labels
var markerSet = new POverlaySet(markers);
markerSet.setLabel("Markers");
var polylineSet = new POverlaySet(polylines);
polylineSet.setLabel("Lines");

// Turn polyline set off by default
polylineSet.off();

// Add sets to the map
map.setOverlaySets([markerSet,polylineSet]);

// Display sets in widget
var widget = new PWidget(map, document.getElementById("widget"), P_WIDGET_OVERLAY_ID);

View example (addset.html).

Adding Attributes and Filters

The following example assigns an attribute to random markers and adds it to a set. It also defines some filters to be called on the set. Click here for types of attributes and filters available.

View example (addfilter.html).

Displaying Filters

The following example creates two random marker sets and sets some filters for display in the overlay set widget.

View example (addfilterdisplay.html).

Adding Predefined Marker Sets

You can add predefined marker sets to the map, that get rendered on the server side when dealing with large amounts of pins (in the thousands). Using a different constructor for POverlaySet, you can specify the ID of the predefined set.

markerSet = new POverlaySet(500);

Click here for our catalog of point datasets from a variety of sources including NAVTEQ.

The markers get rendered on the server as a separate layer and merged on the map when there are too many markers in the map view (default threshold is 50), otherwise markers will be added on the client side. In addition, there is also a zoom level threshold (default is 12) that can be specified too, for when the switching between server side and client side markers takes place. Therefore, to identify markers, you need to check if there is a PMarker on the map (client side) and if not, use the identify function to see if there is marker where you clicked. Here is an example of how to do this.

// Attach click event to identify marker
PEvent.addListener(map, 'click', function(overlay, point) {
	if (overlay) {
		var attributes = overlay.getAttributes();
		overlay.openInfoWindowTabsHtml(printAttributes(attributes));
	}
	else {
		map.identify(point, function(markers) {
			if (markers.length > 0) {
				var attributes = markers[0].getAttributes();
				map.openInfoWindowTabsHtml(markers[0].getPoint(), printAttributes(attributes));
			}
		});
	}
});

Predefined marker sets have attributes attached to the individual markers. You can see these when you click on the metadata for the marker set in the catalog. These can then be used to filter the markers, using the attribute column name.

// Create filters for overlay set
var filter1 = new PAttributeFilter("Facility Type", [9121], PAttributeFilter.EQUAL,
				   "City Hall", "fac_type", PAttribute.NUMBER);
var filter2 = new PAttributeFilter("Facility Type", [7994], PAttributeFilter.EQUAL,
				   "Civic/Community Center", "fac_type", PAttribute.NUMBER);
var filter3 = new PAttributeFilter("Facility Type", [9211], PAttributeFilter.EQUAL,
				   "Court House", "fac_type", PAttribute.NUMBER);
var filter4 = new PAttributeFilter("Facility Type", [9221], PAttributeFilter.EQUAL,
				   "Police Station", "fac_type", PAttribute.NUMBER);

markerSet.setDisplayFilters([filter1, filter2, filter3, filter4]);

View example (addserverset.html).

Filtering Marker Sets by Icons

The following example color codes different categories of markers by using different icons for each filter. Filters are set up in the same way, but the function to use is setFiltersByIcons(). This currently only applies to server side markers, and does not get reflected in the overlay widget.

// Associate filters to icons
markerSet.setFiltersByIcons([filter1,filter2,filter3,filter4],[iconYellow,iconGrey,iconBlue,iconPurple]);

View example (addfiltersbyicons.html).

Class Reference

The following tables list the classes and methods currently available through the Pushpin API. Classes or methods that are only available as part of the Dynamic Layers API extension have a light green background.

`Class: PMap`
Method	Return	Description	Example
`new PMap(container, logo)`	`PMap`	The constructor. Creates a new map object within the HTML container, normally a `div` element. An optional logo (HTML DOM node) can be specified, which appears on the bottom right of the map, otherwise the default Pushpin logo will be used. Use a blank node as an argument if no logo is desired.	start.html
`enableDragging()`	`none`	Enables dynamic dragging of the map (enabled by default).	enabledragging.html
`disableDragging()`	`none`	Disables dynamic dragging of the map.	mergeclient.html
`draggingEnabled()`	`Boolean`	Returns `true` if dragging is enabled, `false` if dragging is disabled.	enabledragging.html
`enableInfoWindow()`	`none`	Enables display of the info window on the map (enabled by default).
`disableInfoWindow()`	`none`	Disables display of the info window on the map.
`infoWindowEnabled()`	`Boolean`	Returns `true` is info window is enabled, `false` if info window is disabled.
`enableDoubleClickZoom()`	`none`	Enables double click to zoom in (disabled by default). Double right mouse click zooms out. The default double click recenters the map on the point.	doubleclickzoom.html
`disableDoubleClickZoom()`	`none`	Disables double click to zoom in and out.	doubleclickzoom.html
`doubleClickZoomEnabled()`	`Boolean`	Returns `true` if double click to zoom is enabled, `false` otherwise.	doubleclickzoom.html
`enableContinuousZoom()`	`none`	Enables continuous zooming (disabled by default). The continuous zoom animation only occurs when zooming in or out one level.	continuouszoom.html
`disableContinuousZoom()`	`none`	Disables continuous zooming.	continuouszoom.html
`continuousZoomEnabled()`	`Boolean`	Returns `true` if continuous zoom is enabled, `false` otherwise.	continuouszoom.html
`enableScrollWheelZoom()`	`none`	Enables zooming in and out using the mouse scroll wheel (disabled by default).
`disableScrollWheelZoom()`	`none`	Disables zooming in and out with the mouse scroll wheel.
`scrollWheelZoomEnabled()`	`Boolean`	Returns true if mouse scroll wheel zooming is enabled, false otherwise.
`enableKeyboard()`	`none`	Enables keyboard control on the map (enabled by default). The up, down, left and right arrow keys pan the map by a small amount, the page down, page up, home and end keys pan the map by 1/2 the size of the map, and the "+" and "-" keys zoom in and out respectively.
`disableKeyboard()`	`none`	Disables keyboard control on the map.
`keyboardEnabled()`	`Boolean`	Returns true if keyboard control is enabled, false otherwise.
`addControl(control)`	`none`	Adds a control to the map, such as a `PSmallMapControl`. Click here for a list of available controls.	smallmapcontrol.html
`removeControl(control)`	`none`	Removes the given control from the map.
`hasControl(control)`	`Boolean`	Returns `true` if control is added to the map, `false` if control is not on the map.	hascontrol.html
`getContainer()`	`Node`	Returns the DOM object (normally a `div` element) that contains the map.
`getCenter()`	`PLatLng`	Returns a `PLatLng` object that represents the center point of the current map view in latitude/longitude.	infowindow.html
`getBounds()`	`PLatLngBounds`	Returns a `PLatLngBounds` object that represents the rectangular bounding box of the current map view in latitude/longitude.	overlay.html
`getBoundsZoomLevel(bounds)`	`Number`	Returns the maximum zoom level at which the given rectangular bounds can fit in the map view, for the current map type.
`getSize()`	`PSize`	Returns the size of the map view in pixels.
`getZoom()`	`Number`	Returns the zoom level of the current map.	zoom.html
`getAbsoluteZoom()`	`Number`	Returns the absolute zoom level of the current map type.	breadcrumbs.html
`setCenter(center, zoom)`	`none`	Centers the map at the given `center`. If the `zoom` is specified, map zooms to the given zoom level. This method (or `setCenterBounds`) should be called first, right after a new `PMap` is declared, to set the initial map view.	start.html
`setCenterBounds(bounds)`	`none`	Centers the map at the maximum zoom level which the given rectangular bounds can fit in the map view.
`panTo(center)`	`none`	Centers the map at the given `center`. If the point is within the current map view, the map will pan smoothly to the point.	panto.html
`panBy(distance)`	`none`	Pans smoothly by the given `PSize` distance in pixels. Negative width moves the map to the right (like dragging the map left), negative height moves the map down (like dragging the map up).	panby.html
`panDirection(dx, dy)`	`none`	Similar to `panBy` but pans smoothly by half the width and height of the map using -1, 0 or 1 as direction values for `dx` and `dy`. Negative direction (-1) moves the map to the right (dx) or down (dy).	pandirection.html
`setZoom(level)`	`none`	Zooms to the given `level`. If the zoom level is not valid, the request is ignored.	zoom.html
`setAbsoluteZoom(level)`	`none`	Zooms to the given absolute zoom `level`. If the zoom level is not valid, the request is ignored.	zoom.html
`zoomIn()`	`none`	Zooms in by one zoom level (+1).	zoom.html
`zoomOut()`	`none`	Zooms out by one zoom level (-1).	zoom.html
`printImage(size, center, zoom, marker)`	`String`	Returns the URL of a single image of the current map type with the current size, center and zoom level of the map, unless the optional parameters are specified. A marker can also be specified, or if one already exists on the map, that will automatically be included in the image.	printmap.html
`savePosition()`	`none`	Stores the current map view (coordinates and zoom level). This can later be used by `returnToSavedPosition` to return to this view.	saveposition.html
`returnToSavedPosition()`	`none`	Returns to the map view that was saved by `savePosition`. Returns to the last result if no position was saved.	saveposition.html
`addOverlay(overlay)`	`none`	Adds the given `PMarker` or `PPolyline` `overlay` to the map.	overlay.html
`removeOverlay(overlay)`	`none`	Removes the given overlay (`PMarker` or `PPolyline`) from the map.	click.html
`clearOverlays()`	`none`	Removes all overlays from the map.
`openInfoWindow(point, node)`	`none`	Displays an info window at the given point with the given HTML DOM node.	infowindow.html
`openInfoWindowHtml(point, html)`	`none`	Displays an info window at the given point with the given HTML string.
`openInfoWindowTabs(point, tabs)`	`none`	Displays an info window at the given point with the given tabs (DOM nodes are used for the contents).
`openInfoWindowTabsHtml(point, tabs)`	`none`	Displays an info window at the given point with the given tabs (HTML strings are used for the contents).
`closeInfoWindow()`	`none`	Closes the info window if it is displayed on the map.
`getInfoWindow()`	`PInfoWindow`	Returns the info window.	getinfowindow.html
`fromLatLngToDivPixel(latlng)`	`PPoint`	Converts the given geographical point in the map's DOM element into pixel coordinates, with (0,0) being the top left corner of the map view.	latlngtopixel.html
`fromDivPixelToLatLng(pixel)`	`PLatLng`	Converts the given pixel point in the map's DOM element into geographical coordinates, with (0,0) being the top left corner of the map view.	latlngtopixel.html
`addOverlaySet(overlayset)`	`none`	Adds the given `POverlaySet` to the map.	addfilter.html
`removeOverlaySet(overlayset)`	`none`	Removes the given `POverlaySet` from the map.
`clearOverlaySets()`	`none`	Removes all overlay sets from the map.
`setOverlaySets(overlaysets)`	`none`	Sets the array of overlay sets for the map.	addset.html
`getOverlaySets()`	`Array of POverlaySet`	Returns the array of overlay sets from the map.
`identify(point, callback, markerMax)`	`none`	If using predefined server side markers with `POverlaySet`, this method can be used to see if any markers lie around the `point` given. An array of `PMarkers` will be returned via the `callback` function sorted by the closest markers to the point, if any. An optional `markerMax` parameter can be set to specify the maximum number of markers to return. The default is set to 20.	addserverset.html
`setMapType(maptype)`	`none`	Sets the map type for the map. Click here for a list of predefined map types.	maptype.html
`getCurrentMapType()`	`PMapType`	Returns the currently selected map type for the map.	mergeclient.html
`setLegend(legend)`	`none`	Sets the `PLegend` for the map.
`getLegend()`	`PLegend`	Returns the `PLegend` for the map.	colorramp.html
`setIndicator(indicator)`	`none`	Sets and displays the given indicator on the map. The indicator has to first be loaded using `PIndicatorLoader`. Click here for a list of available indicators.	thematic2.html
`setIndicatorById(id)`	`none`	Sets and displays the indicator with the given id on the map. This is a quick way to add an indicator to the map that does not require `PIndicatorLoader`. However, the properties of the indicator will not be available within the same function. Click here for a list of available indicators.	thematic.html
`removeIndicator()`	`none`	Removes the current indicator from the map.
`getIndicator()`	`PIndicator`	Returns the current indicator on the map.
`setIndicatorList(indicators)`	`none`	Sets the array of `PIndicator` objects to be used with the indicator widget. The indicators have to first be loaded using `PIndicatorLoader`.
`setIndicatorListByIds(ids)`	`none`	Sets the array of `PIndicator` objects to be used with the indicator widget with the given array of ids. This is a quick way to add indicators to the widget that does not require loading indicators with `PIndicatorLoader`.	widgets.html
`getIndicatorList()`	`Array of PIndicator`	Returns the array of `PIndicator` objects used with the indicator widget.

Event	Argument	Description	Example
`click`	`overlay, point`	This event gets triggered when a mouse click happens on the map. The overlay argument will contain a value if the user clicked on a marker and will be passed to the event handler. The latitude and longtiude of the click will be passed as a `PLatLng` if no overlay was clicked.	click.html
`movestart`	`none`	This event gets triggered when the map view starts changing. This could happen from a pan, drag or a method that changes the map view.	events.html
`move`	`none`	This event gets triggered as the map view changes.
`moveend`	`none`	This event gets triggered when the map view has finished changing.	events.html
`zoomstart`	`none`	This event gets triggered at the beginning of a zoom level change on the map.	events.html
`zoomend`	`none`	This event gets triggered at the end of a zoom level change on the map.	events.html
`infowindowopen`	`none`	This event gets triggered when the info window opens.
`infowindowclose`	`none`	This event gets triggered when the info window closes. This includes the info window automatically closing when another window is opened.
`addoverlay`	`overlay`	This event gets triggered when an overlay gets added to the map with `addOverlay()`. The overlay is passed as an argument to the event handler.
`removeoverlay`	`overlay`	This event gets triggered when an overlay is removed from the the map with `removeOverlay()`. The overlay is passed as an argument to the event handler.
`clearoverlays`	`none`	This event gets triggered when all overlays are removed from the the map with `clearOverlays()`. The `removeoverlay` event does not get triggered in this case.
`mousemove`	`none`	This event gets triggered when the mouse is moved inside the map.
`dragstart`	`none`	This event gets triggered when the map starts getting dragged.	events.html
`drag`	`none`	This event gets triggered as the map gets dragged.
`dragend`	`none`	This event gets triggered when the map stops being dragged.	events.html
`setindicator`	`indicator`	This event gets triggered when an indicator gets added to the map with `setIndicator()`. The indicator is passed as an argument to the event handler.
`removeindicator`	`indicator`	This event gets triggered when an indicator gets removed from the map with `removeIndicator()`. The indicator is passed as an argument to the event handler.
`addoverlayset`	`overlayset`	This event gets triggered when an overlay set gets added to the map with `addOverlaySet()`. The `POverlaySet` is passed as an argument to the event handler.
`removeoverlayset`	`overlayset`	This event gets triggered when an overlay set gets removed from the map with `removeOverlaySet()`. The `POverlaySet` is passed as an argument to the event handler.
`clearoverlaysets`	`none`	This event gets triggered when all overlay sets are removed from the map with `clearOverlaySets()`. The `removeoverlayset` event does not get triggered in this case.
`setoverlaysets`	`overlaysets`	This event gets triggered when overlay set(s) get added to the map with `setOverlaySets()`. The array of `POverlaySets` is passed as an argument to the event handler. The `addoverlayset` event does not get triggered in this case.

`Class: PInfoWindow`
Method	Return	Description	Example
`selectTab(index)`	`none`	Selects the given index of the tab array. 0 is the index of the first tab.	getinfowindow.html
`hide()`	`none`	Hides the info window.	getinfowindow.html
`show()`	`none`	Shows the info window.	getinfowindow.html
`isHidden()`	`Boolean`	Returns true if the info window is hidden, else returns false.	getinfowindow.html
`getPoint()`	`PLatLng`	Returns the point where the info window is anchored.	getinfowindow.html
`getSelectedTab()`	`Number`	Returns the index of the currently selected info window tab.	getinfowindow.html
`getTabs()`	`Array of PInfoWindowTab`	Returns the array of info window tabs.	getinfowindow.html

`Class: PInfoWindowTab`
Method	Return	Description	Example
`new PInfoWindowTab(label, content)`	`PInfoWindowTab`	Creates a new info window tab with the given label and content. The content can be an HTML string or a DOM element.	tabs.html

`Class: PMarker`
Method	Return	Description	Example
`new PMarker(point, icon)`	`PMarker`	The constructor. Creates a new `PMarker` object at the given `point`. A `PIcon` can be specified, otherwise the default Pushpin icon will be used.	addpin.html changeicon.html
`openInfoWindow(content)`	`none`	Displays an info window above the marker with the given HTML DOM element.
`openInfoWindowHtml(content)`	`none`	Displays an info window above the marker with the given HTML string.	infowinmarkup.html
`openInfoWindowTabs(tabs)`	`none`	Displays an info window above the marker with the given tabs (DOM nodes are used for the contents).
`openInfoWindowTabsHtml(tabs)`	`none`	Displays an info window above the marker with the given tabs (HTML strings are used for the contents).	tabs.html
`getIcon()`	`PIcon`	Returns the icon for this marker.
`getPoint()`	`PLatLng`	Returns the point where this marker is anchored.
`setPoint(point)`	`none`	Sets the point where this marker is to be anchored.
`addAttribute(attribute)`	`none`	Adds the given attribute to this marker.	addfilter.html
`removeAttribute(name)`	`none`	Removes the attribute with the given name from this marker.
`getAttribute(name)`	`PAttribute`	Returns the attribute with the given name from this marker.
`setAttributes(attributes)`	`none`	Sets the given array of attributes to this marker.	addfilterdisplay.html
`getAttributes()`	`Array of PAttribute`	Returns the array attributes for this marker.

Event	Argument	Description	Example
`click`	`none`	This event gets triggered when a mouse click happens on the marker.	infowinmarkup.html
`dblclick`	`none`	This event gets triggered when a mouse double click happens on the marker.
`mousedown`	`none`	This event gets triggered when a mousedown happens on the marker.
`mouseup`	`none`	This event gets triggered when a mouseup happens on the marker.
`mouseover`	`none`	This event gets triggered when a mouseover happens on the marker.
`mouseout`	`none`	This event gets triggered when a mouseout happens on the marker.

`Class: PPolyline`
Method	Return	Description	Example
`new PPolyline(points, color, weight, opacity)`	`PPolyline`	The constructor. Creates a new `PPolyline` object from the given points (array of `PLatLng` objects). The `color` (in HTML hex form like "#ff0000"), `weight` (thickness in pixels), and `opacity` (value between 0 and 1) can be specified.	overlay.html
`getVertexCount()`	`Number`	Returns the number of vertices (points) that the polyline contains.
`getVertex(index)`	`PLatLng`	Returns the vertex (point) in the polyline with the given index.
`getBounds()`	`PLatLngBounds`	Returns the bounding box for this polyline.
`getCentroid()`	`PLatLng`	Returns the centroid of this polyline.
`addAttribute(attribute)`	`none`	Adds the given attribute to this polyline.
`removeAttribute(name)`	`none`	Removes the attribute with the given name from this polyline.
`getAttribute(name)`	`PAttribute`	Returns the attribute with the given name from this polyline.
`setAttributes(attributes)`	`none`	Sets the given array of attributes to this polyline.
`getAttributes()`	`Array of PAttribute`	Returns the array of attributes for this polyline.

`Class: PPolygon`
Method	Return	Description	Example
`new PPolygon(points, color, weight, opacity, fillColor)`	`PPolygon`	The constructor. Creates a new `PPolygon` object from the given points (array of `PLatLng` objects). The `color` (in HTML hex form like "#ff0000"), `weight` (thickness in pixels), and `opacity` (value between 0 and 1) can be specified for the border of the polygon (same as `PPolyline`). Additionally, you can specify a `fillColor` to shade the polygon.	overlay.html
`getVertexCount()`	`Number`	Returns the number of vertices (points) that the polygon contains.
`getVertex(index)`	`PLatLng`	Returns the vertex (point) in the polygon with the given index.
`getBounds()`	`PLatLngBounds`	Returns the bounding box for this polygon.
`getCentroid()`	`PLatLng`	Returns the centroid of this polygon.
`addAttribute(attribute)`	`none`	Adds the given attribute to this polygon.
`removeAttribute(name)`	`none`	Removes the attribute with the given name from this polygon.
`getAttribute(name)`	`PAttribute`	Returns the attribute with the given name from this polygon.
`setAttributes(attributes)`	`none`	Sets the given array of attributes to this polygon.
`getAttributes()`	`Array of PAttribute`	Returns the array of attributes for this polygon.

`Class: POverlaySet`
Method	Return	Description	Example
`new POverlaySet(overlays, manager)`	`POverlaySet`	The constructor. Creates an overlay set containing the given array of overlays. Marker operations will be handled by a marker manager if specified (this means the overlays must only contain markers).	addset.html
`new POverlaySet(id, icon, zoom, max)`	`POverlaySet`	The constructor for creating a predefined marker set from the Pushpin catalog (specified by `id`), using server side rendering to achieve this when displaying large amounts of markers (in the thousands). Click here to see available point datasets in the catalog. The `icon` can be specified, otherwise `PIcon.POINT` will be used. The `zoom` determines when the rendering should switch to the client side, e.g. the default is 12 so it would render markers on the client side for zoom levels 12 and above. In addition, the `max` number of markers to be displayed on the client side can be set as well, the default is 50 (e.g. if more than 50 pins show on the map, it would always render the markers on the server).	addserverset.html
`setLabel(label)`	`none`	Sets the label for this overlay set.	addset.html
`getLabel()`	`String`	Returns the label for this overlay set.
`addOverlay(overlay)`	`none`	Adds the given `overlay` to this overlay set. If the set is turned on, then the overlay gets added to the map.
`removeOverlay(overlay)`	`none`	Removes the given `overlay` from this overlay set. If the set is turned on, then the overlay gets removed from the map.
`getOverlays()`	`Array of PMarker or PPolyline`	Returns the array of overlays in this overlay set. If filters are set, this returns the filtered overlays.
`getOverlayCount()`	`Number`	Returns the number of overlays in this overlay set. If filters are set, this returns the number of filtered overlays. If using predefined server side markers, this returns the number of markers in the map view.
`on()`	`none`	Turns on this overlay set. This adds the overlays on the map.
`off()`	`none`	Turns off this overlay set. This removes the overlays from the map.	addset.html
`isOn()`	`Boolean`	Returns `true` if this overlay set is on, `false` otherwise.
`addFilter(filter)`	`none`	Adds the given filter to this overlay set and refreshes and displays the filtered overlays on the map if this set is turned on.	addfilter.html
`removeFilter(filter)`	`none`	Removes the given filter from this overlay set and refreshes the overlays on the map if this set is turned on.
`clearFilters()`	`none`	Removes all filters from this overlay set and refreshes the overlays on the map if this set is turned on.	addfilter.html
`setFilters(filters)`	`none`	Sets the given array of filters to this overlay set and refreshes the overlays on the map if this set is turned on.
`getFilters()`	`Array of PAttributeFilter`	Returns the array of filters for this overlay set.
`setDisplayFilters(filters)`	`none`	Sets the array of filters to be displayed for choosing if the overlay widget is used. The array order is the order of display.	addfilterdisplay.html
`setFiltersByIcons(filters, icons)`	`none`	Sets filters on this overlay set by icons by associating the given array of filters to the array of icons. Refreshes the overlays on the map if this set is turned on. Currently only applies to predefined server side marker sets.	addfiltersbyicons.html
`clearFiltersByIcons()`	`none`	Removes all filtering by icons from this overlay set and refreshes the overlays on the map if this set is turned on. Currently only applies to predefined server side marker sets.	addfiltersbyicons.html

`Class: PIcon`
Method	Return	Description	Example
`new PIcon(icon)`	`PIcon`	The constructor. Creates a new `PIcon` object. If a `PIcon` is specified, its properties are copied. Click here for a list of predefined Pushpin icons.	icon.html

Property	Type	Description	Example
`image`	`String`	The URL of the icon image to be used.	icon.html
`shadow`	`String`	The URL of the icon's shadow image to be used.	icon.html
`iconSize`	`PSize`	The size of the icon image in pixels.	icon.html
`shadowSize`	`PSize`	The size of the icon's shadow image in pixels.	icon.html
`iconAnchor`	`PPoint`	The offset for the icon in pixels, to anchor the icon to the marker's point.	icon.html
`shadowAnchor`	`PPoint`	The offset for the shadow in pixels, to anchor the shadow to the marker's point.	icon.html
`infoWindowAnchor`	`PPoint`	The offset for the info window in pixels, to anchor the info window to the marker's point.	icon.html

`Class: PEvent`
Method	Return	Description	Example
`addListener(source, event, function)`	`PEventListener`	A static method that registers an event handler, which will call the given function when the given event happens on the source object. Returns a `PEventListener` object that can be used to remove the handler. The function will have a reference to `this` that points to the source object.	infowinmarkup.html
`addDomListener(source, event, function)`	`PEventListener`	A static method that works exactly like addListener but is specific to DOM nodes and events.	findplace.html
`removeListener(listener)`	`none`	A static method that removes the given `PEventListener` object that was created with `addListener()` or `addDomListener()`.	findplace.html
`clearListeners(source, event)`	`none`	A static method that removes all `PEventListener` objects that were created with `addListener()` or `addDomListener()`, for the given object and event.
`clearInstanceListeners(source)`	`none`	A static method that removes all `PEventListener` objects that were created with `addListener()` or `addDomListener()`, for all events attached to the given object.

`Class: PEventListener`
This class has no constructors or methods. It is only returned when using `PEvent` functions `addListener()` and `addDomListener()`, and can be passed to `removeListener()`.

`Class: PClientGeocoder`
Method	Return	Description	Example
`new PClientGeocoder()`	`PClientGeocoder`	The constructor. Creates an object that can convert address strings into a latitude and longitude coordinates.	geocode.html
`getLatLng(address, callback)`	`none`	Calls the Pushpin geocoder to geocode an address and return the result via the callback function. If the address is found, the result returned is a `PLatLng`, otherwise `null` is returned.	geocode.html
`getLocations(address, callback)`	`none`	Calls the Pushpin geocoder to geocode an address and return the result via the callback function. The result returned is a `PAddress`.	geocode2.html
`getPlace(search, callback, maxResults, order, placeTypes, country)`	`none`	Searches for the `search` string given and returns an array of `PPlace` objects that match the string via the callback function. The `maxResults` argument can be specified to limit the number of `PPlace` objects returned in the array when more than one result is found (default is 10). The `order` can also be specified with a `PPlaceOrder` object e.g. AREA (default -- orders by largest place first) or LABEL (order by the place name/label). The `placeTypes` array can also be specified to restrict the results only by the types in the array. Click here for a list of place types. Finally, you can also restrict the results returned using the optional country parameter, e.g. 'united states'.	findplace.html
`getPlaceContainment(center, placetype, callback)`	`none`	Finds the place closest to the `center` for the given `placetype` and returns an array of `PPlace` objects that contain the place (ordered by largest first) via the callback function. Click here for a list of place types.	breadcrumbs.html

`Class: PPlaceLoader`
Method	Return	Description	Example
`load(ids, callback)`	`none`	A static method that loads the given array of place ids and returns an array of `PPlace` objects via `callback`. The `callback` argument must be a `Function` that accepts an array as its first argument. Currently, we don't have a catalog of places to browse through, so the ids can be obtained from `PPlace()` via functions like `PClientGeocoder.getPlace()`.

`Class: PPlace`
Method	Return	Description	Example
`getID()`	`Number`	Returns the distinct id of this place. `PPlace` is usually not instantiated and gets returned by various function calls like `PClientGeocoder.getPlace()`.
`getLabel()`	`String`	Returns display name for this place.	findplace.html
`getType()`	`PPlaceType`	Returns the place type.	findplace.html
`getBounds()`	`PLatLngBounds`	Returns the bounding box for the place.	findplace.html
`getCentroid()`	`PLatLng`	Returns the centroid of the place.
`getArea()`	`Number`	Returns the area of this place in square meters.
`getPopulation()`	`Number`	Returns the population of this place.
`getState()`	`String`	Returns the state (abbreviated if possible) that this place is in.	findplace.html
`getVertices()`	`Array of PLatLng Arrays`	Returns an array of `PLatLng` arrays to symbolize simplified groups of vertices (some boundaries have multiple polygons) for this place. This can be used with `PPolyline` or `PPolygon` to highlight the geography of the place.	findplace.html
`getIdentifier()`	`String`	Returns the standard identifier of this place, e.g. "06037" for Los Angeles County
`getCountry()`	`String`	Returns the name of the country that this place is in.

`Class: PPlaceType`
Method	Return	Description	Example
`getName()`	`String`	Returns the name of this place type. `PPlaceType` objects are predefined. Click here for a list of place types.	findplace.html
`getMapLayers()`	`Array of PMapLayer`	Returns an array of map layers that are associated with this place type. Returns `null` if none are found.

`Class: PPlaceTypeConfig`
Method	Return	Description	Example
`setTypeByAbsoluteZoom(zoom, type)`	`none`	Sets the maximum zoom level in which to use the given place type. Click here to see a list of predefined `PPlaceTypeConfig` objects.
`getTypeByAbsoluteZoom(zoom)`	`PPlaceType`	Returns the corresponding type given the zoom level.	breadcrumbs.html

`Class: PAddress`
Method	Return	Description	Example
`new PAddress(addr, x, y, errorMsg, errorCode)`	`PAddress`	The constructor. Creates an object that stores an address and its coordinates if it was geocoded. See the `PGeocoder` class.	geocode2.html
`wasFound()`	`Boolean`	Returns `true` if the address was geocoded successfully (i.e. the `x` and `y` properties of the object have values); `false` otherwise.	geocode2.html

Property	Type	Description	Example
`addr`	`String`	Calls the pushpin geocoder to geocode the address and return the result via `callback`. The `address` argument must be a `PAddress` object. The `callback` argument must be a `Function` that accepts a `PAddress` as its first argument.	geocode2.html
`x`	`Number`	The longitudinal coordinate of the address.	geocode2.html
`y`	`Number`	The latitudinal coordinate of the address.	geocode2.html
`errorMsg`	`String`	User-friendly text describing why an error ocurred in geocoding the address.	geocode2.html
`errorCode`	`Number`	A number indicating the type of error that occurred when geocoding the address.	geocode2.html

`Class: PMarkerManager`
Method	Return	Description	Example
`new PMarkerManager(map, icon)`	`PMarkerManager`	The constructor. Creates a new `PMarkerManager` object to control the number of markers visible at one time in the given map by grouping markers into clusters. If an `icon` is specified, that icon is used for the cluster of markers, otherwise the default icon is used. Click here for a list of predefined icons.	markermanager.html
`addMarkers(markers)`	`none`	Adds the given array of markers to the map.
`addMarker(marker)`	`none`	Adds the given marker to the map.	markermanager.html
`removeMarker(marker)`	`none`	Removes the given marker from the map.
`clearMarkers()`	`none`	Removes all markers added by this marker manager from the map.	clearmarkers.html
`getIcon()`	`PIcon`	Returns the cluster icon used by this marker manager.
`setMaxVisibleMarkers(number)`	`none`	Sets the maximum number of visible markers to be displayed on the map view at one time. The default is 150.
`setMinMarkersPerCluster(number)`	`none`	Sets the minimum number of markers that is required to be grouped into a cluster. The default is 5.

`Class: PPoint`
Method	Return	Description	Example
`new PPoint(x, y)`	`PPoint`	The constructor. Creates a new `PPoint` object with the `x` and `y` coordinates in pixels.	icon.html
`equals(other)`	`Boolean`	Returns `true` if the given point has equal coordinates, `false` otherwise.
`toString()`	`String`	Returns a string representation of this point with the x and y values separated by a comma and surrounded by parentheses.

Property	Type	Description	Example
`x`	`Number`	The x coordinate value in pixels.
`y`	`Number`	The y coordinate value in pixels.

`Class: PSize`
Method	Return	Description	Example
`new PSize(width, height)`	`PSize`	The constructor. Creates a new `PSize` object with the given width and height measurement values. This could be in longitude (width) or latitude (height) or in pixels.	icon.html
`equals(other)`	`Boolean`	Returns `true` if the given `PSize` is equal, `false` otherwise.
`toString()`	`String`	Returns a string representation with the width and height values separated by a comma and surrounded by parentheses.

Property	Type	Description	Example
`width`	`Number`	The width value.
`height`	`Number`	The height value.

`Class: PBounds`
Method	Return	Description	Example
`new PBounds(minX, minY, maxX, maxY)`	`PBounds`	The constructor. Creates a new `PBounds` object with the given coordinates in pixels that represent a rectangle. `minX, minY` represent the top left coordinates of the rectangle and `maxX, maxY` represent the bottom right coordinates.	overlay.html
`toString()`	`String`	Returns a string representation with the top left and bottom right coordinates separated by a comma and surrounded by parentheses.
`min()`	`PPoint`	Returns a `PPoint` of the top left coordinate.
`max()`	`PPoint`	Returns a `PPoint` of the bottom right coordinate.
`containsBounds(other)`	`Boolean`	Returns `true` if the given `PBounds` rectangle is contained within this rectangle, `false` otherwise.
`extend(point)`	`none`	Enlarges this `PBounds` rectangle to contain the given point, if the point lies outside the bounds.

Property	Type	Description
`minX`	`Number`	The x coordinate value of the left point of the rectangle in pixels.
`minY`	`Number`	The y coordinate value of the top point of the rectangle in pixels.
`maxX`	`Number`	The x coordinate value of the right point of the rectangle in pixels.
`maxY`	`Number`	The y coordinate value of the bottom point of the rectangle in pixels.

`Class: PLatLng`
Method	Return	Description	Example
`new PLatLng(lat, lng)`	`PLatLng`	The constructor. Creates a new `PLatLng` object with the `lat` and `lng` coordinates in degrees.	start.html
`lat()`	`Number`	Returns the latitude coordinate in degrees.	overlay.html
`lng()`	`Number`	Returns the longitude coordinate in degrees.	overlay.html
`latRadians()`	`Number`	Returns the latitude coordinate in radians.
`lngRadians()`	`Number`	Returns the longitude coordinate in radians.
`equals(other)`	`Boolean`	Returns true if the coordinates of two points are identical.
`distanceFrom(other)`	`Number`	Returns the estimated distance in meters from this point to the `other` one. The number returned is always positive.	distance.html
`toString()`	`String`	Returns a string representation of this point with the lat and lng values separated by a comma and surrounded by parentheses.

`Class: PLatLngBounds`
Method	Return	Description	Example
`new PLatLngBounds(sw, ne)`	`PLatLngBounds`	A constructor. Creates a new `PLatLngBounds` object with the given south-west and north-east points that represent a rectangle.	overlay.html
`new PLatLngBounds(center, radius)`	`PLatLngBounds`	A constructor. Creates the smallest `PLatLngBounds` object that covers the dimensions of the circle defined by the parameters. The bounds rectangle is centered on the `center` parameter. The radius parameter should be a distance in meters from the center to the edge of the circle.	distancezoom.html
`contains(latlng)`	`Boolean`	Returns true if the point lies within the rectangle, false otherwise.
`containsBounds(other)`	`Boolean`	Returns `true` if the given `PLatLngBounds` rectangle is contained within this rectangle, `false` otherwise.
`extend(latlng)`	`none`	Enlarges this `PLatLngBounds` rectangle to contain the given point, if the point lies outside the bounds.
`getSouthWest()`	`PLatLng`	Returns the south-west point of the rectangle.	overlay.html
`getNorthEast()`	`PLatLng`	Returns the north-east point of the rectangle.	overlay.html
`toSpan()`	`PLatLng`	Returns a `PLatLng` that represents the size of the rectangle.
`isEmpty()`	`Boolean`	Returns `true` if this `PLatLngBounds` rectangle is empty, `false` otherwise.
`getCenter()`	`PLatLng`	Returns the center point of the rectangle.
`toString()`	`String`	Returns a string representation with the south-west and north-east coordinates separated by a comma and surrounded by parentheses.

`Class: PAttribute`
Method	Return	Description	Example
`new PAttribute(name, value, type)`	`PAttribute`	The constructor. Creates a new `PAttribute` object with the given name, value and type. The `value` argument must be of the type given in the `type` argument. Click here for a list of supported types.	addfilter.html

Property	Type	Description	Example
`name`	`String`	The name of this attribute.
`value`	`Variable`	The value for this attribute.	addfilter.html
`type`	`Number`	The type for this attribute, e.g. PAttribute.NUMBER. The `value` property must be of this type. Click here for a list of supported types.
`columnName`	`String`	The column name that gets returned when using a predefined `POverlaySet`.

`Class: PAttributeFilter`
Method	Return	Description	Example
`new PAttributeFilter(name, values, type, valuesDisplay, columnName, columnType)`	`PAttributeFilter`	The constructor. Creates a new `PAttributeFilter` object with the given name of the attribute, values and type. The values in the `values` array must be of the type of the attribute. Set the optional parameter `valuesDisplay` with the label display for the filter in the filter widget. If using a predefined server side `POverlaySet`, you need to specify the `columnName` and `columnType` as well.	addfilter.html addserverset.html

Property	Type	Description
`name`	`String`	The name of the attribute to filter.
`values`	`Array of Variable`	The value(s) to filter the attribute by.
`type`	`Number`	The filter type to apply on the attribute with the value(s), e.g. PAttributeFilter.EQUAL. Click here for a list of supported types.
`valuesDisplay`	`String`	The display of the filter values (shows up in the overlay set filter widget). If not specified, a standard default way of displaying the values will be used.
`columnName`	`String`	The column name of the attribute to filter, if using a predefined `POverlaySet`
`columnType`	`Number`	The column attribute type, e.g. PAttribute.NUMBER, if using a predefined `POverlaySet`. Click here for a list of supported types.

`Class: PXmlHttp`
Method	Return	Description	Example
`create()`	`PXmlHttp`	A static method that creates a new instance of a browser independent `XmlHttpRequest` object.

`Class: PXml`
Method	Return	Description	Example
`parse(xmltext)`	`Node`	A static method that parses the given XML text and returns a DOM node.	xml.html
`value(xmlnode)`	`String`	A static method that returns the text of the XML document fragment given as a DOM node.	xml.html

`Class: PXslt`
Method	Return	Description	Example
`new PXslt(xsltnode)`	`PXslt`	The constructor. Creates a `PXslt` object from the XSLT stylesheet given as a DOM node.
`transformToHtml(xmlnode, htmlnode)`	`Boolean`	Returns `true` and applies the XSLT stylesheet from this `PXslt` object to the the given XML document given as a DOM node and appends the resulting HTML document element to the given HTML node, if this is supported in the browser. If not, the function will do nothing and return `false`.

`Class: PLargeMapControl`
Method	Return	Description	Example
`new PLargeMapControl()`	`PLargeMapControl`	The constructor. Creates a zoom control on the map, including the zoom slider.	largecontrol.html

`Class: PSmallMapControl`
Method	Return	Description	Example
`new PSmallMapControl()`	`PSmallMapControl`	The constructor. Creates a zoom control on the map, without the zoom slider.	smallmapcontrol.html

`Class: PMapTypeControl`
Method	Return	Description	Example
`new PMapTypeControl()`	`PMapTypeControl`	The constructor. Creates a map type control on the map for toggling between the normal map (`PMapType.NORMAL`), satellite (`PMapType.SATELLITE`) and hybrid (`PMapType.HYBRID`).

`Function: PUnload`
Function	Return	Description	Example
`PUnload()`	`none`	A global function that can be attached to the `unload` event to reduce memory leaks in various browsers. It will also help if all events in the application are handled with `PEvent`.	start.html

`Function: PDownloadUrl`
Function	Return	Description	Example
`PDownloadUrl(url, onload)`	`none`	A global function that asynchronously retrieves the XML file from `url` and calls the `onload` function with the text of the file as the first argument and the HTTP status response code (e.g. 200 for success) as the second argument. This uses `PXmlHttp` to create an `XmlHttpRequest` object which means `url` must refer to the same server as the URL of the current document (it's better to use an absolute or relative path for `url`).	xml.html

`Function: PGetVersion`
Function	Return	Description	Example
`PGetVersion()`	`String`	A global function that returns the version number of the API.

Dynamic Layers Extended API Class Reference

The following classes are unique to the Pushpin Dynamic Layers API extension.

`Class: PMapType`
Method	Return	Description	Example
`new PMapType(mapLayers)`	`PMapType`	The constructor. Creates a new PMapType object with the given array of `PMapLayer` objects. The map layers are stacked according to the order of the array, the bottom map layer being the 0 element of the array. Click here for a list of available map layers.	maptype.html
`setLabel()`	`none`	Sets the label for this map type.
`getLabel()`	`String`	Returns the label for this map type.
`getMapLayers()`	`Array of PMapLayer`	Returns the array of `PMapLayer` objects in this map type.
`addMapLayer(mapLayer, position)`	`none`	Adds the given `PMapLayer` to this map type. If the position is specified, the map layer is added to that position in the array, otherwise it adds it to the end (map layer displays on top).	maptype.html
`removeMapLayer(mapLayer)`	`none`	Removes the given `PMapLayer` from this map type.
`enableAbsoluteZooms(zooms)`	`none`	Enables the given absolute zoom levels in the array. Disables all other zoom levels in the map type.	maptype.html
`getEnabledAbsoluteZooms()`	`Array of Number`	Returns an array of the enabled absolute zoom levels for this map type. All zoom levels are enabled by default.
`getAbsoluteZooms()`	`Array of Number`	Returns an array of all the available absolute zoom levels for this map type.
`mergeClient()`	`none`	Merges all map layers in this map type on the client side.
`mergeServer()`	`none`	Merges all map layers in this map type on the server side (default).

`Class: PMapLayer`
Method	Return	Description	Example
`new PMapLayer(mapLayer)`	`PMapLayer`	The constructor. Creates a new `PMapLayer` object with the given map layer. Click here for a list of available layers.	maptype.html
`setLabel(label)`	`none`	Sets the label for this map layer.
`getLabel()`	`String`	Returns the label for this map layer.	layers.html
`setOpacity(opacity)`	`none`	Sets the `opacity` (value between 0 and 1) of this layer. The default opacity is 1.	maptype.html
`getOpacity()`	`Number`	Returns the `opacity` (value between 0 and 1) of this layer.
`on()`	`none`	Turns on the map layer.
`off()`	`none`	Turns off the map layer.	layers.html
`isOn()`	`Boolean`	Returns `true` if this map layer is turned on, `false` otherwise.	layers.html
`mergeClient()`	`none`	Merges this map layer on the client side.	mergeclient.html
`mergeServer()`	`none`	Merges this map layer on the server side (default).
`isMergeClient()`	`Boolean`	Returns `true` if this map layer is set to merge on the client side, `false` (default) otherwise.

`Class: PIndicatorLoader`
Method	Return	Description	Example
`load(ids, callback)`	`none`	A static method that loads the given array of indicator ids and returns an array of `PIndicator` objects via `callback`. The `callback` argument must be a `Function` that accepts an array as its first argument. Click here for a list of available indicators.	thematic2.html

`Class: PIndicator`
Method	Return	Description	Example
`getID()`	`Number`	Returns the distinct id of the indicator. `PIndicator` is usually not instantiated and gets returned by various function calls like `PIndicatorLoader.load()`
`getLabel()`	`String`	Returns the name of the indicator. Displays in the thematic widget.
`getFullLabel()`	`String`	Returns a longer version of the name of the indicator, if exists.
`getDescription()`	`String`	Returns the description for the indicator.
`getSource()`	`String`	Returns the data source of the indicator. Displays in the thematic widget.
`getPeriod()`	`String`	Returns the time period that this indicator is currently refering to. By default, this returns the latest period available.
`setPeriod(period)`	`none`	Sets the time period for this indicator, if available.
`hasPeriod(period)`	`Boolean`	Returns true if this indicator is available for the given time period, false otherwise.
`getPeriods()`	`Array of String`	Returns all time periods that this indicator is available for.
`getPlaceTypes()`	`Array of PPlaceType`	Returns all place types that this indicator is available for.
`getBreaks(numbreaks, placetype, period)`	`String`	Returns a list of comma delimited breaks (unformatted) for the given number of breaks, place type. An optional period can be specified, otherwise the current period will be used.
`setCustomBreaks(breaks, placetype, period)`	`none`	Creates custom breaks for this indicator from a list of comma delimited values for the given place type. An optional period can be specified, otherwise the current period will be used. The number of breaks is deduced from the comma delimited string, e.g. "0,3,6,8,10" would contain 4 breaks (0-3,3-6,6-8,8-10).	custombreaks.html
`restoreBreaks(period, placetype, numbreaks)`	`none`	Restores the default breaks for this indicator. Optional period can be specified to restore only breaks for that period. Additional optional place type can be specified to only restore breaks for that place type (and period). Additional optional number of breaks can be specified to only restore breaks for that particular number of breaks (and place type and period).	custombreaks.html

`Class: PLegend`
Method	Return	Description	Example
`new PLegend(colorRamp, numBreaks)`	`PLegend`	The constructor. Creates a new `PLegend` object. `PLegend` offers control over how indicators are displayed on the map. The `PColorRamp`, and the number of breaks can be specified, otherwise the default green color ramp and 8 breaks will be used. Breaks can only have values of 3 to 8.
`setIndicator(indicator)`	`none`	Sets the given `PIndicator` to the legend. If the legend is attached to a `PMap`, the indicator will show up on the map.
`removeIndicator()`	`none`	Removes the current `PIndicator` from the legend. If the legend is attached to a `PMap`, the indicator will be removed from the map.
`getIndicator()`	`PIndicator`	Returns the current `PIndicator` associated to this legend.
`setColorRamp(colorramp)`	`none`	Sets the `PColorRamp` for this legend, and refreshes the map if attached. Click here for a list of predefined color ramps.	colorramp.html
`getColorRamp()`	`PColorRamp`	Returns the current `PColorRamp` associated to this legend.
`setNumberOfBreaks(breaks)`	`none`	Sets the number of breaks for this legend, and refreshes the map if attached. Valid number of breaks are 3 to 8.	breaks.html
`getNumberOfBreaks()`	`Number`	Returns the current number of breaks associated to this legend.
`getFormattedBreaks()`	`Array of String`	Returns an array representing the breaks formatted with commas, decimals, and the right units.
`getBreaks()`	`String`	Returns a list of comma delimited breaks (unformatted) for the current indicator, place type and period.
`getCurrentPlaceType()`	`PPlaceType`	Returns the place type currently being used to shade the indicator. Uses `PPlaceTypeConfig.PLEGEND` to determine what place type to look for.

`Class: PColor`
Method	Return	Description	Example
`new PColor(color)`	`PColor`	The constructor. Creates a new `PColor` with a string in the form of a hex color code, e.g. "ff0000" for red.	colors.html

`Class: PColorRamp`
Method	Return	Description	Example
`new PColorRamp(name, colors)`	`PColorRamp`	The constructor. Creates a new `PColorRamp` with a name and an array of `PColor` objects.	breakselect.html
`getName()`	`String`	Returns the name of this color ramp.
`getColors()`	`Array of PColor`	Returns an array of `PColor` objects from this color ramp.

`Class: PWidget`
Method	Return	Description	Example
`new PWidget(map, container, id)`	`PWidget`	The constructor. Creates a new `PWidget` with the `PMap` it attaches to, within the HTML container, usually a `div` element. An id can be specified if one of the predefined widgets is to be used. Click here for a list of available widget IDs.	widgets.html
`setLabel(html)`	`none`	Sets the label (title) of the widget with the given HTML string.	widget.html
`setContent(node)`	`none`	Sets the body content of the widget with the given DOM node.
`setContentHtml(html)`	`none`	Sets the body content of the widget with the given HTML string.	widget.html
`maximize()`	`none`	Maximizes the widget (maximized by default).
`minimize()`	`none`	Minimizes the widget.
`isMaximized()`	`Boolean`	Returns `true` if the widget is maximized, `false` otherwise.
`enableDragging()`	`none`	Enables dragging of the widget.	widget.html
`disableDragging()`	`none`	Disables dragging of the widget (disabled by default).
`draggingEnabled()`	`Boolean`	Returns `true` if dragging is enabled, `false` if disabled.
`close()`	`none`	Closes the widget window.

PWidget has properties that are HTML DOM elements. You can modify the CSS style properties of these elements to customize the appearance of a widget. Click here for more information on the HTML DOM style object.

Property	Type	Description	Example
`background`	`Node`	This is the DIV element that represents the container of the widget.	widgetstyle.html
`box`	`Node`	This is the DIV element that represents the main box for the widget.	widgetstyle.html
`heading`	`Node`	This is the DIV element that represents the heading area for the widget. When this area is double clicked, it removes the `body` node (i.e. minimizes the widget). If dragging is enabled, this area is also where the dragging occurs. `SetLabel()` adds a label to this node.	widgetstyle.html
`body`	`Node`	This is the DIV element that represents the body area for the widget. `SetContent()` adds a node and `SetContentHtml()` adds an HTML string to this node.	widgetstyle.html

`Class: PPlaceContainmentWidget`
Method	Return	Description	Example
`new PPlaceContainmentWidget(map, container, placeorder, separator)`	`PPlaceContainmentWidget`	The constructor. Creates a new `PPlaceContainmentWidget` with the `PMap` it attaches to, within the HTML container, usually a `div` element. An array of `PPlaceType` objects can be specified for the order that breadcrumbs should appear, e.g. the default is `STATE`, `COUNTY`, `ZIP`. Click here for a list of place types. An optional separator (between the place names) can be specified as well (HTML supported), the default is " > ".	breadcrumbs.html
`refresh(places)`	`none`	Refreshes the widget with the list of places.	breadcrumbs.html

Event	Argument	Description	Example
`click`	`place`	This event gets triggered when a mouse click happens on any of the place links. The place that gets clicked is passed as an argument to the event handler.