CODEWITHSUNDEEP
angulard3.js
user2994834
user2994834

Reputation: 395

getting error for d3 Js

I am creating bar chart using D3 Js within Angular 2 application.

I am using V4.4 of D3 and getting below error at below line,

.domain(d3.range(n))

 var n = 20, // number of samples
        m = 4; // number of series

    var data = d3.range(m).map(function () { return d3.range(n).map(Math.random); });

    var margin = { top: 20, right: 30, bottom: 30, left: 40 },
        width = 960 - margin.left - margin.right,
        height = 500 - margin.top - margin.bottom;

    var y = d3.scaleLinear()
        .domain([0, 1])
        .range([height, 0]);

    var x0 = d3.scaleBand()
        .domain(d3.range(n))
        .range([0, width], .2);

    var x1 = d3.scaleBand()
        .domain(d3.range(m))
        .range([0, x0.range()]);

    var z = d3.scaleOrdinal(d3.schemeCategory10);

Error,

error TS2345: Argument of type 'number[]' is not assignable to parameter of type 'string[]'.
Type 'number' is not assignable to type 'string'.

Upvotes: 0

Views: 397

Answers (1)

Mark
Mark

Reputation: 108512

The error is telling you that d3.scaleBand().domain wants an array of strings as an argument, you are giving it an array of numbers. Just coerce your numbers to strings like:

 d3.scaleBand()
   .domain(d3.range(N).map((d) => d+""))
   .range([0, width], .2);

Upvotes: 1

Related Questions