Skip to content

Instantly share code, notes, and snippets.

@EfratVil
Last active July 22, 2016 14:59
Show Gist options
  • Save EfratVil/dd86d40174de7d594f71 to your computer and use it in GitHub Desktop.
Save EfratVil/dd86d40174de7d594f71 to your computer and use it in GitHub Desktop.
NVD3 Line with View Finder Chart - data from CSV file
date a_avg b_avg c_avg d_avg e_avg
05 03 2014 37.5 26.25 53.75 50 55
06 03 2014 12.5 15 18.75 25 32.5
07 03 2014 26.25 22.5 37.5 31.25 40
08 03 2014 11.25 10 8.75 10 17.5
09 03 2014 60 41.25 47.5 27.5 60
10 03 2014 77.5 65 83.75 63.75 97.5
11 03 2014 65 42.5 68.75 57.5 75
12 03 2014 61.25 33.75 50 53.75 80
13 03 2014 13.75 10 11.25 7.5 15
14 03 2014 35 33.75 37.5 33.75 57.5
15 03 2014 62.5 33.75 67.5 57.5 70
16 03 2014 62.5 41.25 66.25 60 67.5
17 03 2014 27.5 18.75 33.75 32.5 37.5
18 03 2014 46.25 36.25 48.75 42.5 62.5
19 03 2014 62.5 45 72.5 63.75 85
20 03 2014 55 41.25 68.75 56.25 87.5
21 03 2014 38.75 35 50 41.25 65
22 03 2014 41.25 27.5 51.25 46.25 52.5
23 03 2014 37.5 28.75 50 41.25 45
24 03 2014 43.75 31.25 55 48.75 55
25 03 2014 22.5 22.5 27.5 23.75 32.5
26 03 2014 82.5 51.25 92.5 82.5 92.5
27 03 2014 40 30 43.75 43.75 55
28 03 2014 25 30 33.75 35 42.5
29 03 2014 37.5 33.75 41.25 40 42.5
30 03 2014 41.25 31.25 42.5 40 62.5
31 03 2014 45 30 47.5 41.25 57.5
01 04 2014 25 11.25 11.25 20 30
02 04 2014 58.75 46.25 66.25 60 80
03 04 2014 57.5 56.25 73.75 63.75 80
04 04 2014 61.25 48.75 67.5 67.5 80
05 04 2014 37.5 26.25 37.5 42.5 50
06 04 2014 23.75 21.25 22.5 21.25 32.5
07 04 2014 53.75 43.75 60 51.25 65
08 04 2014 70 48.75 76.25 80 90
09 04 2014 41.25 33.75 47.5 43.75 50
10 04 2014 47.5 40 56.25 52.5 60
11 04 2014 42.5 30 57.5 56.25 57.5
12 04 2014 26.25 28.75 37.5 32.5 40
13 04 2014 67.5 47.5 72.5 67.5 77.5
14 04 2014 81.25 50 85 78.75 85
15 04 2014 23.75 27.5 22.5 18.75 32.5
16 04 2014 31.25 27.5 26.25 31.25 42.5
17 04 2014 42.5 47.5 47.5 46.25 62.5
18 04 2014 45 37.5 48.75 55 60
19 04 2014 42.5 55 36.25 42.5 65
20 04 2014 62.5 60 67.5 70 67.5
21 04 2014 48.75 50 58.75 56.25 62.5
22 04 2014 56.25 47.5 55 53.75 57.5
23 04 2014 40 33.75 38.75 35 42.5
24 04 2014 53.75 57.5 47.5 38.75 42.5
25 04 2014 85 70 81.25 76.25 62.5
26 04 2014 80 70 70 71.25 67.5
27 04 2014 35 37.5 40 40 50
28 04 2014 41.25 45 36.25 31.25 50
29 04 2014 82.5 71.25 67.5 72.5 77.5
30 04 2014 47.5 47.5 46.25 43.75 42.5
01 05 2014 62.5 61.25 53.75 50 56.25
02 05 2014 78.75 63.75 60 70 62.5
03 05 2014 53.75 48.75 50 33.75 56.25
04 05 2014 78.75 72.5 63.75 48.75 71.25
05 05 2014 100 90 76.25 85 97.5
06 05 2014 90 73.75 71.25 77.5 78.75
07 05 2014 147.5 110 116.25 136.25 135
08 05 2014 88.75 77.5 83.75 61.25 75
09 05 2014 37.5 31.25 25 38.75 38.75
10 05 2014 38.75 36.25 37.5 42.5 46.25
11 05 2014 66.25 55 51.25 48.75 66.25
12 05 2014 57.5 40 50 41.25 58.75
13 05 2014 71.25 47.5 63.75 46.25 52.5
14 05 2014 68.75 60 76.25 72.5 63.75
15 05 2014 55 48.75 60 51.25 43.75
16 05 2014 56.25 48.75 57.5 43.75 48.75
17 05 2014 97.5 85 102.5 86.25 81.25
18 05 2014 58.75 48.75 70 55 51.25
19 05 2014 63.75 56.25 75 51.25 51.25
20 05 2014 70 60 77.5 65 63.75
21 05 2014 38.75 46.25 47.5 40 40
22 05 2014 80 73.75 85 67.5 66.25
23 05 2014 55 50 60 43.75 46.25
24 05 2014 50 45 57.5 48.75 51.25
25 05 2014 65 60 61.25 48.75 50
26 05 2014 61.25 46.25 60 58.75 61.25
27 05 2014 36.25 35 33.75 32.5 48.75
28 05 2014 88.75 72.5 72.5 77.5 63.75
29 05 2014 82.5 58.75 75 78.75 88.75
30 05 2014 46.25 28.75 48.75 43.75 51.25
31 05 2014 73.75 75 70 71.25 63.75
01 06 2014 83.75 57.5 72.5 72.5 76.25
02 06 2014 81.25 51.25 63.75 65 66.25
03 06 2014 91.25 60 75 72.5 82.5
04 06 2014 46.25 40 47.5 36.25 35
05 06 2014 92.5 76.25 91.25 82.5 70
06 06 2014 66.25 43.75 53.75 43.75 61.25
07 06 2014 68.75 47.5 55 60 68.75
08 06 2014 60 48.75 47.5 43.75 62.5
09 06 2014 80 55 62.5 61.25 81.25
10 06 2014 80 58.75 63.75 70 77.5
11 06 2014 77.5 50 52.5 65 83.75
12 06 2014 71.25 42.5 53.75 66.25 72.5
13 06 2014 80 43.75 56.25 66.25 77.5
14 06 2014 61.25 42.5 48.75 53.75 66.25
15 06 2014 56.25 37.5 40 53.75 61.25
16 06 2014 56.25 46.25 45 52.5 72.5
17 06 2014 48.75 45 36.25 46.25 57.5
18 06 2014 78.75 61.25 67.5 93.75 92.5
19 06 2014 60 43.75 58.75 58.75 71.25
20 06 2014 72.5 57.5 57.5 53.75 60
21 06 2014 85 51.25 65 72.5 82.5
22 06 2014 102.5 63.75 77.5 85 92.5
23 06 2014 105 73.75 85 91.25 97.5
24 06 2014 123.75 82.5 93.75 98.75 107.5
25 06 2014 106.25 66.25 82.5 101.25 115
26 06 2014 55 40 35 42.5 56.25
27 06 2014 81.25 68.75 57.5 66.25 78.75
28 06 2014 71.25 61.25 50 51.25 55
29 06 2014 52.5 48.75 30 42.5 40
30 06 2014 53.75 55 31.25 51.25 43.75
01 07 2014 95 73.75 63.75 73.75 80
02 07 2014 56.25 47.5 40 46.25 48.75
03 07 2014 80 73.75 56.25 62.5 66.25
04 07 2014 50 58.75 41.25 45 52.5
05 07 2014 75 73.75 56.25 61.25 68.75
06 07 2014 120 93.75 95 83.75 95
07 07 2014 77.5 66.25 60 60 65
08 07 2014 97.5 80 73.75 76.25 86.25
09 07 2014 43.75 40 53.75 40 48.75
10 07 2014 25 32.5 27.5 32.5 31.25
11 07 2014 25 22.5 20 27.5 41.25
12 07 2014 30 25 23.75 33.75 33.75
13 07 2014 62.5 43.75 50 46.25 57.5
14 07 2014 81.25 58.75 67.5 72.5 70
15 07 2014 88.75 68.75 71.25 80 76.25
16 07 2014 107.5 81.25 97.5 103.75 95
17 07 2014 100 68.75 88.75 86.25 97.5
18 07 2014 91.25 62.5 72.5 82.5 81.25
19 07 2014 91.25 62.5 70 76.25 77.5
20 07 2014 92.5 58.75 68.75 77.5 78.75
21 07 2014 82.5 67.5 65 77.5 76.25
22 07 2014 101.25 76.25 83.75 87.5 95
23 07 2014 81.25 57.5 62.5 73.75 80
24 07 2014 96.25 73.75 75 88.75 97.5
25 07 2014 95 67.5 68.75 88.75 87.5
26 07 2014 103.75 78.75 82.5 95 97.5
27 07 2014 110 80 86.25 97.5 102.5
28 07 2014 112.5 87.5 88.75 97.5 100
29 07 2014 126.25 97.5 87.5 116.25 110
30 07 2014 63.75 46.25 42.5 65 58.75
31 07 2014 121.25 98.75 92.5 113.75 115
01 08 2014 83.75 63.75 62.5 76.25 80
02 08 2014 57.5 45 45 55 53.75
03 08 2014 91.25 66.25 66.25 78.75 86.25
04 08 2014 103.75 78.75 75 93.75 92.5
05 08 2014 93.75 76.25 67.5 85 88.75
06 08 2014 107.5 83.75 73.75 86.25 93.75
07 08 2014 108.75 83.75 78.75 97.5 101.25
08 08 2014 120 103.75 96.25 110 112.5
09 08 2014 100 78.75 76.25 87.5 93.75
10 08 2014 120 96.25 88.75 105 108.75
11 08 2014 112.5 85 81.25 93.75 100
12 08 2014 82.5 67.5 66.25 75 72.5
13 08 2014 68.75 61.25 50 63.75 67.5
14 08 2014 62.5 48.75 40 58.75 53.75
15 08 2014 125 105 97.5 115 117.5
16 08 2014 128.75 105 97.5 116.25 115
17 08 2014 133.75 103.75 103.75 121.25 118.75
18 08 2014 93.75 77.5 68.75 85 83.75
19 08 2014 125 98.75 101.25 113.75 112.5
20 08 2014 122.5 100 88.75 100 101.25
21 08 2014 137.5 112.5 113.75 123.75 131.25
22 08 2014 118.75 96.25 92.5 111.25 108.75
23 08 2014 147.5 116.25 113.75 123.75 127.5
24 08 2014 65 51.25 50 56.25 61.25
25 08 2014 60 41.25 42.5 55 48.75
26 08 2014 52.5 40 42.5 48.75 52.5
27 08 2014 65 52.5 42.5 50 61.25
28 08 2014 76.25 60 56.25 70 76.25
29 08 2014 116.25 87.5 91.25 87.5 101.25
30 08 2014 130 110 103.75 101.25 116.25
31 08 2014 128.75 98.75 97.5 98.75 111.25
01 09 2014 101.25 83.75 77.5 75 90
02 09 2014 117.5 93.75 92.5 92.5 103.75
03 09 2014 128.75 108.75 98.75 101.25 115
04 09 2014 130 96.25 106.25 103.75 112.5
05 09 2014 57.5 50 43.75 53.75 55
06 09 2014 111.25 95 87.5 96.25 108.75
07 09 2014 122.5 100 98.75 100 112.5
08 09 2014 130 105 101.25 106.25 117.5
09 09 2014 142.5 118.75 110 116.25 122.5
10 09 2014 138.75 107.5 116.25 141.25 127.5
11 09 2014 136.25 120 105 106.25 120
12 09 2014 132.5 108.75 103.75 100 115
13 09 2014 130 107.5 103.75 100 116.25
14 09 2014 96.25 83.75 80 75 93.75
15 09 2014 93.33333333 80 78.75 75 88.75
16 09 2014 146.6666667 122.5 113.75 110 130
17 09 2014 81.66666667 62.5 62.5 72.5 78.75
18 09 2014 93.33333333 71.25 75 73.75 83.75
19 09 2014 120 97.5 100 100 111.25
20 09 2014 105 85 87.5 86.25 93.75
21 09 2014 111.6666667 87.5 96.25 83.75 95
22 09 2014 86.66666667 70 75 71.25 78.75
23 09 2014 116.6666667 98.75 92.5 87.5 101.25
24 09 2014 135 108.75 106.25 107.5 115
25 09 2014 70 52.5 58.75 60 58.75
26 09 2014 110 86.25 90 91.25 95
27 09 2014 141.6666667 112.5 106.25 107.5 116.25
28 09 2014 58.33333333 48.75 52.5 51.25 55
29 09 2014 78.33333333 60 58.75 61.25 66.25
30 09 2014 98.33333333 75 110 73.33333333 83.75
01 10 2014 115 91.25 88.75 100 123.75
02 10 2014 83.33333333 76.25 66.25 75 73.75
03 10 2014 141.6666667 125 106.25 113.75 116.25
04 10 2014 140 121.25 121.25 111.25 115
05 10 2014 110 95 98.75 95 90
06 10 2014 125 101.25 111.25 102.5 101.25
07 10 2014 90 51.25 101.25 61.25 68.75
08 10 2014 60 43.75 66.25 40 53.75
09 10 2014 106.6666667 98.75 92.5 87.5 95
10 10 2014 86.66666667 77.5 91.25 83.75 82.5
11 10 2014 141.6666667 127.5 118.75 130 126.25
12 10 2014 116.6666667 105 102.5 102.5 98.75
13 10 2014 158.3333333 132.5 136.25 123.75 125
14 10 2014 108.3333333 92.5 95 96.25 90
15 10 2014 83.33333333 77.5 81.25 91.25 81.25
16 10 2014 121.6666667 116.25 100 108.75 108.75
17 10 2014 135 112.5 112.5 108.75 106.25
18 10 2014 90 73.75 81.25 80 73.75
19 10 2014 150 125 138.75 135 128.75
20 10 2014 150 132.5 135 140 132.5
21 10 2014 106.6666667 85 111.25 90 98.75
22 10 2014 80 65 113.75 63.75 71.25
23 10 2014 63.33333333 50 70 55 50
24 10 2014 101.6666667 83.75 125 92.5 91.25
25 10 2014 88.33333333 70 121.25 77.5 76.25
26 10 2014 65 35 101.25 43.75 52.5
27 10 2014 71.66666667 41.25 110 66.25 52.5
28 10 2014 133.3333333 103.75 140 115 111.25
29 10 2014 133.3333333 111.25 132.5 116.25 112.5
30 10 2014 116.6666667 95 107.5 97.5 90
31 10 2014 86.66666667 77.5 93.75 90 87.5
01 11 2014 141.6666667 122.5 133.75 133.75 128.75
02 11 2014 168.3333333 146.25 160 152.5 143.75
03 11 2014 121.6666667 106.25 110 115 107.5
04 11 2014 161.6666667 136.25 151.25 148.75 141.25
05 11 2014 73.33333333 65 62.5 52.5 52.5
06 11 2014 101.6666667 75 120 70 77.5
07 11 2014 35 10 88.75 17.5 25
08 11 2014 18.33333333 16.25 50 16.25 25
09 11 2014 11.66666667 11.25 5 11.25 22.5
<html>
<head>
<title></title>
<meta charset="utf-8">
<script src="http://d3js.org/d3.v3.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/nvd3/1.1.15-beta/nv.d3.js"></script>
<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/nvd3/1.1.15-beta/nv.d3.css">
<style>
#chart svg {
height: 400px;
}
</style>
</head>
<body>
<div id="chart">
<svg></svg>
</div>
<script>
d3.csv("Daily_data.csv",function(err,data){
//get each col of the data, except date col
var dataToPlot = Object.keys(data[0]).filter(function(k){return k!="date"})
.map(function(k){
return {"key":k,"values":data.map(function(d){
return {
"x":d3.time.format("%d %m %Y").parse(d.date),
"y":+d[k]
}
})}
})
nv.addGraph(function () {
var chart = nv.models.lineWithFocusChart();
chart.xAxis.tickFormat(function (d) { return d3.time.format('%x')(new Date(d)) });
chart.x2Axis.tickFormat(function (d) { return d3.time.format('%x')(new Date(d)) });
chart.yAxis
.tickFormat(d3.format(',.2f'));
chart.y2Axis
.tickFormat(d3.format(',.2f'));
d3.select('#chart svg')
.datum(dataToPlot)
.transition().duration(500)
.call(chart)
;
nv.utils.windowResize(chart.update);
return chart;
});
})
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment