|
1
|
|
|
var filename_status = '/api/current', |
|
2
|
|
|
filename_summary = '/api/summary', |
|
3
|
|
|
WIDTH = 300, |
|
4
|
|
|
HEIGHT = 200, |
|
5
|
|
|
MARGINS = {top: 10, left: 30, right: 20, bottom: 20}, |
|
6
|
|
|
sugarloaf = {}; |
|
7
|
|
|
|
|
8
|
|
|
sugarloaf.difficulty_order = { |
|
9
|
|
|
'beginner': 1, |
|
10
|
|
|
'intermediate': 2, |
|
11
|
|
|
'black': 3, |
|
12
|
|
|
'double-black': 4, |
|
13
|
|
|
'terrain-park': 5 |
|
14
|
|
|
} |
|
15
|
|
|
sugarloaf.parseDate = d3.time.format('%Y-%m-%dT%H:%M:%S'); |
|
|
|
|
|
|
16
|
|
|
sugarloaf.summary_color = d3.scale.ordinal() |
|
17
|
|
|
// green, blue, black, double-black, terrain-park closed |
|
18
|
|
|
.range(['#00A64B', '#2D2D94', '#6D6D6D', '#000', '#F6AE3B', '#FFF']) |
|
19
|
|
|
.domain(['green', 'blue', 'black', 'double-black', 'terrain-park', 'closed']); |
|
20
|
|
|
|
|
21
|
|
|
function buildCharts() { |
|
22
|
|
|
sugarloaf.ndx = crossfilter(sugarloaf.data.trails); |
|
23
|
|
|
|
|
24
|
|
|
sugarloaf.openDim = sugarloaf.ndx.dimension(function(d) { |
|
25
|
|
|
if (d.open) { |
|
26
|
|
|
return 'Open'; |
|
27
|
|
|
} else { |
|
28
|
|
|
return 'Closed'; |
|
29
|
|
|
}; |
|
30
|
|
|
}); |
|
31
|
|
|
sugarloaf.openGroup = sugarloaf.openDim.group().reduceCount(function(d) { |
|
32
|
|
|
return d.open; |
|
33
|
|
|
}); |
|
34
|
|
|
sugarloaf.openChart = dc.rowChart('#chart-row-open'); |
|
|
|
|
|
|
35
|
|
|
sugarloaf.openChart |
|
36
|
|
|
.width(WIDTH) |
|
37
|
|
|
.height(HEIGHT/2) |
|
38
|
|
|
.margins(MARGINS) |
|
39
|
|
|
.dimension(sugarloaf.openDim) |
|
40
|
|
|
.group(sugarloaf.openGroup) |
|
41
|
|
|
.elasticX(true); |
|
42
|
|
|
|
|
43
|
|
|
|
|
44
|
|
|
sugarloaf.groomedDim = sugarloaf.ndx.dimension(function(d) { |
|
45
|
|
|
if (d.groomed) { |
|
46
|
|
|
return 'Groomed'; |
|
47
|
|
|
} else { |
|
48
|
|
|
return 'Ungroomed'; |
|
49
|
|
|
} |
|
50
|
|
|
}); |
|
51
|
|
|
sugarloaf.groomedGroup = sugarloaf.groomedDim.group().reduceCount(function(d) { |
|
52
|
|
|
return d.groomed; |
|
53
|
|
|
}) |
|
54
|
|
|
sugarloaf.groomedChart = dc.rowChart('#chart-row-groomed'); |
|
|
|
|
|
|
55
|
|
|
sugarloaf.groomedChart |
|
56
|
|
|
.width(WIDTH) |
|
57
|
|
|
.height(HEIGHT/2) |
|
58
|
|
|
.margins(MARGINS) |
|
59
|
|
|
.dimension(sugarloaf.groomedDim) |
|
60
|
|
|
.group(sugarloaf.groomedGroup) |
|
61
|
|
|
.elasticX(true); |
|
62
|
|
|
|
|
63
|
|
|
|
|
64
|
|
|
sugarloaf.snowmakingDim = sugarloaf.ndx.dimension(function(d) { |
|
65
|
|
|
if (d.snowmaking) { |
|
66
|
|
|
return 'Snowmaking in progress'; |
|
67
|
|
|
} else { |
|
68
|
|
|
return 'Not snowmaking'; |
|
69
|
|
|
} |
|
70
|
|
|
}); |
|
71
|
|
|
sugarloaf.snowmakingGroup = sugarloaf.snowmakingDim.group().reduceCount(function(d) { |
|
72
|
|
|
return d.snowmaking; |
|
73
|
|
|
}); |
|
74
|
|
|
sugarloaf.snowmakingChart = dc.rowChart('#chart-row-snowmaking'); |
|
|
|
|
|
|
75
|
|
|
sugarloaf.snowmakingChart |
|
76
|
|
|
.width(WIDTH) |
|
77
|
|
|
.height(HEIGHT/2) |
|
78
|
|
|
.margins(MARGINS) |
|
79
|
|
|
.dimension(sugarloaf.snowmakingDim) |
|
80
|
|
|
.group(sugarloaf.snowmakingGroup) |
|
81
|
|
|
.elasticX(true); |
|
82
|
|
|
|
|
83
|
|
|
sugarloaf.difficultyDim = sugarloaf.ndx.dimension(function(d) { |
|
84
|
|
|
return d.difficulty; |
|
85
|
|
|
}); |
|
86
|
|
|
sugarloaf.difficultyGroup = sugarloaf.difficultyDim.group().reduceCount(function(d) { |
|
87
|
|
|
return d.difficulty; |
|
88
|
|
|
}); |
|
89
|
|
|
sugarloaf.difficultyChart = dc.rowChart('#chart-row-difficulty'); |
|
|
|
|
|
|
90
|
|
|
sugarloaf.difficultyChart |
|
91
|
|
|
.width(WIDTH) |
|
92
|
|
|
.height(HEIGHT) |
|
93
|
|
|
.margins(MARGINS) |
|
94
|
|
|
.dimension(sugarloaf.difficultyDim) |
|
95
|
|
|
.group(sugarloaf.difficultyGroup) |
|
96
|
|
|
.colors(sugarloaf.summary_color) |
|
97
|
|
|
.colorAccessor(function(d) { |
|
98
|
|
|
return d.key; |
|
99
|
|
|
}) |
|
100
|
|
|
.ordering(function(d) { |
|
101
|
|
|
return sugarloaf.difficulty_order[d.key]; |
|
102
|
|
|
}) |
|
103
|
|
|
.elasticX(true); |
|
104
|
|
|
|
|
105
|
|
|
|
|
106
|
|
|
sugarloaf.areaDim = sugarloaf.ndx.dimension(function(d) { |
|
107
|
|
|
return d.area; |
|
108
|
|
|
}); |
|
109
|
|
|
sugarloaf.areaGroup = sugarloaf.areaDim.group().reduceCount(function(d) { |
|
110
|
|
|
return d.area; |
|
111
|
|
|
}); |
|
112
|
|
|
sugarloaf.areaChart = dc.rowChart('#chart-row-area'); |
|
|
|
|
|
|
113
|
|
|
sugarloaf.areaChart |
|
114
|
|
|
.width(WIDTH) |
|
115
|
|
|
.height(HEIGHT * 2) |
|
116
|
|
|
.margins(MARGINS) |
|
117
|
|
|
.dimension(sugarloaf.areaDim) |
|
118
|
|
|
.group(sugarloaf.areaGroup) |
|
119
|
|
|
.elasticX(true); |
|
120
|
|
|
|
|
121
|
|
|
dc.renderAll(); |
|
122
|
|
|
} |
|
123
|
|
|
|
|
124
|
|
|
function summaryToDates(summary) { |
|
125
|
|
|
var dates = {}; |
|
126
|
|
|
|
|
127
|
|
|
summary.conditions.forEach(function(c) { |
|
128
|
|
|
// set our initial date if unknown |
|
129
|
|
|
if (undefined === dates[c.datetime]) { |
|
130
|
|
|
dates[c.datetime] = {}; |
|
131
|
|
|
} |
|
132
|
|
|
|
|
133
|
|
|
// make our difficulties |
|
134
|
|
|
if (c.open && undefined === dates[c.datetime][c.difficulty]) { |
|
135
|
|
|
dates[c.datetime][c.difficulty] = c.trail_count; |
|
136
|
|
|
} else if (c.open) { |
|
137
|
|
|
dates[c.datetime][c.difficulty] += c.trail_count; |
|
138
|
|
|
} else if (undefined === dates[c.datetime]['closed']) { |
|
139
|
|
|
dates[c.datetime]['closed'] = c.trail_count; |
|
140
|
|
|
} else { |
|
141
|
|
|
dates[c.datetime]['closed'] += c.trail_count; |
|
142
|
|
|
}; |
|
143
|
|
|
}); |
|
144
|
|
|
|
|
145
|
|
|
var dates_list = []; |
|
146
|
|
|
|
|
147
|
|
|
Object.keys(dates).forEach(function(key) { |
|
148
|
|
|
var date = dates[key]; |
|
149
|
|
|
date['datetime'] = sugarloaf.parseDate.parse(key); |
|
150
|
|
|
dates_list.push(date); |
|
151
|
|
|
}); |
|
152
|
|
|
|
|
153
|
|
|
dates_list.sort(function(a, b) { |
|
154
|
|
|
if (a.datetime < b.datetime) { |
|
155
|
|
|
return -1; |
|
156
|
|
|
} else { |
|
157
|
|
|
return 1; |
|
158
|
|
|
} |
|
159
|
|
|
}); |
|
160
|
|
|
|
|
161
|
|
|
return dates_list; |
|
162
|
|
|
}; |
|
163
|
|
|
|
|
164
|
|
|
// takes the output of summaryToDates and returns a list of lists ordered by |
|
165
|
|
|
// Object.keys(sugarloaf.difficulty_order) |
|
166
|
|
|
function datesToDataset(dates) { |
|
167
|
|
|
var output = []; |
|
168
|
|
|
|
|
169
|
|
|
Object.keys(sugarloaf.difficulty_order).forEach(function(difficulty) { |
|
170
|
|
|
var diff_array = []; |
|
171
|
|
|
|
|
172
|
|
|
dates.forEach(function(date) { |
|
173
|
|
|
var date_diff_obj = {'x': date.datetime} |
|
174
|
|
|
if (undefined === date[difficulty]) { |
|
175
|
|
|
date_diff_obj['y'] = 0; |
|
176
|
|
|
} else { |
|
177
|
|
|
date_diff_obj['y'] = date[difficulty]; |
|
178
|
|
|
} |
|
179
|
|
|
diff_array.push(date_diff_obj) |
|
180
|
|
|
}) |
|
181
|
|
|
|
|
182
|
|
|
output.push(diff_array); |
|
183
|
|
|
}) |
|
184
|
|
|
return output; |
|
185
|
|
|
} |
|
186
|
|
|
|
|
187
|
|
|
function countDate(date) { |
|
188
|
|
|
var count = 0; |
|
189
|
|
|
for (var key in date) { |
|
190
|
|
|
if (date.hasOwnProperty(key) && key !== 'datetime') { |
|
191
|
|
|
count += date[key]; |
|
192
|
|
|
} |
|
193
|
|
|
} |
|
194
|
|
|
return count; |
|
195
|
|
|
} |
|
196
|
|
|
|
|
197
|
|
|
function buildSummaryChart(summary) { |
|
198
|
|
|
sugarloaf.dates = summaryToDates(summary); |
|
199
|
|
|
var maxWidth = d3.select('#chart-summary')[0][0].clientWidth; |
|
|
|
|
|
|
200
|
|
|
var width = maxWidth - MARGINS.left - MARGINS.right, |
|
201
|
|
|
height = 200 - MARGINS.top - MARGINS.bottom; |
|
202
|
|
|
sugarloaf.dataset = datesToDataset(sugarloaf.dates); |
|
203
|
|
|
|
|
204
|
|
|
sugarloaf.summary_x = d3.time.scale() |
|
205
|
|
|
.range([0, width]) |
|
206
|
|
|
.domain(d3.extent(sugarloaf.dates.map(function(d) { |
|
207
|
|
|
return d.datetime; |
|
208
|
|
|
}))); |
|
209
|
|
|
|
|
210
|
|
|
sugarloaf.summary_y = d3.scale.linear() |
|
|
|
|
|
|
211
|
|
|
.rangeRound([height, 0]) |
|
212
|
|
|
.domain([0, d3.max(sugarloaf.dates, function(d) { return countDate(d)})]); |
|
213
|
|
|
|
|
214
|
|
|
sugarloaf.summary_stack = d3.layout.stack(); |
|
|
|
|
|
|
215
|
|
|
|
|
216
|
|
|
sugarloaf.summary_stack_layers = sugarloaf.summary_stack(sugarloaf.dataset); |
|
217
|
|
|
|
|
218
|
|
|
sugarloaf.summary_area = d3.svg.area() |
|
219
|
|
|
.interpolate('cardinal') |
|
220
|
|
|
.x(function(d) { return sugarloaf.summary_x(d.x)}) |
|
221
|
|
|
.y0(function(d) { return sugarloaf.summary_y(d.y0)}) |
|
222
|
|
|
.y1(function(d) { return sugarloaf.summary_y(d.y0 + d.y)}); |
|
223
|
|
|
|
|
224
|
|
|
sugarloaf.summary_xAxis = d3.svg.axis() |
|
|
|
|
|
|
225
|
|
|
.scale(sugarloaf.summary_x) |
|
226
|
|
|
.orient('bottom') |
|
227
|
|
|
//.ticks(d3.time.sundays, 1) |
|
228
|
|
|
.ticks(10) |
|
229
|
|
|
//.tickSubdivide(true) |
|
230
|
|
|
.tickFormat(d3.time.format("%b %e")); |
|
231
|
|
|
|
|
232
|
|
|
sugarloaf.summary_yAxis = d3.svg.axis() |
|
233
|
|
|
.scale(sugarloaf.summary_y) |
|
234
|
|
|
.orient('left'); |
|
235
|
|
|
|
|
236
|
|
|
var svg = d3.select('#chart-summary').append('svg') |
|
237
|
|
|
.attr('width', width + MARGINS.left + MARGINS.right) |
|
238
|
|
|
.attr('height', height + MARGINS.top + MARGINS.bottom) |
|
239
|
|
|
.append('g') |
|
240
|
|
|
.attr('transform', 'translate(' + MARGINS.left + ',' + MARGINS.top +')'); |
|
241
|
|
|
|
|
242
|
|
|
var selection = svg.selectAll('.series') |
|
|
|
|
|
|
243
|
|
|
.data(sugarloaf.summary_stack_layers) |
|
244
|
|
|
.enter().append('path') |
|
245
|
|
|
.attr('class', 'layer') |
|
246
|
|
|
.attr('d', function(d) { return sugarloaf.summary_area(d);}) |
|
247
|
|
|
.style('fill', function(d, i) { return sugarloaf.summary_color(Object.keys(sugarloaf.difficulty_order)[i]) }); |
|
248
|
|
|
|
|
249
|
|
|
svg.append('g') |
|
250
|
|
|
.attr('class', 'x axis') |
|
251
|
|
|
.attr('transform', 'translate(0,' + height + ')') |
|
252
|
|
|
.call(sugarloaf.summary_xAxis); |
|
253
|
|
|
|
|
254
|
|
|
svg.append('g') |
|
255
|
|
|
.attr('class', 'y axis') |
|
256
|
|
|
.call(sugarloaf.summary_yAxis); |
|
257
|
|
|
} |
|
258
|
|
|
|
|
259
|
|
|
d3.json(filename_status, function(data) { |
|
|
|
|
|
|
260
|
|
|
sugarloaf.data = data; |
|
261
|
|
|
|
|
262
|
|
|
buildCharts(); |
|
263
|
|
|
}); |
|
264
|
|
|
|
|
265
|
|
|
d3.json(filename_summary, function(data) { |
|
|
|
|
|
|
266
|
|
|
sugarloaf.summary = data; |
|
267
|
|
|
|
|
268
|
|
|
buildSummaryChart(sugarloaf.summary); |
|
269
|
|
|
}); |
abkfenris /
sugarloaf
Loading history...
This checks looks for references to variables that have not been declared. This is most likey a typographical error or a variable has been renamed.
To learn more about declaring variables in Javascript, see the MDN.