Make this regression graph work with time series data
New here? Learn about Bountify and follow @bountify to get notified of new bounties! x

I want to make this example work with time series data:

My x-values are epoch dates that are one day apart from the next one (representing each day of the past month, for example). My y-values are integers from 0 to 10.

Please modify the example to produce sample data within that range, and to draw a meaningful regression line.


Here is some sample data. Included are the yhat values if you simply use those x and y values. Notice how the yhat values (which what get plotted on the graph) are all very similar, which results in a near-horizontal regression line, no matter the values. That's the problem.

The reason the yhat values are similar is probably because the x-values here are all so close to the mean value. Look at the original example at x values are from 0 to 1000. In this data set, x values are from 1480536255 to 1481313855.

So I think you'd have to change how the yhat values are calculated, or normalize the x-values before calculating them.

[{:x=>1480536255, :y=>7, :yhat=>7.098095616083853}, {:x=>1480622655, :y=>8, :yhat=>7.098509840067301}, {:x=>1480709055, :y=>8, :yhat=>7.098924064050747}, {:x=>1480795455, :y=>6, :yhat=>7.099338288034195}, {:x=>1480881855, :y=>8, :yhat=>7.099752512017643}, {:x=>1480968255, :y=>6, :yhat=>7.100166736001091}, {:x=>1481054655, :y=>6, :yhat=>7.100580959984537}, {:x=>1481141055, :y=>8, :yhat=>7.100995183967985}, {:x=>1481227455, :y=>7, :yhat=>7.101409407951433}, {:x=>1481313855, :y=>7, :yhat=>7.101823631934881}] 
Could you give an example of your x axis values?
thelostt 10 months ago
I've edited the question with some sample data. Let me know if you have any other questions.
bevan 10 months ago
awarded to kerncy

Crowdsource coding tasks.

1 Solution

Winning solution


I've made a test with your values based on the d3js code you proposed, the only difference is that the values are not randomly generated, but your ones, and recentered the x values arount the "zero" (line 139 to 154). Just copy/paste the following code into an HTML file and it should do the job.

Thanks, that works great!
bevan 10 months ago