D3 Examples - Bar Chart v4

xxxxxxxxxx
 
<!DOCTYPE html>
<head>
  <meta charset="utf-8">
  <script src="https://d3js.org/d3.v4.min.js"></script>
  <style>
    body { margin:0;position:fixed;top:0;right:0;bottom:0;left:0; }
  </style>
</head>
​
<body>
  <script>
    // Feel free to change or delete any of the code you see in this editor!
    var h      = 500,
        w      = 400,
        margin = {top:20,left:30,right:30,bottom:20},
        height = h - (margin.top + margin.bottom),
        width  = w - (margin.left + margin.right);
        
    var svg = d3.select("body").append("svg")
      .attr("width", w)
      .attr("height", h);
    
    var xScale = d3.scaleBand().rangeRound([0,width]);
    
    var xAxis = d3.axisBottom(xScale);
    
​
    d3.json('data.json',function(error,data){
      
      xScale.domain(data.map(function(d){return d.name;}));
            
      svg.append('g')
      .attr('transform','translate('+[margin.left,height + margin.top]+')')
      .call(xAxis)
     
      
    });
 
  </script>
</body>
​
    