Quicksort through colours

<!doctype html>

<html>
  <style>
    line {
      stroke-width: 1.5px;
    }

body {
      background-color: black;
    }
  </style>
  <body>
  <script src="https://d3js.org/d3.v3.min.js" charset="utf-8"></script>
  <script>
    // heavily influenced by https://bl.ocks.org/mbostock/1582075
    var width = 960,
        height = 500;

var svg = d3.select('body').append('svg')
        .attr('width', width)
        .attr('height', height);

var centreX = width/2,
        centreY = height/2;

var length = 200;

var shuffle = function (array) {
      var m = array.length, t, i;

// While there remain elements to shuffle…
      while (m) {

// Pick a remaining element…
        i = Math.floor(Math.random() * m--);

// And swap it with the current element.
        t = array[m];
        array[m] = array[i];
        array[i] = t;
      }

return array;
    }

var draw = function () {
      var line = svg.selectAll('line')
          .data(hueAndAngles);

line.enter().append('line');

line.attr('stroke', function (d) { return 'hsl(' + d.hue + ',50%,50%)';})
          .attr('x1', centreX)
          .attr('y1', centreY)
          .attr('x2', function (d) { return centreX + Math.cos(d.angle * 0.01745) * length; })
          .attr('y2', function (d) { return centreY + Math.sin(d.angle * 0.01745) * length; });
    };

var quicksort = function (array) {
      var actions = [];

function partition(left, right, pivot) {
        var v = array[pivot];
        swap(pivot, --right);
        for (var i = left; i < right; ++i) if (array[i] <= v) swap(i, left++);
        swap(left, right);
        return left;
      }

function swap(i, j) {
        var t = array[i];
        array[i] = array[j];
        array[j] = t;
        actions.push({type: "swap", i: i, j: j});
      }

recurse(0, array.length);
      return actions;
    }

var sort = function () {
      reset();
      draw();

actions = quicksort(hueAndAngles.map(function(d) {
        return d.hue;
      })).reverse();

function step() {
        var intervalId = setInterval(function () {
          var action = actions.pop();
          if (action) switch (action.type) {
            case "partition": {
              step();
              break;
            }
            case "swap": {
              var t = hueAndAngles[action.i].hue;
              hueAndAngles[action.i].hue = hueAndAngles[action.j].hue;
              hueAndAngles[action.j].hue = t;

draw();
              break;
            }
          }
        }, 100);
      };

step();
    }

sort()
  </script>
</html>

Modified http://d3js.org/d3.v3.min.js to a secure url

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