anilnairxyz/.about+license.md

## .about+license.md

      
    Raw
  

              .about+license.md
            
          
    This map shows the historical boundaries of the state of Kashmir which is now split between 3 countries (India, Pakistan and China)
Copyright © 2015, Anil Nair - MIT License

  
## .block
license: mit
height: 560

## README.md

      
    Raw
  

              README.md
            
          
    This map is the complete map of J&K and should (hopefully - no guarantees) pass muster.
This map shows the historical boundaries of the state of Kashmir which is now split between 3 countries (India, Pakistan and China)
This map (Mercator) has been generated using the state map of India from Natural Earth while the disputed areas of Jammu and Kashmir have been merged from other maps at the same site.

  
## index.html
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <style>
        svg {background-color: #40444d;}
    </style>
</head>
<body>
    <script src="//d3js.org/d3.v3.min.js"></script>
    <script src="//d3js.org/topojson.v1.min.js"></script>
    <script>

        var width  = 640;
        var height = 560;

        var vis = d3.select("body").append("svg")
            .attr("width", width).attr("height", height)

        d3.json("ne_10m_admin_0_Kashmir_Merged.json", function(json) {
            var subunits = topojson.feature(json, json.objects.ne_10m_admin_0_Kashmir_Merged);
            scale       = 4000;
            offset      = [300, 280];
            center      = [76, 35];
	    console.log(scale)
	    console.log(offset)
	    console.log(center)

            // new projection
            projection  = d3.geo.mercator().center(center)
                            .scale(scale).translate(offset);
            // create the path
            var path = d3.geo.path().projection(projection);

            // add a rectangle to see the bound of the svg
            vis.append("rect").attr('width', width).attr('height', height)
               .style('stroke', 'white').style('fill', 'none');

            vis.selectAll("path").data(subunits.features).enter().append("path")
               .attr("d", path)
               .attr("class", function(d) { return d.id; })
               .style("fill", "#fc9272")
               .style("stroke-width", "1.5")
               .style("stroke", "white")
          });
    </script>
</body>
</html>

## ne_10m_admin_0_Kashmir_Merged.json

      
Display the source blob

    
Display the rendered blob

    
    Raw
  

              ne_10m_admin_0_Kashmir_Merged.json
            
          
      Sorry, something went wrong. Reload?
      Sorry, we cannot display this file.
      Sorry, this file is invalid so it cannot be displayed.
      
          Viewer requires iframe.
      
    
## thumbnail.png

      
    Raw
  

              thumbnail.png
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8">
	<style>
	svg {background-color: #40444d;}
	</style>
	</head>
	<body>
	<script src="//d3js.org/d3.v3.min.js"></script>
	<script src="//d3js.org/topojson.v1.min.js"></script>
	<script>

	var width = 640;
	var height = 560;

	var vis = d3.select("body").append("svg")
	.attr("width", width).attr("height", height)

	d3.json("ne_10m_admin_0_Kashmir_Merged.json", function(json) {
	var subunits = topojson.feature(json, json.objects.ne_10m_admin_0_Kashmir_Merged);
	scale = 4000;
	offset = [300, 280];
	center = [76, 35];
	console.log(scale)
	console.log(offset)
	console.log(center)

	// new projection
	projection = d3.geo.mercator().center(center)
	.scale(scale).translate(offset);
	// create the path
	var path = d3.geo.path().projection(projection);

	// add a rectangle to see the bound of the svg
	vis.append("rect").attr('width', width).attr('height', height)
	.style('stroke', 'white').style('fill', 'none');

	vis.selectAll("path").data(subunits.features).enter().append("path")
	.attr("d", path)
	.attr("class", function(d) { return d.id; })
	.style("fill", "#fc9272")
	.style("stroke-width", "1.5")
	.style("stroke", "white")
	});
	</script>
	</body>
	</html>