Skip to content

Component API calls

petewarden edited this page Sep 14, 2010 · 25 revisions

These are the functions you can call on an OpenHeatMap object from Javascript within a page. The object itself should be retrieved by calling getOpenHeatMap() from the supplied openheatmap.js script.

addInlay(leftX, topY, rightX, bottomY, topLat, leftLon, bottomLat, rightLon)

Creates an inlay that renders an area of the map over the top of the main view. This is typically used to display places like Alaska or Hawaii on a map of the US, but is also useful for showing details like a zoomed-in view of a city center on a regional map. One pitfall to beware of is that the first four values are coordinates in screen pixels for the area where the inlay should appear in the current view, so you should only call this directly after setting the initial viewing area, before the user has had a chance to zoom and pan.

getLatLonViewingArea()
returns { topLat: , leftLon: , bottomLat: , rightLon: }

Returns the latitude and longitude at the corners of the current viewing area. If the user hasn’t panned or zoomed, these should be identical to the values previously set with setLatLonViewingArea, otherwise they’ll reflect the user’s changes.

getPixelsPerDegreeLatitude()
returns Number

The result of the function is the vertical scale factor of the current view. For example, if it’s 4.0, then you’d need a map (4*180) or 720 pixels high to represent the full range of latitudes from Antarctica to the North Pole. Because latitudes increase as you head north, and the component uses a vertical axis where zero is at the top and larger values represent lower pixels, this is usually a negative value.

getValueForWayId(wayId)
returns Number | null

If the map is displaying data specifying values for individual areas, then this function will return the value associated with a particular area. The input ID is typically received from an event callback telling you which ways the user is mousing over. If the map is animated then the value will be from the current frame being displayed. If no value is set, then null will be returned.

getValuePointsNearLatLon(latitude, longitude, radius=0)
returns [{value: }, …]

If the map is displaying data as a density map of individual points, this will return an array containing the values of points within the radius of the specified point. If no points are nearby, it will return an empty array.

getWayForWayId(wayId)
returns {id: , nds: [], tags: {} }

Given the identifier of a way, this will return the full information for that way. This closely follows the OpenStreetMap XML format, with the nds array specifying nodes within the main list, and tags containing the key/value pairs holding information about the way. This can be useful if you want to pull common tags like ‘name’ for a node that the user is mousing over.

getWaysContainingLatLon

loadValuesFromCSVString

loadValuesFromFile

loadWaysFromFile

removeAllInlays

removeAllWays

setColorGradient

setEventHandler

setGradientValueRange

setLatLonViewingArea

setOceanColor

setPixelsPerDegreeLatitude

setSetting

setSize

setWayDefault

translateMapByScreenPixels

zoomMapByFactorAroundPoint