Skip to content

Instantly share code, notes, and snippets.

@hotzeplotz
Last active October 13, 2015 12:23
Show Gist options
  • Select an option

  • Save hotzeplotz/b4a6ef1a652bcd2fabbc to your computer and use it in GitHub Desktop.

Select an option

Save hotzeplotz/b4a6ef1a652bcd2fabbc to your computer and use it in GitHub Desktop.
Future of large cities - Population
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>Future of large cities - Population</title>
<meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' />
<script src='https://api.tiles.mapbox.com/mapbox.js/v2.1.4/mapbox.js'></script>
<link href='https://api.tiles.mapbox.com/mapbox.js/v2.1.4/mapbox.css' rel='stylesheet' />
<link href='//blocks.lsecities.net/hotzeplotz/raw/8f64b9a8bd98042a712c/style.css' rel='stylesheet' />
</head>
<body>
<!-- This example requires d3 for AJAX and the brush,
though you can bring your own library. -->
<script src='https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.6/d3.min.js' charset="utf-8"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id='map' class='dark'></div>
<div class="metro-tooltip"></div>
<div id='brush' class='ui-brush'></div>
<script src='//blocks.lsecities.net/hotzeplotz/raw/8f64b9a8bd98042a712c/make-map.js'></script>
<script src='//blocks.lsecities.net/hotzeplotz/raw/8f64b9a8bd98042a712c/leaflet-hash.js'></script>
<script>
make_map({
data_file: '//blocks.lsecities.net/hotzeplotz/raw/8f64b9a8bd98042a712c/largecities.json',
map_id: 'map',
initial_position: [0,0],
initial_zoom: 2,
brush: false,
time_var: 'pop_2012',
growth_var: 'pop_growth',
cumulative_var: 'pop_2012',
time_var_label: 'Population (2012)',
time_var_unit: 'million',
time_var_extent: [0, 7091983.422463],
time_var_value_function: function(val) {
return Math.round((val / 1000) * 100) / 100;
},
growth_var_label: 'Average annual population growth forecast 2012&mdash;2030',
growth_var_unit: '%'
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment