Skip to content

Instantly share code, notes, and snippets.

View tristen's full-sized avatar

Tristen Brown tristen

View GitHub Profile
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>Wax Interactivity</title>
</head>
<body>
<style>
#map {
width: 100%;
@tristen
tristen / app.js
Last active April 12, 2019 21:42
Any zoom level
var initMap = function() {
var template = 'http://{S}tile.openstreetmap.org/{Z}/{X}/{Y}.png';
var subdomains = ['', 'a.', 'b.', 'c.'];
var provider = new MM.TemplatedLayer(template, subdomains);
var map = new MM.Map('map', provider, null, [
new MM.MouseWheelHandler(null, true)
]);
map.setCenterZoom(new MM.Location(37.811530, -122.2666097), 9);
@tristen
tristen / README.md
Last active June 29, 2019 04:45
Overlay Popup

##Overlay popup

The key file in this example is follower-canvas which applies the styling and draws the popup using canvas on the map. There is additional fallback support for IE < 9 by using Vector Markup Language, or vml.

Contributors

@tristen
tristen / app.js
Last active September 6, 2019 09:31
Basic Controls
var map;
var initMap = function() {
var template = 'http://{S}tile.openstreetmap.org/{Z}/{X}/{Y}.png';
var subdomains = ['', 'a.', 'b.', 'c.'];
var provider = new MM.TemplatedLayer(template, subdomains);
map = new MM.Map('map', provider, null, [
new MM.MouseWheelHandler(null, true)
]);
@tristen
tristen / README.md
Last active October 30, 2019 07:13
Cab Spotting
@tristen
tristen / README.md
Last active October 4, 2015 11:17
Chaining
@tristen
tristen / README.md
Last active October 4, 2015 11:18
Enforce Limits

##Enforce Limits

Sometimes you want to limit a users ability to pan around to just a particular region. In Modest Maps you can specify limits by setting locationCoordinate to the map object.

Contributors

@tristen
tristen / app.js
Last active October 4, 2015 15:28
Toggle on and off a layer
var baseMap = 'mapbox.world-bright'
var layers = [
baseMap
];
var loadMap = function(layers) {
var url = 'http://api.tiles.mapbox.com/v3/' + layers + '.jsonp';
wax.tilejson(url, function(tilejson) {
var map = new MM.Map('map', new wax.mm.connector(tilejson));
map.setCenterZoom({ lat: 39, lon: -98 }, 4);
@tristen
tristen / README.md
Last active June 15, 2016 18:30
Two Maps

##Two Maps

Experiment in synching two maps together.

Contributors

@tristen
tristen / README.md
Last active February 23, 2019 19:51
Spotlight

##Spotlight

Create a spotlight effect using canvas over specified co-ordinates.

Contributors