tw2.polymaps

TODO

PolyMap
  • data_url
    • Url to pull a geoJSON layer from
  • layer_lifetime
    • Time in miliseconds until layers are removed. 0 means 'never'.
  • properties_callback
    • Javascript callback. Takes a layer and returns a layer
  • cloudmade_tileset
    • Cloudmade tileset. One of 'pale-dawn' or 'midnight-commander'.
  • center_latlon
    • A dict specifying the center of the map. The dict should be of the following form:: {'lat': -85.05112, 'lon' : -120.0} This is typically used in conjunction with the `zoom` parameter.
  • center_range
    • A list of dicts specifying the south-west and north-east corners of *constraints* on the range. The value should be of the following form:: [{'lat': -85.05112, 'lon': -120.0}, {'lat': +85.05212, 'lon': +120.0}]
  • zoom
    • A nonnegative number indicating the `zoom`
  • zoom_range
    • A two-element list constrainting `zoom`
  • arrow
    • Constructs an arrow control with default settings. The arrow control provides key listeners for the arrow keys for panning, and the plus and minus keys for zooming. The arrow control allows multiple keys to be pressed simultaneously; for example, the pressing the left and down arrows simultaneously will cause the map to pan diagonally. (bool)
  • compass
    • Constructs a compass control with default settings. The compass control provides a user interface widget for panning and zooming as an alternative to mouse and keyboard controls. The compass also provides shift-drag support for zooming to a given extent. The compass is not part of the standard set of interaction controls (see interact). The compass control is rendered using SVG elements and must be styled through CSS. An example stylesheet is available in the Git repository. (bool)
  • dblclick
    • Constructs a double-click control with default settings. This control allows the user to double-click to zoom in on the given point, and shift-double-click to zoom out. The double-click snaps to the nearest integral zoom level, providing optimal display of tiles. (bool)
  • drag
    • Constructs a drag control with default settings. The drag control allows the user to pan the map with the mouse by clicking and dragging. (bool)
  • grid
    • Constructs a grid control with default settings. The grid control provides reference lines of constant longitude and latitude that are overlaid on the map. The resolution of the reference lines increases with zoom level. The grid is not part of the standard set of interaction controls (see po.interact). The grid control is rendered using SVG elements and must be styled through CSS. An example stylesheet is available in the Git repository. (bool)
  • hash
    • Constructs a hash control with default settings. The hash control provides two-way coordination of the window's location hash with the map center and zoom. This allows map URLs to be conveniently copy-and-pasted, preserving the view. To further cut down on URL length, the precision of latitude and longitude is based on the zoom level. The hash control also listens for the window hashchange event, such that links on the page or editing via the address bar can update the map center and zoom. (bool)
  • interact
    • Constructs the standard interaction controls with default settings. This includes the drag, wheel, dblclick and arrow controls. This control set does not allow customization; to customize controls, add them individually instead. (bool)
  • wheel
    • Constructs a mouse wheel control with default settings. This control uses the mousewheel event to provide smooth zooming around the mouse cursor, and is designed to support both discrete devices (such as the traditional mouse wheel) and continuous devices (such as trackpads). (bool)
class DemoPolyMap(PolyMap):
    data_url = '/polymap_demo/'
    interact = True
    # You should get your own one of these at http://cloudmade.com/register
    cloudmade_api_key = "1a1b06b230af4efdbb989ea99e9841af"
    # To style the map tiles
    cloudmade_tileset = 'midnight-commander'
    # Both specify the css_class AND include your own custom css file that
    # specifies what it looks like.
    css_class = 'sample-tw2-polymaps-container-1'
    def prepare(self):
        super(DemoPolyMap, self).prepare()
        self.resources.append(custom_css_1)
    properties_callback = """function (_layer) {
        _layer.on("load", org.polymaps.stylist()
        .title(function(d) { return "Lon/lat:  " + d.properties.ATTR }));
        return _layer
    }"""
    @classmethod
    @geojsonify
    def request(cls, req):
        import geojson
        n = 40
        lat, lon = 37.775, -122.4183333
        mod = lambda x: x + random.random() * 0.05 - 0.025
        json = geojson.FeatureCollection(
            features=[
                geojson.Feature(
                    geometry=geojson.Point([mod(lon), mod(lat)]),
                    properties={'ATTR': "%s, %s" % (mod(lon), mod(lat))},
                ) for i in range(n)
            ]
        )
        return json
<%namespace name="tw" module="tw2.core.mako_util"/>
<div>
<div ${tw.attrs(attrs=w.attrs)}>
<div id="${w.attrs['id']}:target"></div>
</div>
<script type="text/javascript">
	var map = setupPolymap(${w.j('attrs')}, ${w.j('cloudmade_api_key')},
	                       ${w.j('_tileset_id')},
						   ${w.j('center_latlon')}, ${w.j('center_range')},
						   ${w.j('zoom')}, ${w.j('zoom_range')});
	map = setupPolymapControls(map,
	            ${w.j('arrow')}, ${w.j('compass')}, ${w.j('dblclick')},
				${w.j('drag')}, ${w.j('grid')}, ${w.j('hash')},
				${w.j('interact')}, ${w.j('wheel')}
	);
	% if hasattr(w, 'interval'):
	map = setupPolymapPollingData(map,
				${w.j('data_url')},
				${w.j('interval')},
				${w.j('layer_lifetime')},
				${w.properties_callback}
	);
	% else:
	map = setupPolymapData(map,
				${w.j('data_url')},
				${w.j('layer_lifetime')},
				${w.properties_callback}
	);
	% endif
