Skip to content

Instantly share code, notes, and snippets.

View mapsense-examples's full-sized avatar

mapsense-examples

2 followers · 0 following
View GitHub Profile
@mapsense-examples
mapsense-examples / index.html
Created August 19, 2015 18:23
Visualizing NYC Taxi Flow
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content='initial-scale=1,maximum-scale=1,user-scalable=no' />
<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
<script src="http://d3js.org/topojson.v1.min.js" charset="utf-8"></script>
<script src="https://developer.mapsense.co/mapsense.js" charset="utf-8"></script>
<link type="text/css" href="https://developer.mapsense.co/mapsense.css" rel="stylesheet"/>
@mapsense-examples
mapsense-examples / bounds.js
Last active August 29, 2015 14:27
Drag & drop geojson to map
// Hat tip Mike Bostock: https://github.com/mbostock/polymaps/blob/master/examples/bounds/bounds.js
function bounds(features) {
var i = -1,
n = features.length,
geometry,
bounds = [{lon: Infinity, lat: Infinity}, {lon: -Infinity, lat: -Infinity}];
while (++i < n) {
//geometry = features[i].data.geometry;
geometry = features[i].geometry;
@mapsense-examples
mapsense-examples / index.html
Created August 12, 2015 22:41
zoom custom
<!doctype html>
<html>
<head>
<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
<script src="http://d3js.org/topojson.v1.min.js" charset="utf-8"></script>
<script src="https://developer.mapsense.co/mapsense.js" charset="utf-8"></script>
<link type="text/css" href="https://developer.mapsense.co/mapsense.css" rel="stylesheet"/>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
<style>
/* Sets the map to be full screen with no margin */
@mapsense-examples
mapsense-examples / index.html
Created August 12, 2015 22:41
zoom compass
<!doctype html>
<html>
<head>
<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
<script src="http://d3js.org/topojson.v1.min.js" charset="utf-8"></script>
<script src="https://developer.mapsense.co/mapsense.js" charset="utf-8"></script>
<link type="text/css" href="https://developer.mapsense.co/mapsense.css" rel="stylesheet"/>
<style>
/* Sets the map to be full screen with no margin */
body, html, #myMap{
@mapsense-examples
mapsense-examples / arc.js
Last active August 29, 2015 14:26
inner + outer svg filters
'use strict';
var D2R = Math.PI / 180;
var R2D = 180 / Math.PI;
var Coord = function(lon,lat) {
this.lon = lon;
this.lat = lat;
this.x = D2R * lon;
this.y = D2R * lat;
@mapsense-examples
mapsense-examples / index.html
Last active August 29, 2015 14:26
point buffers
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content='initial-scale=1,maximum-scale=1,user-scalable=no' />
<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
<script src="http://d3js.org/topojson.v1.min.js" charset="utf-8"></script>
<script src="https://developer.mapsense.co/mapsense.js" charset="utf-8"></script>
<!--
@mapsense-examples
mapsense-examples / index.html
Last active August 29, 2015 14:26
image fills
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content='initial-scale=1,maximum-scale=1,user-scalable=no' />
<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
<script src="http://d3js.org/topojson.v1.min.js" charset="utf-8"></script>
<script src="https://developer.mapsense.co/mapsense.js" charset="utf-8"></script>
@mapsense-examples
mapsense-examples / index.html
Last active August 29, 2015 14:26
simple query
<!doctype html>
<html>
<head>
<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
<script src="http://d3js.org/topojson.v1.min.js" charset="utf-8"></script>
<script src="https://developer.mapsense.co/mapsense.js" charset="utf-8"></script>
<link type="text/css" href="https://developer.mapsense.co/mapsense.css" rel="stylesheet"/>
<style>
/* Sets the map to be full screen with no margin */
body, html, #myMap{
@mapsense-examples
mapsense-examples / index.html
Last active August 29, 2015 14:26
Bounded Voronoi
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content='initial-scale=1,maximum-scale=1,user-scalable=no' />
<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
<script src="http://d3js.org/topojson.v1.min.js" charset="utf-8"></script>
<script src="https://developer.mapsense.co/mapsense.js" charset="utf-8"></script>
<link type="text/css" href="https://developer.mapsense.co/mapsense.css" rel="stylesheet"/>
@mapsense-examples
mapsense-examples / index.html
Last active August 29, 2015 14:26
Display roads in paris from a topojson file using D3
<!DOCTYPE html>
<meta charset="utf-8">
<style>
#map {
width: 960px;
height: 500px;
}
.roads {
stroke: black;
fill: none;