piwodlaiwo · March 9, 2018 18:15
diff --git a/.block b/.block
 license: mit
diff --git a/README.md b/README.md
diff --git a/index.html b/index.html
 <!DOCTYPE html>
 <style>

 .states :hover {
  fill: red;
 }

 .state-borders {
  fill: none;
  stroke: #fff;
  stroke-width: 0.5px;
  stroke-linejoin: round;
  stroke-linecap: round;
  pointer-events: none;
 }

 </style>
 <svg width="1000" height="500"></svg>
 <script src="https://unpkg.com/d3@4"></script>
 <script src="https://unpkg.com/topojson-client@3"></script>
 <script>

 var svg = d3.select("svg");

 var path = d3.geoPath();

 d3.json("https://d3js.org/us-10m.v1.json", function(error, us) {
  if (error) throw error;

  var neighbors = topojson.neighbors(us.objects.states.geometries);
  var areas = topojson.feature(us, us.objects.states).features;
  
  //loop by neighbors to remove Alaska and Hawaii (as they dont have neighbors)
  neighbors.forEach(function(n,i) {
    //console.log(Object.keys(n).length);
    if(Object.keys(n).length==0){
      areas.splice(i,1)
    }
  });
  
  svg.append("g")
      .attr("class", "states")
    .selectAll("path")
    .data(areas)
    .enter().append("path")
      .attr("d", path);

  svg.append("path")
      .attr("class", "state-borders")
      .attr("d", path(topojson.mesh(us, us.objects.states, function(a, b) { return a !== b; })));
 });

 </script>
	<!DOCTYPE html>
	<style>

	.states :hover {
	fill: red;
	}

	.state-borders {
	fill: none;
	stroke: #fff;
	stroke-width: 0.5px;
	stroke-linejoin: round;
	stroke-linecap: round;
	pointer-events: none;
	}

	</style>
	<svg width="1000" height="500"></svg>
	<script src="https://unpkg.com/d3@4"></script>
	<script src="https://unpkg.com/topojson-client@3"></script>
	<script>

	var svg = d3.select("svg");

	var path = d3.geoPath();

	d3.json("https://d3js.org/us-10m.v1.json", function(error, us) {
	if (error) throw error;

	var neighbors = topojson.neighbors(us.objects.states.geometries);
	var areas = topojson.feature(us, us.objects.states).features;

	//loop by neighbors to remove Alaska and Hawaii (as they dont have neighbors)
	neighbors.forEach(function(n,i) {
	//console.log(Object.keys(n).length);
	if(Object.keys(n).length==0){
	areas.splice(i,1)
	}
	});

	svg.append("g")
	.attr("class", "states")
	.selectAll("path")
	.data(areas)
	.enter().append("path")
	.attr("d", path);

	svg.append("path")
	.attr("class", "state-borders")
	.attr("d", path(topojson.mesh(us, us.objects.states, function(a, b) { return a !== b; })));
	});

	</script>