A control that enables users to select a bounds on a map by holding the shift key and dragging on a map. It’s useful for stuff like selecting areas to render in TileMill or areas to download for offline use.
<div id='map-div'></div>
<script>
var mm = com.modestmaps;
var tilejson = {
tilejson: '1.0.0',
scheme: 'tms',
tiles: ['http://a.tiles.mapbox.com/mapbox/1.0.0/blue-marble-topo-bathy-jul/{z}/{x}/{y}.png']
};
var m = new mm.Map('map-div',
new wax.mm.connector(tilejson));
wax.mm.boxselector(m, tilejson, {
callback: function(coords) {
$('#boxselector-text').text(
coords.map(function(c) {
return c.lat + ',' + c.lon;
}).join(' - '));
}
});
m.setCenterZoom(new mm.Location(39, -98), 2);
</script>
<div class='widget'>Selection: <span id='boxselector-text'></span></div>
</div>
var boxselector = wax.mm.boxselector(map, options or callback)
coords, containing the extent of a selection, as represented
by an array with two elements of type com.modestmaps.Location.