animation of balancing a heap into a max-heap

A jenky start to my visualzing how an array can be made into a heap then a max-heap.

xxxxxxxxxx
 
<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" href="./style.css" />
      <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/4.7.4/d3.js"></script>
​
​
  </head>
  <body>
    <div id="heap">
    </div>
  <script src="heaper.js"></script>
​
  </body>
​
</html>
​
    

https://cdnjs.cloudflare.com/ajax/libs/d3/4.7.4/d3.js