HarryStevens · April 25, 2018 20:38
diff --git a/.block b/.block
 license: gpl-3.0
diff --git a/README.md b/README.md
diff --git a/index.html b/index.html
 <!DOCTYPE html>
 <html>
  <head>
    <style>
      body {
        margin: 0;
      }
      #map {
        width: 100%;
        height: 100vh;
      }
    </style>
  </head>
  <body>
    <div id="map"></div>

    <!-- D3 modules for d3-request and d3-queue -->
    <script src="https://d3js.org/d3-collection.v1.min.js"></script>
    <script src="https://d3js.org/d3-dispatch.v1.min.js"></script>
    <script src="https://d3js.org/d3-dsv.v1.min.js"></script>
    <script src="https://d3js.org/d3-request.v1.min.js"></script>
    <script src="https://d3js.org/d3-queue.v3.min.js"></script>

    <!-- jeezy -->
    <script src="https://unpkg.com/[email protected]/lib/jeezy.js"></script>

    <script src="https://unpkg.com/[email protected]/dist/swiftmap.min.js"></script>
    <script>

      // Create the color scheme.
      var scheme = swiftmap.schemeCategorical()
        .from(d => d.state)
        .to({
          "Uttar Pradesh": "steelblue"
        });

      // Load the data.
      d3.queue()
        .defer(d3.json, "india_state.json")
        .defer(d3.csv, "india_state_population.csv")
        .await(ready);

      function ready(error, geo, tab){

        // Initialize and draw the map.
        var map = swiftmap.map("#map")
          .layerPolygons(geo, d => d.properties.ST_NM)
            .draw();

        // Add data to the scheme...
        scheme.data(tab, d => d.state)
        
        // ...and fill the layer.
        map.layers[0].polygons
          .transition().duration(500)
            .style("fill", scheme)

        // Get a list of unique states whose population is greater than 10 million.
        var states = tab.filter(d => +d.population > 1e7).map(d => d.state);

        // Every second, change the scheme and refill the layer.
        setInterval(function(){

          // Update the object passed to scheme.to().
          var obj = {};
          obj[jz.arr.random(states)] = "steelblue";

          // Refill the layer, with a half-second transition between fills.
          map.layers[0].polygons
            .transition().duration(500)
              .style("fill", scheme.to(obj));

        }, 1000);

        // Make it resizable.
        window.onresize = () => map.resize();

      }

    </script>
  </body>
 </html>
diff --git a/india_state.json b/india_state.json
diff --git a/india_state_population.csv b/india_state_population.csv
diff --git a/preview.png b/preview.png
diff --git a/thumbnail.png b/thumbnail.png
	<!DOCTYPE html>
	<html>
	<head>
	<style>
	body {
	margin: 0;
	}
	#map {
	width: 100%;
	height: 100vh;
	}
	</style>
	</head>
	<body>
	<div id="map"></div>

	<!-- D3 modules for d3-request and d3-queue -->
	<script src="https://d3js.org/d3-collection.v1.min.js"></script>
	<script src="https://d3js.org/d3-dispatch.v1.min.js"></script>
	<script src="https://d3js.org/d3-dsv.v1.min.js"></script>
	<script src="https://d3js.org/d3-request.v1.min.js"></script>
	<script src="https://d3js.org/d3-queue.v3.min.js"></script>

	<!-- jeezy -->
	<script src="https://unpkg.com/[email protected]/lib/jeezy.js"></script>

	<script src="https://unpkg.com/[email protected]/dist/swiftmap.min.js"></script>
	<script>

	// Create the color scheme.
	var scheme = swiftmap.schemeCategorical()
	.from(d => d.state)
	.to({
	"Uttar Pradesh": "steelblue"
	});

	// Load the data.
	d3.queue()
	.defer(d3.json, "india_state.json")
	.defer(d3.csv, "india_state_population.csv")
	.await(ready);

	function ready(error, geo, tab){

	// Initialize and draw the map.
	var map = swiftmap.map("#map")
	.layerPolygons(geo, d => d.properties.ST_NM)
	.draw();

	// Add data to the scheme...
	scheme.data(tab, d => d.state)

	// ...and fill the layer.
	map.layers[0].polygons
	.transition().duration(500)
	.style("fill", scheme)

	// Get a list of unique states whose population is greater than 10 million.
	var states = tab.filter(d => +d.population > 1e7).map(d => d.state);

	// Every second, change the scheme and refill the layer.
	setInterval(function(){

	// Update the object passed to scheme.to().
	var obj = {};
	obj[jz.arr.random(states)] = "steelblue";

	// Refill the layer, with a half-second transition between fills.
	map.layers[0].polygons
	.transition().duration(500)
	.style("fill", scheme.to(obj));

	}, 1000);

	// Make it resizable.
	window.onresize = () => map.resize();

	}

	</script>
	</body>
	</html>
state	population	growth_2001_2011	population_rural	population_urban	area	sex_ratio
Uttar Pradesh	207281477	20.10%	155111022	44470455	240928	908
Maharashtra	112372972	16.00%	61545441	50827531	307713	946
Bihar	103804637	25.10%	92075028	11729609	94163	916
West Bengal	91347736	13.90%	62213676	29134060	88752	947
Madhya Pradesh	72597565	20.30%	52537899	20059666	308245	931
Tamil Nadu	72138958	15.60%	37189229	34949729	130058	995
Rajasthan	68621012	21.40%	51540236	17080776	342239	926
Karnataka	61130704	15.70%	37552529	23578175	191791	968
Gujarat	60383628	19.20%	34670817	25712811	196024	918
Andhra Pradesh	49386799	11.10%	34776389	14610410	162968	993
Odisha	41947358	14.00%	34951234	6996124	155707	978
Telangana	35286757	17.87%	21585313	13608665	114840	988
Kerala	33387677	4.90%	17445506	15932171	38863	1,084
Jharkhand	32966238	22.30%	25036946	7929292	79714	947
Assam	31169272	16.90%	26780526	4388756	78438	954
Punjab	27704236	13.70%	17316800	10387436	50362	893
Chhattisgarh	25540196	22.60%	19603658	5936538	135191	991
Haryana	25353081	19.90%	16531493	8821588	44212	877
Jammu & Kashmir	12548926	23.70%	9134820	3414106	222236	883
Uttarakhand	10116752	19.20%	7025583	3091169	53483	963
Himachal Pradesh	6864602	12.80%	6167805	688704	55673	974
Tripura	3671032	14.70%	2710051	960981	10486	961
Meghalaya	2964007	27.80%	2368971	595036	22429	986
Manipur	2721756	18.70%	1899624	822132	22327	987
Nagaland	1980602	-0.50%	1406861	573741	16579	931
Goa	1457723	8.20%	551414	906309	3702	968
Arunanchal Pradesh	1382611	25.90%	1069165	313446	83743	920
Mizoram	1091014	22.80%	529037	561997	21081	975
Sikkim	607688	12.40%	455962	151726	7096	889
NCT of Delhi	18980000	21%	419319	16333916	1484	866
Puducherry	1244464	27.70%	394341	850123	479	1,038
Chandigarh	1055450	17.10%	29004	1025682	114	818
Andaman & Nicobar Island	379944	6.70%	244411	135533	8249	878
Dadara & Nagar Haveli	342853	55.50%	183024	159829	491	775
Daman & Diu	242911	53.50%	60331	182580	112	618
Lakshadweep	64429	6.20%	14121	50308	32	946