alx-developer · April 5, 2020 20:52
diff --git a/README.md b/README.md
diff --git a/index.html b/index.html
 <!DOCTYPE html>
 <meta charset="utf-8">
 <title>Mexico Topojson</title>
 <body>
 <script src="http://d3js.org/d3.v3.min.js"></script>
 <script src="http://d3js.org/topojson.v0.min.js"></script>
 <script>
 var x = d3.scale.linear()
    .domain([0, width])
    .range([0, width]);

 var y = d3.scale.linear()
    .domain([0, height])
    .range([height, 0]);

 var width = 960,
    height = 500;

 var projection = d3.geo.mercator()
    .scale(1200)
    .center([-102.34034978813841, 24.012062015793]);

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

 var g = svg.append("g");

 d3.json("mx_tj.json", function(error, mx) {
  svg.selectAll("path")
    .data(topojson.object(mx, mx.objects.municipalities).geometries)
    .enter().append("path")
    .attr("d", d3.geo.path().projection(projection))
    .attr("fill", "transparent")
    .style("stroke", "#333")
    .style("stroke-width", ".2px")
    .attr("class", "muns");
  
  g.selectAll("path")
    .data(topojson.object(mx, mx.objects.states).geometries)
    .enter().append("path")
    .attr("d", d3.geo.path().projection(projection))
    .attr("fill", "transparent")
    .style("stroke", "#333");

 });

 </script>
diff --git a/mx_tj.json b/mx_tj.json
	<!DOCTYPE html>
	<meta charset="utf-8">
	<title>Mexico Topojson</title>
	<body>
	<script src="http://d3js.org/d3.v3.min.js"></script>
	<script src="http://d3js.org/topojson.v0.min.js"></script>
	<script>
	var x = d3.scale.linear()
	.domain([0, width])
	.range([0, width]);

	var y = d3.scale.linear()
	.domain([0, height])
	.range([height, 0]);

	var width = 960,
	height = 500;

	var projection = d3.geo.mercator()
	.scale(1200)
	.center([-102.34034978813841, 24.012062015793]);

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

	var g = svg.append("g");

	d3.json("mx_tj.json", function(error, mx) {
	svg.selectAll("path")
	.data(topojson.object(mx, mx.objects.municipalities).geometries)
	.enter().append("path")
	.attr("d", d3.geo.path().projection(projection))
	.attr("fill", "transparent")
	.style("stroke", "#333")
	.style("stroke-width", ".2px")
	.attr("class", "muns");

	g.selectAll("path")
	.data(topojson.object(mx, mx.objects.states).geometries)
	.enter().append("path")
	.attr("d", d3.geo.path().projection(projection))
	.attr("fill", "transparent")
	.style("stroke", "#333");

	});

	</script>