D3 Examples - d3 legend test

xxxxxxxxxx
 
<!DOCTYPE html>
<head>
  <meta charset="utf-8">
  <script src="https://d3js.org/d3.v4.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/d3-legend/2.21.0/d3-legend.min.js"></script>
  <style>
    body { margin:0;position:fixed;top:0;right:0;bottom:0;left:0; }
  </style>
</head>
​
<body>
  <script>
    var svg = d3.select("body").append("svg")
      .attr("width", 85)
      .attr("height", 110);
    
    var linearSize = d3.scaleLinear().domain([74, 11]).range([12.5, 4]);
    
    svg.append('g')
        .attr('class', 'legendSize')
        .attr('transform', 'translate(20, 0)');
     
    var legendSize = d3.legendSize()
      .scale(linearSize)
        .cells(4)
      .shape('circle')
      .shapePadding(10)
      .labelOffset(5)
        .labelFormat('')
      .orient('vertical');
​
    svg.select(".legendSize")
      .call(legendSize);
​
  </script>
</body>
​
    