HarryStevens · April 25, 2018 20:47
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>

    <!-- 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>

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

    <script>

      // Create the map.
      var map = swiftmap.map("#map");

      // Create a sequential color scheme with custom breaks.
      var scheme = swiftmap.schemeSequential()
        .from(d => +d.growth_2001_2011.replace("%", ""))
        .to(["#ef8a62", "#d1e5f0", "#67a9cf", "#2166ac"])
        .breaks([-.5, 0, 20, 25, 55]);

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

      function ready(error, geo, tab){

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

        // Add a polygons layer to your map and draw it.
        map
          .layerPolygons(geo, d => d.properties.ST_NM)
            .draw();

        // Fill the layer based on your color scheme.
        map.layers[0].polygons
            .style("fill", scheme);

        // Resize the map when the window changes.
        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>

	<!-- 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>

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

	<script>

	// Create the map.
	var map = swiftmap.map("#map");

	// Create a sequential color scheme with custom breaks.
	var scheme = swiftmap.schemeSequential()
	.from(d => +d.growth_2001_2011.replace("%", ""))
	.to(["#ef8a62", "#d1e5f0", "#67a9cf", "#2166ac"])
	.breaks([-.5, 0, 20, 25, 55]);

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

	function ready(error, geo, tab){

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

	// Add a polygons layer to your map and draw it.
	map
	.layerPolygons(geo, d => d.properties.ST_NM)
	.draw();

	// Fill the layer based on your color scheme.
	map.layers[0].polygons
	.style("fill", scheme);

	// Resize the map when the window changes.
	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