D3 Examples - mike bostock - bar chart pt. 1

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; }
    .chart div {
      font: 10px sans-serif;
      background-color: steelblue;
      text-align: right;
      padding: 3px;
      margin: 1px;
      color: white;
    }
  </style>
</head>
​
<body>
  <div class='chart'></div>
  <script>
    let data = [4, 8, 15, 16, 23, 42];
​
    let xScale = d3.scaleLinear()
                   .domain([0, d3.max(data)])
                   .range([0, 420]);
​
    d3.select('.chart')
      .selectAll('div')
        .data(data)
      .enter().append('div')
      .style('width', d => xScale(d) + 'px')
      .text(d => d);
  </script>
</body>
​
    