Rakeysh Rakeysh - 5 months ago 114
AngularJS Question

Uncaught TypeError: Cannot read property 'arc' of undefined in AngularJS and D3

I am new to AngularJS and D3. I am building a dashboard using these technologies.
I have included the d3.min.js file in the index file and trying to draw a cirle with it.Here is the code:

enter code here
var svg = d3.select("body")
.append("svg")
.attr("width", 200)
.attr("height", 200)
.append("g")
.attr("transform", "translate(100,100)");

var arc = d3.svg.arc()
.innerRadius(50)
.outerRadius(70)
.startAngle(0)
.endAngle(2 * Math.PI);

svg.append("path")
.attr("class", "arc")
.attr("d", arc);


but I keep on getting a console message : Uncaught TypeError: Cannot read property 'arc'

I also tried to draw a barchart but this time the error reported was:
Uncaught TypeError: Cannot read property 'linear'

Please help

Answer

In D3 v4.x the syntax has changed from:

d3.svg.arc();

To:

d3.arc();

Here's a link to the changes in the new API: https://github.com/d3/d3/blob/master/CHANGES.md