Adapting d3.geo.tile to show OpenStreetMap vector tiles. See also the static example.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<head> | |
<title>Leaflet example | CartoDB.js</title> | |
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> | |
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/> | |
<link rel="shortcut icon" href="http://cartodb.com/assets/favicon.ico" /> | |
<style> | |
html, body, #map { | |
height: 100%; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
(function() { | |
d3.force_labels = function force_labels() { | |
var labels = d3.layout.force(); | |
// Update the position of the anchor based on the center of bounding box | |
function updateAnchor() { | |
if (!labels.selection) return; | |
labels.selection.each(function(d) { | |
var bbox = this.getBBox(), | |
x = bbox.x + bbox.width / 2, |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
label | ccode | region | pop | qu | de | ar | aq | xcoord | ycoord | arid | capacity | delivery | |
---|---|---|---|---|---|---|---|---|---|---|---|---|---|
Buenaventura | COL | 6 | 248 | 3 | 3 | 3 | 1 | -77.025 | 3.862 | 6.233 | 3.32 | 2193 | |
Sebha | LBY | 1 | 54 | 1 | 2 | 1 | 1 | 14.462 | 27.004 | 0.004 | 0.36 | 6319 | |
Dongola | SDN | 1 | 167 | 4 | 4 | 4 | 1 | 30.461 | 19.184 | 0.004 | 6.96 | 404 | |
Merowe | SDN | 1 | 177 | 2 | 4 | 3 | 1 | 31.848 | 18.563 | 0.009 | 2.24 | 404 | |
Nouadhibou | MRT | 1 | 75 | 3 | 4 | 3 | 1 | -17.035 | 20.844 | 0.01 | 2.58 | 689 | |
AsSuways | EGY | 1 | 304 | 1 | 3 | 2 | 1 | 32.477 | 29.847 | 0.013 | 0.77 | 2158 | |
al_Asir_mir_Ramadan | EGY | 1 | 78 | 2 | 3 | 2 | 1 | 31.758 | 30.275 | 0.015 | 1.94 | 1515 | |
Berber | SDN | 1 | 144 | 4 | 4 | 4 | 1 | 33.996 | 18.029 | 0.018 | 14.11 | 486 | |
Tamenghest | DZA | 1 | 69 | 1 | 3 | 2 | 1 | 5.521 | 22.788 | 0.024 | 0.96 | 3261 |
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<head> | |
<title>Leaflet w/ geojson Polygons & addStyle()</title> | |
<script type="text/javascript" src="http://leaflet.cloudmade.com/dist/leaflet.js"></script> | |
<link rel="stylesheet" href="http://leaflet.cloudmade.com/dist/leaflet.css" /> | |
<!--[if lte IE 8]><link rel="stylesheet" href="http://leaflet.cloudmade.com/dist/leaflet.ie.css" /><![endif]--> | |
<script type="text/javascript" src="http://maps.stamen.com/js/tile.stamen.js?v1.2.3"></script> | |
<script type="text/javascript" src="./other.geojson" ></script> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<html xmlns="http://www.w3.org/1999/xhtml"> | |
<head> | |
<title>Interpolating Geodata</title> | |
<meta charset="utf-8" /> | |
</head> | |
<style> | |
html,body { | |
height: 100%; | |
width: 100%; | |
margin: 0; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<head> | |
<meta charset=utf-8 /> | |
<title>Mapbox GL JS Examples</title> | |
<meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' /> | |
<script src='https://api.tiles.mapbox.com/mapbox-gl-js/v0.2.0/mapbox-gl.js'></script> | |
<style> | |
body { margin:0; padding:0; } | |
#map { position:absolute; top:0; bottom:0; width:100%; } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<meta charset="utf-8"> | |
<title>OMG Particles!</title> | |
<script src="http://mbostock.github.com/d3/d3.v2.min.js?2.9.1"></script> | |
<style> | |
body { | |
background: #222; | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<html xmlns="http://www.w3.org/1999/xhtml"> | |
<head> | |
<title>d3.carto.map - globe mode</title> | |
<meta charset="utf-8" /> | |
<link type="text/css" rel="stylesheet" href="https://raw.githubusercontent.com/emeeks/d3-carto-map/master/d3map.css" /> | |
<link type="text/css" rel="stylesheet" href="https://raw.githubusercontent.com/emeeks/d3-carto-map/master/examples/example.css" /> | |
</head> | |
<style> | |
html,body { | |
height: 100%; |