pyk 0.2.6 → 0.2.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +8 -8
- data/app/assets/javascripts/lib/chardinjs.min.js +2 -0
- data/app/assets/javascripts/lib/crossfilter.js +1383 -1
- data/app/assets/javascripts/lib/{d3.js → d3.v3.js} +0 -0
- data/app/assets/javascripts/lib/dc.js +3492 -757
- data/app/assets/javascripts/lib/jquery.gridster.js +2 -3621
- data/app/assets/javascripts/lib/markermanager.js +2 -980
- data/app/assets/javascripts/lib/underscore.js +1276 -0
- data/app/assets/javascripts/nvd3/lib/colorbrewer.js +302 -0
- data/app/assets/javascripts/nvd3/lib/crossfilter.js +1180 -0
- data/app/assets/javascripts/nvd3/lib/crossfilter.min.js +1 -0
- data/app/assets/javascripts/nvd3/lib/d3.v2.js +7033 -0
- data/app/assets/javascripts/nvd3/lib/d3.v2.min.js +4 -0
- data/app/assets/javascripts/nvd3/lib/d3.v3.js +8436 -0
- data/app/assets/javascripts/nvd3/lib/fisheye.js +86 -0
- data/app/assets/javascripts/nvd3/lib/hive.js +80 -0
- data/app/assets/javascripts/nvd3/lib/horizon.js +192 -0
- data/app/assets/javascripts/nvd3/lib/sankey.js +292 -0
- data/app/assets/javascripts/nvd3/nv.d3.js +14312 -0
- data/app/assets/javascripts/nvd3/nv.d3.min.js +6 -0
- data/app/assets/javascripts/nvd3/src/core.js +122 -0
- data/app/assets/javascripts/nvd3/src/interactiveLayer.js +251 -0
- data/app/assets/javascripts/nvd3/src/models/axis.js +405 -0
- data/app/assets/javascripts/nvd3/src/models/backup/bullet.js +250 -0
- data/app/assets/javascripts/nvd3/src/models/backup/bulletChart.js +349 -0
- data/app/assets/javascripts/nvd3/src/models/boilerplate.js +104 -0
- data/app/assets/javascripts/nvd3/src/models/bullet.js +385 -0
- data/app/assets/javascripts/nvd3/src/models/bulletChart.js +343 -0
- data/app/assets/javascripts/nvd3/src/models/cumulativeLineChart.js +782 -0
- data/app/assets/javascripts/nvd3/src/models/discreteBar.js +349 -0
- data/app/assets/javascripts/nvd3/src/models/discreteBarChart.js +333 -0
- data/app/assets/javascripts/nvd3/src/models/distribution.js +148 -0
- data/app/assets/javascripts/nvd3/src/models/historicalBar.js +331 -0
- data/app/assets/javascripts/nvd3/src/models/historicalBarChart.js +419 -0
- data/app/assets/javascripts/nvd3/src/models/indentedTree.js +337 -0
- data/app/assets/javascripts/nvd3/src/models/legend.js +270 -0
- data/app/assets/javascripts/nvd3/src/models/line.js +284 -0
- data/app/assets/javascripts/nvd3/src/models/lineChart.js +465 -0
- data/app/assets/javascripts/nvd3/src/models/linePlusBarChart.js +433 -0
- data/app/assets/javascripts/nvd3/src/models/linePlusBarWithFocusChart.js +658 -0
- data/app/assets/javascripts/nvd3/src/models/lineWithFisheye.js +200 -0
- data/app/assets/javascripts/nvd3/src/models/lineWithFisheyeChart.js +297 -0
- data/app/assets/javascripts/nvd3/src/models/lineWithFocusChart.js +574 -0
- data/app/assets/javascripts/nvd3/src/models/multiBar.js +461 -0
- data/app/assets/javascripts/nvd3/src/models/multiBarChart.js +524 -0
- data/app/assets/javascripts/nvd3/src/models/multiBarHorizontal.js +424 -0
- data/app/assets/javascripts/nvd3/src/models/multiBarHorizontalChart.js +434 -0
- data/app/assets/javascripts/nvd3/src/models/multiBarTimeSeries.js +384 -0
- data/app/assets/javascripts/nvd3/src/models/multiBarTimeSeriesChart.js +405 -0
- data/app/assets/javascripts/nvd3/src/models/multiChart.js +452 -0
- data/app/assets/javascripts/nvd3/src/models/ohlcBar.js +380 -0
- data/app/assets/javascripts/nvd3/src/models/parallelCoordinates.js +239 -0
- data/app/assets/javascripts/nvd3/src/models/pie.js +398 -0
- data/app/assets/javascripts/nvd3/src/models/pieChart.js +292 -0
- data/app/assets/javascripts/nvd3/src/models/scatter.js +674 -0
- data/app/assets/javascripts/nvd3/src/models/scatterChart.js +628 -0
- data/app/assets/javascripts/nvd3/src/models/scatterPlusLineChart.js +620 -0
- data/app/assets/javascripts/nvd3/src/models/sparkline.js +194 -0
- data/app/assets/javascripts/nvd3/src/models/sparklinePlus.js +295 -0
- data/app/assets/javascripts/nvd3/src/models/stackedArea.js +368 -0
- data/app/assets/javascripts/nvd3/src/models/stackedAreaChart.js +629 -0
- data/app/assets/javascripts/nvd3/src/tooltip.js +490 -0
- data/app/assets/javascripts/nvd3/src/utils.js +152 -0
- data/app/assets/javascripts/pyk.js +1 -0
- data/app/assets/stylesheets/lib/chardinjs.css +82 -0
- data/app/assets/stylesheets/nvd3/nv.d3.css +769 -0
- data/app/assets/stylesheets/pyk.css.scss +1 -0
- metadata +61 -2
@@ -0,0 +1,419 @@
|
|
1
|
+
|
2
|
+
nv.models.historicalBarChart = function() {
|
3
|
+
"use strict";
|
4
|
+
//============================================================
|
5
|
+
// Public Variables with Default Settings
|
6
|
+
//------------------------------------------------------------
|
7
|
+
|
8
|
+
var bars = nv.models.historicalBar()
|
9
|
+
, xAxis = nv.models.axis()
|
10
|
+
, yAxis = nv.models.axis()
|
11
|
+
, legend = nv.models.legend()
|
12
|
+
;
|
13
|
+
|
14
|
+
|
15
|
+
var margin = {top: 30, right: 90, bottom: 50, left: 90}
|
16
|
+
, color = nv.utils.defaultColor()
|
17
|
+
, width = null
|
18
|
+
, height = null
|
19
|
+
, showLegend = false
|
20
|
+
, showXAxis = true
|
21
|
+
, showYAxis = true
|
22
|
+
, rightAlignYAxis = false
|
23
|
+
, tooltips = true
|
24
|
+
, tooltip = function(key, x, y, e, graph) {
|
25
|
+
return '<h3>' + key + '</h3>' +
|
26
|
+
'<p>' + y + ' at ' + x + '</p>'
|
27
|
+
}
|
28
|
+
, x
|
29
|
+
, y
|
30
|
+
, state = {}
|
31
|
+
, defaultState = null
|
32
|
+
, noData = 'No Data Available.'
|
33
|
+
, dispatch = d3.dispatch('tooltipShow', 'tooltipHide', 'stateChange', 'changeState')
|
34
|
+
, transitionDuration = 250
|
35
|
+
;
|
36
|
+
|
37
|
+
xAxis
|
38
|
+
.orient('bottom')
|
39
|
+
.tickPadding(7)
|
40
|
+
;
|
41
|
+
yAxis
|
42
|
+
.orient( (rightAlignYAxis) ? 'right' : 'left')
|
43
|
+
;
|
44
|
+
|
45
|
+
//============================================================
|
46
|
+
|
47
|
+
|
48
|
+
//============================================================
|
49
|
+
// Private Variables
|
50
|
+
//------------------------------------------------------------
|
51
|
+
|
52
|
+
var showTooltip = function(e, offsetElement) {
|
53
|
+
|
54
|
+
// New addition to calculate position if SVG is scaled with viewBox, may move TODO: consider implementing everywhere else
|
55
|
+
if (offsetElement) {
|
56
|
+
var svg = d3.select(offsetElement).select('svg');
|
57
|
+
var viewBox = (svg.node()) ? svg.attr('viewBox') : null;
|
58
|
+
if (viewBox) {
|
59
|
+
viewBox = viewBox.split(' ');
|
60
|
+
var ratio = parseInt(svg.style('width')) / viewBox[2];
|
61
|
+
e.pos[0] = e.pos[0] * ratio;
|
62
|
+
e.pos[1] = e.pos[1] * ratio;
|
63
|
+
}
|
64
|
+
}
|
65
|
+
|
66
|
+
var left = e.pos[0] + ( offsetElement.offsetLeft || 0 ),
|
67
|
+
top = e.pos[1] + ( offsetElement.offsetTop || 0),
|
68
|
+
x = xAxis.tickFormat()(bars.x()(e.point, e.pointIndex)),
|
69
|
+
y = yAxis.tickFormat()(bars.y()(e.point, e.pointIndex)),
|
70
|
+
content = tooltip(e.series.key, x, y, e, chart);
|
71
|
+
|
72
|
+
nv.tooltip.show([left, top], content, null, null, offsetElement);
|
73
|
+
};
|
74
|
+
|
75
|
+
//============================================================
|
76
|
+
|
77
|
+
|
78
|
+
function chart(selection) {
|
79
|
+
selection.each(function(data) {
|
80
|
+
var container = d3.select(this),
|
81
|
+
that = this;
|
82
|
+
|
83
|
+
var availableWidth = (width || parseInt(container.style('width')) || 960)
|
84
|
+
- margin.left - margin.right,
|
85
|
+
availableHeight = (height || parseInt(container.style('height')) || 400)
|
86
|
+
- margin.top - margin.bottom;
|
87
|
+
|
88
|
+
|
89
|
+
chart.update = function() { container.transition().duration(transitionDuration).call(chart) };
|
90
|
+
chart.container = this;
|
91
|
+
|
92
|
+
//set state.disabled
|
93
|
+
state.disabled = data.map(function(d) { return !!d.disabled });
|
94
|
+
|
95
|
+
if (!defaultState) {
|
96
|
+
var key;
|
97
|
+
defaultState = {};
|
98
|
+
for (key in state) {
|
99
|
+
if (state[key] instanceof Array)
|
100
|
+
defaultState[key] = state[key].slice(0);
|
101
|
+
else
|
102
|
+
defaultState[key] = state[key];
|
103
|
+
}
|
104
|
+
}
|
105
|
+
|
106
|
+
//------------------------------------------------------------
|
107
|
+
// Display noData message if there's nothing to show.
|
108
|
+
|
109
|
+
if (!data || !data.length || !data.filter(function(d) { return d.values.length }).length) {
|
110
|
+
var noDataText = container.selectAll('.nv-noData').data([noData]);
|
111
|
+
|
112
|
+
noDataText.enter().append('text')
|
113
|
+
.attr('class', 'nvd3 nv-noData')
|
114
|
+
.attr('dy', '-.7em')
|
115
|
+
.style('text-anchor', 'middle');
|
116
|
+
|
117
|
+
noDataText
|
118
|
+
.attr('x', margin.left + availableWidth / 2)
|
119
|
+
.attr('y', margin.top + availableHeight / 2)
|
120
|
+
.text(function(d) { return d });
|
121
|
+
|
122
|
+
return chart;
|
123
|
+
} else {
|
124
|
+
container.selectAll('.nv-noData').remove();
|
125
|
+
}
|
126
|
+
|
127
|
+
//------------------------------------------------------------
|
128
|
+
|
129
|
+
|
130
|
+
//------------------------------------------------------------
|
131
|
+
// Setup Scales
|
132
|
+
|
133
|
+
x = bars.xScale();
|
134
|
+
y = bars.yScale();
|
135
|
+
|
136
|
+
//------------------------------------------------------------
|
137
|
+
|
138
|
+
|
139
|
+
//------------------------------------------------------------
|
140
|
+
// Setup containers and skeleton of chart
|
141
|
+
|
142
|
+
var wrap = container.selectAll('g.nv-wrap.nv-historicalBarChart').data([data]);
|
143
|
+
var gEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-historicalBarChart').append('g');
|
144
|
+
var g = wrap.select('g');
|
145
|
+
|
146
|
+
gEnter.append('g').attr('class', 'nv-x nv-axis');
|
147
|
+
gEnter.append('g').attr('class', 'nv-y nv-axis');
|
148
|
+
gEnter.append('g').attr('class', 'nv-barsWrap');
|
149
|
+
gEnter.append('g').attr('class', 'nv-legendWrap');
|
150
|
+
|
151
|
+
//------------------------------------------------------------
|
152
|
+
|
153
|
+
|
154
|
+
//------------------------------------------------------------
|
155
|
+
// Legend
|
156
|
+
|
157
|
+
if (showLegend) {
|
158
|
+
legend.width(availableWidth);
|
159
|
+
|
160
|
+
g.select('.nv-legendWrap')
|
161
|
+
.datum(data)
|
162
|
+
.call(legend);
|
163
|
+
|
164
|
+
if ( margin.top != legend.height()) {
|
165
|
+
margin.top = legend.height();
|
166
|
+
availableHeight = (height || parseInt(container.style('height')) || 400)
|
167
|
+
- margin.top - margin.bottom;
|
168
|
+
}
|
169
|
+
|
170
|
+
wrap.select('.nv-legendWrap')
|
171
|
+
.attr('transform', 'translate(0,' + (-margin.top) +')')
|
172
|
+
}
|
173
|
+
|
174
|
+
//------------------------------------------------------------
|
175
|
+
|
176
|
+
wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
|
177
|
+
|
178
|
+
if (rightAlignYAxis) {
|
179
|
+
g.select(".nv-y.nv-axis")
|
180
|
+
.attr("transform", "translate(" + availableWidth + ",0)");
|
181
|
+
}
|
182
|
+
|
183
|
+
|
184
|
+
//------------------------------------------------------------
|
185
|
+
// Main Chart Component(s)
|
186
|
+
|
187
|
+
bars
|
188
|
+
.width(availableWidth)
|
189
|
+
.height(availableHeight)
|
190
|
+
.color(data.map(function(d,i) {
|
191
|
+
return d.color || color(d, i);
|
192
|
+
}).filter(function(d,i) { return !data[i].disabled }));
|
193
|
+
|
194
|
+
|
195
|
+
var barsWrap = g.select('.nv-barsWrap')
|
196
|
+
.datum(data.filter(function(d) { return !d.disabled }))
|
197
|
+
|
198
|
+
barsWrap.transition().call(bars);
|
199
|
+
|
200
|
+
//------------------------------------------------------------
|
201
|
+
|
202
|
+
|
203
|
+
//------------------------------------------------------------
|
204
|
+
// Setup Axes
|
205
|
+
|
206
|
+
if (showXAxis) {
|
207
|
+
xAxis
|
208
|
+
.scale(x)
|
209
|
+
.tickSize(-availableHeight, 0);
|
210
|
+
|
211
|
+
g.select('.nv-x.nv-axis')
|
212
|
+
.attr('transform', 'translate(0,' + y.range()[0] + ')');
|
213
|
+
g.select('.nv-x.nv-axis')
|
214
|
+
.transition()
|
215
|
+
.call(xAxis);
|
216
|
+
}
|
217
|
+
|
218
|
+
if (showYAxis) {
|
219
|
+
yAxis
|
220
|
+
.scale(y)
|
221
|
+
.ticks( availableHeight / 36 )
|
222
|
+
.tickSize( -availableWidth, 0);
|
223
|
+
|
224
|
+
g.select('.nv-y.nv-axis')
|
225
|
+
.transition()
|
226
|
+
.call(yAxis);
|
227
|
+
}
|
228
|
+
//------------------------------------------------------------
|
229
|
+
|
230
|
+
|
231
|
+
//============================================================
|
232
|
+
// Event Handling/Dispatching (in chart's scope)
|
233
|
+
//------------------------------------------------------------
|
234
|
+
|
235
|
+
legend.dispatch.on('legendClick', function(d,i) {
|
236
|
+
d.disabled = !d.disabled;
|
237
|
+
|
238
|
+
if (!data.filter(function(d) { return !d.disabled }).length) {
|
239
|
+
data.map(function(d) {
|
240
|
+
d.disabled = false;
|
241
|
+
wrap.selectAll('.nv-series').classed('disabled', false);
|
242
|
+
return d;
|
243
|
+
});
|
244
|
+
}
|
245
|
+
|
246
|
+
state.disabled = data.map(function(d) { return !!d.disabled });
|
247
|
+
dispatch.stateChange(state);
|
248
|
+
|
249
|
+
selection.transition().call(chart);
|
250
|
+
});
|
251
|
+
|
252
|
+
legend.dispatch.on('legendDblclick', function(d) {
|
253
|
+
//Double clicking should always enable current series, and disabled all others.
|
254
|
+
data.forEach(function(d) {
|
255
|
+
d.disabled = true;
|
256
|
+
});
|
257
|
+
d.disabled = false;
|
258
|
+
|
259
|
+
state.disabled = data.map(function(d) { return !!d.disabled });
|
260
|
+
dispatch.stateChange(state);
|
261
|
+
chart.update();
|
262
|
+
});
|
263
|
+
|
264
|
+
dispatch.on('tooltipShow', function(e) {
|
265
|
+
if (tooltips) showTooltip(e, that.parentNode);
|
266
|
+
});
|
267
|
+
|
268
|
+
|
269
|
+
dispatch.on('changeState', function(e) {
|
270
|
+
|
271
|
+
if (typeof e.disabled !== 'undefined') {
|
272
|
+
data.forEach(function(series,i) {
|
273
|
+
series.disabled = e.disabled[i];
|
274
|
+
});
|
275
|
+
|
276
|
+
state.disabled = e.disabled;
|
277
|
+
}
|
278
|
+
|
279
|
+
selection.call(chart);
|
280
|
+
});
|
281
|
+
|
282
|
+
//============================================================
|
283
|
+
|
284
|
+
});
|
285
|
+
|
286
|
+
return chart;
|
287
|
+
}
|
288
|
+
|
289
|
+
|
290
|
+
//============================================================
|
291
|
+
// Event Handling/Dispatching (out of chart's scope)
|
292
|
+
//------------------------------------------------------------
|
293
|
+
|
294
|
+
bars.dispatch.on('elementMouseover.tooltip', function(e) {
|
295
|
+
e.pos = [e.pos[0] + margin.left, e.pos[1] + margin.top];
|
296
|
+
dispatch.tooltipShow(e);
|
297
|
+
});
|
298
|
+
|
299
|
+
bars.dispatch.on('elementMouseout.tooltip', function(e) {
|
300
|
+
dispatch.tooltipHide(e);
|
301
|
+
});
|
302
|
+
|
303
|
+
dispatch.on('tooltipHide', function() {
|
304
|
+
if (tooltips) nv.tooltip.cleanup();
|
305
|
+
});
|
306
|
+
|
307
|
+
//============================================================
|
308
|
+
|
309
|
+
|
310
|
+
//============================================================
|
311
|
+
// Expose Public Variables
|
312
|
+
//------------------------------------------------------------
|
313
|
+
|
314
|
+
// expose chart's sub-components
|
315
|
+
chart.dispatch = dispatch;
|
316
|
+
chart.bars = bars;
|
317
|
+
chart.legend = legend;
|
318
|
+
chart.xAxis = xAxis;
|
319
|
+
chart.yAxis = yAxis;
|
320
|
+
|
321
|
+
d3.rebind(chart, bars, 'defined', 'isArea', 'x', 'y', 'size', 'xScale', 'yScale',
|
322
|
+
'xDomain', 'yDomain', 'xRange', 'yRange', 'forceX', 'forceY', 'interactive', 'clipEdge', 'clipVoronoi', 'id', 'interpolate','highlightPoint','clearHighlights', 'interactive');
|
323
|
+
|
324
|
+
chart.options = nv.utils.optionsFunc.bind(chart);
|
325
|
+
|
326
|
+
chart.margin = function(_) {
|
327
|
+
if (!arguments.length) return margin;
|
328
|
+
margin.top = typeof _.top != 'undefined' ? _.top : margin.top;
|
329
|
+
margin.right = typeof _.right != 'undefined' ? _.right : margin.right;
|
330
|
+
margin.bottom = typeof _.bottom != 'undefined' ? _.bottom : margin.bottom;
|
331
|
+
margin.left = typeof _.left != 'undefined' ? _.left : margin.left;
|
332
|
+
return chart;
|
333
|
+
};
|
334
|
+
|
335
|
+
chart.width = function(_) {
|
336
|
+
if (!arguments.length) return width;
|
337
|
+
width = _;
|
338
|
+
return chart;
|
339
|
+
};
|
340
|
+
|
341
|
+
chart.height = function(_) {
|
342
|
+
if (!arguments.length) return height;
|
343
|
+
height = _;
|
344
|
+
return chart;
|
345
|
+
};
|
346
|
+
|
347
|
+
chart.color = function(_) {
|
348
|
+
if (!arguments.length) return color;
|
349
|
+
color = nv.utils.getColor(_);
|
350
|
+
legend.color(color);
|
351
|
+
return chart;
|
352
|
+
};
|
353
|
+
|
354
|
+
chart.showLegend = function(_) {
|
355
|
+
if (!arguments.length) return showLegend;
|
356
|
+
showLegend = _;
|
357
|
+
return chart;
|
358
|
+
};
|
359
|
+
|
360
|
+
chart.showXAxis = function(_) {
|
361
|
+
if (!arguments.length) return showXAxis;
|
362
|
+
showXAxis = _;
|
363
|
+
return chart;
|
364
|
+
};
|
365
|
+
|
366
|
+
chart.showYAxis = function(_) {
|
367
|
+
if (!arguments.length) return showYAxis;
|
368
|
+
showYAxis = _;
|
369
|
+
return chart;
|
370
|
+
};
|
371
|
+
|
372
|
+
chart.rightAlignYAxis = function(_) {
|
373
|
+
if(!arguments.length) return rightAlignYAxis;
|
374
|
+
rightAlignYAxis = _;
|
375
|
+
yAxis.orient( (_) ? 'right' : 'left');
|
376
|
+
return chart;
|
377
|
+
};
|
378
|
+
|
379
|
+
chart.tooltips = function(_) {
|
380
|
+
if (!arguments.length) return tooltips;
|
381
|
+
tooltips = _;
|
382
|
+
return chart;
|
383
|
+
};
|
384
|
+
|
385
|
+
chart.tooltipContent = function(_) {
|
386
|
+
if (!arguments.length) return tooltip;
|
387
|
+
tooltip = _;
|
388
|
+
return chart;
|
389
|
+
};
|
390
|
+
|
391
|
+
chart.state = function(_) {
|
392
|
+
if (!arguments.length) return state;
|
393
|
+
state = _;
|
394
|
+
return chart;
|
395
|
+
};
|
396
|
+
|
397
|
+
chart.defaultState = function(_) {
|
398
|
+
if (!arguments.length) return defaultState;
|
399
|
+
defaultState = _;
|
400
|
+
return chart;
|
401
|
+
};
|
402
|
+
|
403
|
+
chart.noData = function(_) {
|
404
|
+
if (!arguments.length) return noData;
|
405
|
+
noData = _;
|
406
|
+
return chart;
|
407
|
+
};
|
408
|
+
|
409
|
+
chart.transitionDuration = function(_) {
|
410
|
+
if (!arguments.length) return transitionDuration;
|
411
|
+
transitionDuration = _;
|
412
|
+
return chart;
|
413
|
+
};
|
414
|
+
|
415
|
+
//============================================================
|
416
|
+
|
417
|
+
|
418
|
+
return chart;
|
419
|
+
}
|
@@ -0,0 +1,337 @@
|
|
1
|
+
nv.models.indentedTree = function() {
|
2
|
+
"use strict";
|
3
|
+
//============================================================
|
4
|
+
// Public Variables with Default Settings
|
5
|
+
//------------------------------------------------------------
|
6
|
+
|
7
|
+
var margin = {top: 0, right: 0, bottom: 0, left: 0} //TODO: implement, maybe as margin on the containing div
|
8
|
+
, width = 960
|
9
|
+
, height = 500
|
10
|
+
, color = nv.utils.defaultColor()
|
11
|
+
, id = Math.floor(Math.random() * 10000)
|
12
|
+
, header = true
|
13
|
+
, filterZero = false
|
14
|
+
, noData = "No Data Available."
|
15
|
+
, childIndent = 20
|
16
|
+
, columns = [{key:'key', label: 'Name', type:'text'}] //TODO: consider functions like chart.addColumn, chart.removeColumn, instead of a block like this
|
17
|
+
, tableClass = null
|
18
|
+
, iconOpen = 'images/grey-plus.png' //TODO: consider removing this and replacing with a '+' or '-' unless user defines images
|
19
|
+
, iconClose = 'images/grey-minus.png'
|
20
|
+
, dispatch = d3.dispatch('elementClick', 'elementDblclick', 'elementMouseover', 'elementMouseout')
|
21
|
+
, getUrl = function(d) { return d.url }
|
22
|
+
;
|
23
|
+
|
24
|
+
//============================================================
|
25
|
+
|
26
|
+
var idx = 0;
|
27
|
+
|
28
|
+
function chart(selection) {
|
29
|
+
selection.each(function(data) {
|
30
|
+
var depth = 1,
|
31
|
+
container = d3.select(this);
|
32
|
+
|
33
|
+
var tree = d3.layout.tree()
|
34
|
+
.children(function(d) { return d.values })
|
35
|
+
.size([height, childIndent]); //Not sure if this is needed now that the result is HTML
|
36
|
+
|
37
|
+
chart.update = function() { container.transition().duration(600).call(chart) };
|
38
|
+
|
39
|
+
|
40
|
+
//------------------------------------------------------------
|
41
|
+
// Display No Data message if there's nothing to show.
|
42
|
+
if (!data[0]) data[0] = {key: noData};
|
43
|
+
|
44
|
+
//------------------------------------------------------------
|
45
|
+
|
46
|
+
|
47
|
+
var nodes = tree.nodes(data[0]);
|
48
|
+
|
49
|
+
// nodes.map(function(d) {
|
50
|
+
// d.id = i++;
|
51
|
+
// })
|
52
|
+
|
53
|
+
//------------------------------------------------------------
|
54
|
+
// Setup containers and skeleton of chart
|
55
|
+
|
56
|
+
var wrap = d3.select(this).selectAll('div').data([[nodes]]);
|
57
|
+
var wrapEnter = wrap.enter().append('div').attr('class', 'nvd3 nv-wrap nv-indentedtree');
|
58
|
+
var tableEnter = wrapEnter.append('table');
|
59
|
+
var table = wrap.select('table').attr('width', '100%').attr('class', tableClass);
|
60
|
+
|
61
|
+
//------------------------------------------------------------
|
62
|
+
|
63
|
+
|
64
|
+
if (header) {
|
65
|
+
var thead = tableEnter.append('thead');
|
66
|
+
|
67
|
+
var theadRow1 = thead.append('tr');
|
68
|
+
|
69
|
+
columns.forEach(function(column) {
|
70
|
+
theadRow1
|
71
|
+
.append('th')
|
72
|
+
.attr('width', column.width ? column.width : '10%')
|
73
|
+
.style('text-align', column.type == 'numeric' ? 'right' : 'left')
|
74
|
+
.append('span')
|
75
|
+
.text(column.label);
|
76
|
+
});
|
77
|
+
}
|
78
|
+
|
79
|
+
|
80
|
+
var tbody = table.selectAll('tbody')
|
81
|
+
.data(function(d) { return d });
|
82
|
+
tbody.enter().append('tbody');
|
83
|
+
|
84
|
+
|
85
|
+
|
86
|
+
//compute max generations
|
87
|
+
depth = d3.max(nodes, function(node) { return node.depth });
|
88
|
+
tree.size([height, depth * childIndent]); //TODO: see if this is necessary at all
|
89
|
+
|
90
|
+
|
91
|
+
// Update the nodes…
|
92
|
+
var node = tbody.selectAll('tr')
|
93
|
+
// .data(function(d) { return d; }, function(d) { return d.id || (d.id == ++i)});
|
94
|
+
.data(function(d) { return d.filter(function(d) { return (filterZero && !d.children) ? filterZero(d) : true; } )}, function(d,i) { return d.id || (d.id || ++idx)});
|
95
|
+
//.style('display', 'table-row'); //TODO: see if this does anything
|
96
|
+
|
97
|
+
node.exit().remove();
|
98
|
+
|
99
|
+
node.select('img.nv-treeicon')
|
100
|
+
.attr('src', icon)
|
101
|
+
.classed('folded', folded);
|
102
|
+
|
103
|
+
var nodeEnter = node.enter().append('tr');
|
104
|
+
|
105
|
+
|
106
|
+
columns.forEach(function(column, index) {
|
107
|
+
|
108
|
+
var nodeName = nodeEnter.append('td')
|
109
|
+
.style('padding-left', function(d) { return (index ? 0 : d.depth * childIndent + 12 + (icon(d) ? 0 : 16)) + 'px' }, 'important') //TODO: check why I did the ternary here
|
110
|
+
.style('text-align', column.type == 'numeric' ? 'right' : 'left');
|
111
|
+
|
112
|
+
|
113
|
+
if (index == 0) {
|
114
|
+
nodeName.append('img')
|
115
|
+
.classed('nv-treeicon', true)
|
116
|
+
.classed('nv-folded', folded)
|
117
|
+
.attr('src', icon)
|
118
|
+
.style('width', '14px')
|
119
|
+
.style('height', '14px')
|
120
|
+
.style('padding', '0 1px')
|
121
|
+
.style('display', function(d) { return icon(d) ? 'inline-block' : 'none'; })
|
122
|
+
.on('click', click);
|
123
|
+
}
|
124
|
+
|
125
|
+
|
126
|
+
nodeName.each(function(d) {
|
127
|
+
if (!index && getUrl(d))
|
128
|
+
d3.select(this)
|
129
|
+
.append('a')
|
130
|
+
.attr('href',getUrl)
|
131
|
+
.attr('class', d3.functor(column.classes))
|
132
|
+
.append('span')
|
133
|
+
else
|
134
|
+
d3.select(this)
|
135
|
+
.append('span')
|
136
|
+
|
137
|
+
d3.select(this).select('span')
|
138
|
+
.attr('class', d3.functor(column.classes) )
|
139
|
+
.text(function(d) { return column.format ? column.format(d) :
|
140
|
+
(d[column.key] || '-') });
|
141
|
+
});
|
142
|
+
|
143
|
+
if (column.showCount) {
|
144
|
+
nodeName.append('span')
|
145
|
+
.attr('class', 'nv-childrenCount');
|
146
|
+
|
147
|
+
node.selectAll('span.nv-childrenCount').text(function(d) {
|
148
|
+
return ((d.values && d.values.length) || (d._values && d._values.length)) ? //If this is a parent
|
149
|
+
'(' + ((d.values && (d.values.filter(function(d) { return filterZero ? filterZero(d) : true; }).length)) //If children are in values check its children and filter
|
150
|
+
|| (d._values && d._values.filter(function(d) { return filterZero ? filterZero(d) : true; }).length) //Otherwise, do the same, but with the other name, _values...
|
151
|
+
|| 0) + ')' //This is the catch-all in case there are no children after a filter
|
152
|
+
: '' //If this is not a parent, just give an empty string
|
153
|
+
});
|
154
|
+
}
|
155
|
+
|
156
|
+
// if (column.click)
|
157
|
+
// nodeName.select('span').on('click', column.click);
|
158
|
+
|
159
|
+
});
|
160
|
+
|
161
|
+
node
|
162
|
+
.order()
|
163
|
+
.on('click', function(d) {
|
164
|
+
dispatch.elementClick({
|
165
|
+
row: this, //TODO: decide whether or not this should be consistent with scatter/line events or should be an html link (a href)
|
166
|
+
data: d,
|
167
|
+
pos: [d.x, d.y]
|
168
|
+
});
|
169
|
+
})
|
170
|
+
.on('dblclick', function(d) {
|
171
|
+
dispatch.elementDblclick({
|
172
|
+
row: this,
|
173
|
+
data: d,
|
174
|
+
pos: [d.x, d.y]
|
175
|
+
});
|
176
|
+
})
|
177
|
+
.on('mouseover', function(d) {
|
178
|
+
dispatch.elementMouseover({
|
179
|
+
row: this,
|
180
|
+
data: d,
|
181
|
+
pos: [d.x, d.y]
|
182
|
+
});
|
183
|
+
})
|
184
|
+
.on('mouseout', function(d) {
|
185
|
+
dispatch.elementMouseout({
|
186
|
+
row: this,
|
187
|
+
data: d,
|
188
|
+
pos: [d.x, d.y]
|
189
|
+
});
|
190
|
+
});
|
191
|
+
|
192
|
+
|
193
|
+
|
194
|
+
|
195
|
+
// Toggle children on click.
|
196
|
+
function click(d, _, unshift) {
|
197
|
+
d3.event.stopPropagation();
|
198
|
+
|
199
|
+
if(d3.event.shiftKey && !unshift) {
|
200
|
+
//If you shift-click, it'll toggle fold all the children, instead of itself
|
201
|
+
d3.event.shiftKey = false;
|
202
|
+
d.values && d.values.forEach(function(node){
|
203
|
+
if (node.values || node._values) {
|
204
|
+
click(node, 0, true);
|
205
|
+
}
|
206
|
+
});
|
207
|
+
return true;
|
208
|
+
}
|
209
|
+
if(!hasChildren(d)) {
|
210
|
+
//download file
|
211
|
+
//window.location.href = d.url;
|
212
|
+
return true;
|
213
|
+
}
|
214
|
+
if (d.values) {
|
215
|
+
d._values = d.values;
|
216
|
+
d.values = null;
|
217
|
+
} else {
|
218
|
+
d.values = d._values;
|
219
|
+
d._values = null;
|
220
|
+
}
|
221
|
+
chart.update();
|
222
|
+
}
|
223
|
+
|
224
|
+
|
225
|
+
function icon(d) {
|
226
|
+
return (d._values && d._values.length) ? iconOpen : (d.values && d.values.length) ? iconClose : '';
|
227
|
+
}
|
228
|
+
|
229
|
+
function folded(d) {
|
230
|
+
return (d._values && d._values.length);
|
231
|
+
}
|
232
|
+
|
233
|
+
function hasChildren(d) {
|
234
|
+
var values = d.values || d._values;
|
235
|
+
|
236
|
+
return (values && values.length);
|
237
|
+
}
|
238
|
+
|
239
|
+
|
240
|
+
});
|
241
|
+
|
242
|
+
return chart;
|
243
|
+
}
|
244
|
+
|
245
|
+
|
246
|
+
//============================================================
|
247
|
+
// Expose Public Variables
|
248
|
+
//------------------------------------------------------------
|
249
|
+
chart.options = nv.utils.optionsFunc.bind(chart);
|
250
|
+
|
251
|
+
chart.margin = function(_) {
|
252
|
+
if (!arguments.length) return margin;
|
253
|
+
margin.top = typeof _.top != 'undefined' ? _.top : margin.top;
|
254
|
+
margin.right = typeof _.right != 'undefined' ? _.right : margin.right;
|
255
|
+
margin.bottom = typeof _.bottom != 'undefined' ? _.bottom : margin.bottom;
|
256
|
+
margin.left = typeof _.left != 'undefined' ? _.left : margin.left;
|
257
|
+
return chart;
|
258
|
+
};
|
259
|
+
|
260
|
+
chart.width = function(_) {
|
261
|
+
if (!arguments.length) return width;
|
262
|
+
width = _;
|
263
|
+
return chart;
|
264
|
+
};
|
265
|
+
|
266
|
+
chart.height = function(_) {
|
267
|
+
if (!arguments.length) return height;
|
268
|
+
height = _;
|
269
|
+
return chart;
|
270
|
+
};
|
271
|
+
|
272
|
+
chart.color = function(_) {
|
273
|
+
if (!arguments.length) return color;
|
274
|
+
color = nv.utils.getColor(_);
|
275
|
+
scatter.color(color);
|
276
|
+
return chart;
|
277
|
+
};
|
278
|
+
|
279
|
+
chart.id = function(_) {
|
280
|
+
if (!arguments.length) return id;
|
281
|
+
id = _;
|
282
|
+
return chart;
|
283
|
+
};
|
284
|
+
|
285
|
+
chart.header = function(_) {
|
286
|
+
if (!arguments.length) return header;
|
287
|
+
header = _;
|
288
|
+
return chart;
|
289
|
+
};
|
290
|
+
|
291
|
+
chart.noData = function(_) {
|
292
|
+
if (!arguments.length) return noData;
|
293
|
+
noData = _;
|
294
|
+
return chart;
|
295
|
+
};
|
296
|
+
|
297
|
+
chart.filterZero = function(_) {
|
298
|
+
if (!arguments.length) return filterZero;
|
299
|
+
filterZero = _;
|
300
|
+
return chart;
|
301
|
+
};
|
302
|
+
|
303
|
+
chart.columns = function(_) {
|
304
|
+
if (!arguments.length) return columns;
|
305
|
+
columns = _;
|
306
|
+
return chart;
|
307
|
+
};
|
308
|
+
|
309
|
+
chart.tableClass = function(_) {
|
310
|
+
if (!arguments.length) return tableClass;
|
311
|
+
tableClass = _;
|
312
|
+
return chart;
|
313
|
+
};
|
314
|
+
|
315
|
+
chart.iconOpen = function(_){
|
316
|
+
if (!arguments.length) return iconOpen;
|
317
|
+
iconOpen = _;
|
318
|
+
return chart;
|
319
|
+
}
|
320
|
+
|
321
|
+
chart.iconClose = function(_){
|
322
|
+
if (!arguments.length) return iconClose;
|
323
|
+
iconClose = _;
|
324
|
+
return chart;
|
325
|
+
}
|
326
|
+
|
327
|
+
chart.getUrl = function(_){
|
328
|
+
if (!arguments.length) return getUrl;
|
329
|
+
getUrl = _;
|
330
|
+
return chart;
|
331
|
+
}
|
332
|
+
|
333
|
+
//============================================================
|
334
|
+
|
335
|
+
|
336
|
+
return chart;
|
337
|
+
};
|