</script>
</div>

PollingPolyMap
  • data_url
    • Url to pull a geoJSON layer from
  • layer_lifetime
    • Time in miliseconds until layers are removed. 0 means 'never'.
  • properties_callback
    • Javascript callback. Takes a layer and returns a layer
  • cloudmade_tileset
    • Cloudmade tileset. One of 'pale-dawn' or 'midnight-commander'.
  • center_latlon
    • A dict specifying the center of the map. The dict should be of the following form:: {'lat': -85.05112, 'lon' : -120.0} This is typically used in conjunction with the `zoom` parameter.
  • center_range
    • A list of dicts specifying the south-west and north-east corners of *constraints* on the range. The value should be of the following form:: [{'lat': -85.05112, 'lon': -120.0}, {'lat': +85.05212, 'lon': +120.0}]
  • zoom
    • A nonnegative number indicating the `zoom`
  • zoom_range
    • A two-element list constrainting `zoom`
  • arrow
    • Constructs an arrow control with default settings. The arrow control provides key listeners for the arrow keys for panning, and the plus and minus keys for zooming. The arrow control allows multiple keys to be pressed simultaneously; for example, the pressing the left and down arrows simultaneously will cause the map to pan diagonally. (bool)
  • compass
    • Constructs a compass control with default settings. The compass control provides a user interface widget for panning and zooming as an alternative to mouse and keyboard controls. The compass also provides shift-drag support for zooming to a given extent. The compass is not part of the standard set of interaction controls (see interact). The compass control is rendered using SVG elements and must be styled through CSS. An example stylesheet is available in the Git repository. (bool)
  • dblclick
    • Constructs a double-click control with default settings. This control allows the user to double-click to zoom in on the given point, and shift-double-click to zoom out. The double-click snaps to the nearest integral zoom level, providing optimal display of tiles. (bool)
  • drag
    • Constructs a drag control with default settings. The drag control allows the user to pan the map with the mouse by clicking and dragging. (bool)
  • grid
    • Constructs a grid control with default settings. The grid control provides reference lines of constant longitude and latitude that are overlaid on the map. The resolution of the reference lines increases with zoom level. The grid is not part of the standard set of interaction controls (see po.interact). The grid control is rendered using SVG elements and must be styled through CSS. An example stylesheet is available in the Git repository. (bool)
  • hash
    • Constructs a hash control with default settings. The hash control provides two-way coordination of the window's location hash with the map center and zoom. This allows map URLs to be conveniently copy-and-pasted, preserving the view. To further cut down on URL length, the precision of latitude and longitude is based on the zoom level. The hash control also listens for the window hashchange event, such that links on the page or editing via the address bar can update the map center and zoom. (bool)
  • interact
    • Constructs the standard interaction controls with default settings. This includes the drag, wheel, dblclick and arrow controls. This control set does not allow customization; to customize controls, add them individually instead. (bool)
  • wheel
    • Constructs a mouse wheel control with default settings. This control uses the mousewheel event to provide smooth zooming around the mouse cursor, and is designed to support both discrete devices (such as the traditional mouse wheel) and continuous devices (such as trackpads). (bool)
  • interval
    • Polling interval in milliseconds
class DemoPollingPolyMap(PollingPolyMap):
    data_url = '/polymap_polling_demo/'
    interval = 1000
    layer_lifetime = 1500
    # You should get your own one of these at http://cloudmade.com/register
    cloudmade_api_key = "1a1b06b230af4efdbb989ea99e9841af"
    # To style the map tiles
    cloudmade_tileset = 'pale-dawn'
    # Both specify the css_class AND include your own custom css file that
    # specifies what it looks like.
    css_class = 'sample-tw2-polymaps-container-2'
    def prepare(self):
        super(DemoPollingPolyMap, self).prepare()
        self.resources.append(custom_css_2)
    @classmethod
    @geojsonify
    def request(cls, req):
        import geojson
        n = 40
        lat, lon = 37.775, -122.4183333
        mod = lambda x: x + random.random() * 0.05 - 0.025
        json = geojson.FeatureCollection(
            features=[
                geojson.Feature(
                    geometry=geojson.Point([mod(lon), mod(lat)])
                ) for i in range(n)
            ]
        )
        return json
<%namespace name="tw" module="tw2.core.mako_util"/>
<div>
<div ${tw.attrs(attrs=w.attrs)}>
<div id="${w.attrs['id']}:target"></div>
</div>
<script type="text/javascript">
	var map = setupPolymap(${w.j('attrs')}, ${w.j('cloudmade_api_key')},
	                       ${w.j('_tileset_id')},
						   ${w.j('center_latlon')}, ${w.j('center_range')},
						   ${w.j('zoom')}, ${w.j('zoom_range')});
	map = setupPolymapControls(map,
	            ${w.j('arrow')}, ${w.j('compass')}, ${w.j('dblclick')},
				${w.j('drag')}, ${w.j('grid')}, ${w.j('hash')},
				${w.j('interact')}, ${w.j('wheel')}
	);
	% if hasattr(w, 'interval'):
	map = setupPolymapPollingData(map,
				${w.j('data_url')},
				${w.j('interval')},
				${w.j('layer_lifetime')},
				${w.properties_callback}
	);
	% else:
	map = setupPolymapData(map,
				${w.j('data_url')},
				${w.j('layer_lifetime')},
				${w.properties_callback}
	);
	% endif
</script>
</div>