Rectangles Practice

<!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>
 <button class="button">Ascend</button>
 <button class="button">Descend</button>

<body>
  <script>
      
    var margin = {top: 20, right: 40, bottom: 20, left: 10};

var width = 500 - margin.left - margin.right,
        height = 400 - margin.top - margin.bottom;

// Scales
    var x = d3.scaleLinear()
        .range([0, width])
        .domain([4, 15]);
    
    var x = d3.scaleLinear()
    				.range([0,width]);  
    
    
	d3.csv('alpha_frequencies.csv',function(error,dataset){
    dataset.forEach(function(d) {
      d.frequency = +d.frequency; //the plus sign updates to float
    })
    
    function sortData(sortHow) {
      if (sortHow == "Ascend"){
        dataset.sort(function(a,b){
        return a.frequency - b.frequency;
      })} 
      else 
      {
         dataset.sort(function(a,b){
         return b.frequency - a.frequency;
      })
    }
    }

d3.selectAll(".button")
      .on("click", function() {
        var sortHow = d3.select(this).text();
        sortData(sortHow);
      });

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