## 2018-10-18 Horror #D3 #Migration v3 -> v5

```javascript
import d3 from 'src/external/d3.v5.js';

var line = d3.radialLine()
    .curve(d3.curveBundle.beta(0.85))
    .radius(function(d) { return d.y; })
    .angle(function(d) { return d.x / 180 * Math.PI; });

// data copied from d3 v3, where data has the format x, dx 
var d = [{
      label: "AgglomerativeCluster", 
      attributes: {size: 3938},
      depth: 3,
      dx: 0.028559933214452667,
      dx0: 0.028559933214452667,
      dy: 0.2,
      id: 3,
      value: 1,
      x: 0,
      x0: 0,
      y: 0.6000000000000001,
  },
  {
     label: "Transitioner",
      attributes: {size: 19975},
      depth: 2,
      dx: 0.028559933214452667,
      dx0: 0.028559933214452667,
      dy: 0.2,
      id: 34,
      value: 1,
      x: 0.7711181967902223,
      x0: 0.7711181967902223,
      y: 0.4,
  }
]
d.source = d[0]
d.source = d[1]

debugger; line(d) // M0,-0.6000000000000001L0.005383258065049871,-0.3999637740253548


// new data with format x0 and x1

var dv4 = [{
    data: {
      label: "AgglomerativeCluster", id: 3},
    depth: 3,
    dx0: undefined,
    height: 0,
    value: 1,
    x0: undefined,
    x1: 0.024933275028490427,
    y0: 0.6,
    y1: 0.8,
  },
  {
    data: {
      label: "cluster", children: Array(4), id: 2},
    depth: 2,
    dx0: undefined,
    height: 1,
    value: 5,
    x0: undefined,
    x1: 0.12466637514245213,
    y0: 0.4,
    y1: 0.6
  } 
]
dv4.source = dv4[0]
dv4.target = dv4[1]
    


var lineV4 = d3.radialLine()
    .curve(d3.curveBundle.beta(0.85))
    .radius(function(d) { return d.y0 || 0; })
    .angle(function(d) { return (d.x0 || 0) / 180 * Math.PI; });
    
debugger; lineV4(dv4)
    ```