Old school D3 from simpler times

All examples By author By category About

jorgeehernandez

Full window Github gist

Tarea 4 Visual Analytics

Built with blockbuilder.org

<!DOCTYPE html>
<meta charset="utf-8">

<body>
  <div id="chart"></div>
</body>
<script src="//d3js.org/d3.v3.min.js"></script>

<script>
  
  var data =[ { 
	'EPIScore': 80.47,	'10-YearPercentChange': 1.89, 'EnvironmentalHealth': 9283,
	'EcosystemVitality': 72.23,	'EH-HealthImpacts': 100, 'EH-AirQuality': 78.5,	
	'EH-WaterandSanitation': 100, 'EV-WaterResources': 95.18, 'EV-Agriculture': 65.31,
	'EV-Forests': 31.35,'EV-Fisheries': 13.4,'EV-BiodiversityandHabitat': 100,	
	'EV-ClimateandEnergy': 62.77, 'ChildMortality': 100,	'HouseholdAirQuality': 95,
	'AirPollution-AverageExposuretoPM2.5':	82.24, 
	'AirPollution-AveragePM2.5Exceedance': 58.27,
  'AccesstoSanitation': 100, 		'AccesstoDrinkingWater':	100, 	
  'WastewaterTreatment':	95.18,
	'AgriculturalSubsidies': 38.62,	
  'PesticideRegulation': 92,'ChangeinForestCover':31.35,
	'FishStocks': 8.33, 'CoastalShelfFishingPressure':	18.46, 
	'TerrestrialProtectedAreas': 100, 'TerrestrialProtectedAreas2':	100, 
	'MarineProtectedAreas': 100, 'TrendinCarbonIntensity':65.24, 
	'ChangeofinCarbonIntensity': 27.82, 'TrendinCO2EmissionsperKwH':58.26,
	'AccesstoElectricity': 100}];
  
  var width = 400;
  var height = 400;
  
	var bubble = d3.layout.pack().sort(null).size([960,960]).padding(1.5);
	bubble.nodes(data);
  
  var svg = d3.select("#chart")
            .append("svg")
            .attr("width",960)
            .attr("height", 960)
            .attr("class","bubble");
  
  var node = svg.selectAll(".node")
              .data(bubble.nodes(data)
              .filter(function(d){ return !d.children;}))
              .enter()
              .append("g")
              .attr("class","node")
              .attr("transform", function(d) { return "translate(" + d.x + "," + d.y + ")"; });

</script>

https://d3js.org/d3.v3.min.js