D3 time scale from array index

Question

I am attempting to map an array index to a time range in d3.js as I do not have individual dates for the array - I just know the values are between 1900 and 2000.

var data = [45,678,490...]; // length 820

var x = d3.time.scale().range([0, width]).domain([new Date(1900, 0, 0), new Date(2000, 0, 0)]);

// line function
var line = d3.svg.line()
    .x(function(d,i) { 
    // here map i to date between domain min / max    
        return x(i); 
    })
    .y(function(d) { 
        return y(d); 
    });

Is there a smarter way of doing this than manually calculating a date for each array value? Perhaps calculating the step and incrementing?

I'm not sure what you're trying to do. It looks like you have only numbers in your array, but you're not converting them to dates in your code. Maybe you want 2 scales, one that maps the numbers in your array to a date and a second one that maps that date to coordinates? Of course then you might as well have just a single scale that maps a number to a coordinate. — Lars Kotthoff
– Lars Kotthoff, Commented Jun 4, 2013 at 12:30
I am mapping the array values [45,678,490...] to the y-axis, but my problem is mapping the array index value [0,1,2,3,4...] to a date between 1900 and 2000. — MALK
– MALK, Commented Jun 4, 2013 at 12:40

Adam Pearce · Accepted Answer · 2013-06-04 12:59:27Z

1

Use another scale to map from the index value to date:

var arrayScale = d3.time.scale()
                    .domain([0, data.length])
                    .range([new Date(1900, 0, 0), new Date(2000, 0, 0)]);

answered Jun 4, 2013 at 12:59

Adam Pearce

9,3032 gold badges40 silver badges35 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

D3 time scale from array index

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related