nvd3-rails 0.0.1

Sign up to get free protection for your applications and to get access to all the features.
Files changed (167) hide show
  1. data/.gitmodules +3 -0
  2. data/README.md +101 -0
  3. data/lib/nvd3-rails.rb +1 -0
  4. data/lib/nvd3/rails.rb +8 -0
  5. data/lib/nvd3/rails/engine.rb +6 -0
  6. data/lib/nvd3/rails/version.rb +5 -0
  7. data/nvd3-rails.gemspec +21 -0
  8. data/vendor/assets/javascripts/nvd3-rails.js +7 -0
  9. data/vendor/assets/javascripts/nvd3/.git.sample/HEAD +1 -0
  10. data/vendor/assets/javascripts/nvd3/.git.sample/config +13 -0
  11. data/vendor/assets/javascripts/nvd3/.git.sample/description +1 -0
  12. data/vendor/assets/javascripts/nvd3/.git.sample/hooks/applypatch-msg.sample +15 -0
  13. data/vendor/assets/javascripts/nvd3/.git.sample/hooks/commit-msg.sample +24 -0
  14. data/vendor/assets/javascripts/nvd3/.git.sample/hooks/post-update.sample +8 -0
  15. data/vendor/assets/javascripts/nvd3/.git.sample/hooks/pre-applypatch.sample +14 -0
  16. data/vendor/assets/javascripts/nvd3/.git.sample/hooks/pre-commit.sample +50 -0
  17. data/vendor/assets/javascripts/nvd3/.git.sample/hooks/pre-push.sample +53 -0
  18. data/vendor/assets/javascripts/nvd3/.git.sample/hooks/pre-rebase.sample +169 -0
  19. data/vendor/assets/javascripts/nvd3/.git.sample/hooks/prepare-commit-msg.sample +36 -0
  20. data/vendor/assets/javascripts/nvd3/.git.sample/hooks/update.sample +128 -0
  21. data/vendor/assets/javascripts/nvd3/.git.sample/index +0 -0
  22. data/vendor/assets/javascripts/nvd3/.git.sample/info/exclude +6 -0
  23. data/vendor/assets/javascripts/nvd3/.git.sample/logs/HEAD +1 -0
  24. data/vendor/assets/javascripts/nvd3/.git.sample/logs/refs/heads/master +1 -0
  25. data/vendor/assets/javascripts/nvd3/.git.sample/logs/refs/remotes/origin/HEAD +1 -0
  26. data/vendor/assets/javascripts/nvd3/.git.sample/objects/pack/pack-babbb312d58dd7f03870b530a1b9a84c80918be3.idx +0 -0
  27. data/vendor/assets/javascripts/nvd3/.git.sample/objects/pack/pack-babbb312d58dd7f03870b530a1b9a84c80918be3.pack +0 -0
  28. data/vendor/assets/javascripts/nvd3/.git.sample/packed-refs +5 -0
  29. data/vendor/assets/javascripts/nvd3/.git.sample/refs/heads/master +1 -0
  30. data/vendor/assets/javascripts/nvd3/.git.sample/refs/remotes/origin/HEAD +1 -0
  31. data/vendor/assets/javascripts/nvd3/.gitignore +24 -0
  32. data/vendor/assets/javascripts/nvd3/LICENSE.md +49 -0
  33. data/vendor/assets/javascripts/nvd3/Makefile +56 -0
  34. data/vendor/assets/javascripts/nvd3/README.md +43 -0
  35. data/vendor/assets/javascripts/nvd3/build.bat +6 -0
  36. data/vendor/assets/javascripts/nvd3/deprecated/bar.html +198 -0
  37. data/vendor/assets/javascripts/nvd3/deprecated/bar.js +250 -0
  38. data/vendor/assets/javascripts/nvd3/deprecated/charts/cumulativeLineChart.js +174 -0
  39. data/vendor/assets/javascripts/nvd3/deprecated/charts/discreteBarChart.js +157 -0
  40. data/vendor/assets/javascripts/nvd3/deprecated/charts/lineChart.js +159 -0
  41. data/vendor/assets/javascripts/nvd3/deprecated/charts/lineChartDaily.js +168 -0
  42. data/vendor/assets/javascripts/nvd3/deprecated/charts/stackedAreaChart.js +177 -0
  43. data/vendor/assets/javascripts/nvd3/deprecated/cumulativeLine.html +171 -0
  44. data/vendor/assets/javascripts/nvd3/deprecated/cumulativeLine.js +334 -0
  45. data/vendor/assets/javascripts/nvd3/deprecated/discreteBarChartWithEnabledTooltip.html +129 -0
  46. data/vendor/assets/javascripts/nvd3/deprecated/discreteBarChartWithEnabledTooltip.js +222 -0
  47. data/vendor/assets/javascripts/nvd3/deprecated/discreteBarWithAxes.html +172 -0
  48. data/vendor/assets/javascripts/nvd3/deprecated/discreteBarWithAxes.js +152 -0
  49. data/vendor/assets/javascripts/nvd3/deprecated/lineChart-old.html +83 -0
  50. data/vendor/assets/javascripts/nvd3/deprecated/lineChartDaily.html +109 -0
  51. data/vendor/assets/javascripts/nvd3/deprecated/linePlusBar.html +173 -0
  52. data/vendor/assets/javascripts/nvd3/deprecated/linePlusBar.js +250 -0
  53. data/vendor/assets/javascripts/nvd3/deprecated/lineWithFocus.html +137 -0
  54. data/vendor/assets/javascripts/nvd3/deprecated/lineWithFocus.js +354 -0
  55. data/vendor/assets/javascripts/nvd3/deprecated/lineWithFourAxes.html +144 -0
  56. data/vendor/assets/javascripts/nvd3/deprecated/lineWithFourAxes.js +218 -0
  57. data/vendor/assets/javascripts/nvd3/deprecated/lineWithLegend.html +142 -0
  58. data/vendor/assets/javascripts/nvd3/deprecated/lineWithLegend.js +176 -0
  59. data/vendor/assets/javascripts/nvd3/deprecated/monthendAxis.html +99 -0
  60. data/vendor/assets/javascripts/nvd3/deprecated/multiBarHorizontalWithLegend.html +258 -0
  61. data/vendor/assets/javascripts/nvd3/deprecated/multiBarHorizontalWithLegend.js +226 -0
  62. data/vendor/assets/javascripts/nvd3/deprecated/multiBarWithLegend.html +162 -0
  63. data/vendor/assets/javascripts/nvd3/deprecated/multiBarWithLegend.js +249 -0
  64. data/vendor/assets/javascripts/nvd3/deprecated/pie.js +263 -0
  65. data/vendor/assets/javascripts/nvd3/deprecated/scatterChart.html +110 -0
  66. data/vendor/assets/javascripts/nvd3/deprecated/scatterChart.js +294 -0
  67. data/vendor/assets/javascripts/nvd3/deprecated/scatterFisheyeChart.js +418 -0
  68. data/vendor/assets/javascripts/nvd3/deprecated/scatterWithLegend.html +167 -0
  69. data/vendor/assets/javascripts/nvd3/deprecated/scatterWithLegend.js +261 -0
  70. data/vendor/assets/javascripts/nvd3/deprecated/stackedArea.js +286 -0
  71. data/vendor/assets/javascripts/nvd3/deprecated/stackedAreaChart.html +183 -0
  72. data/vendor/assets/javascripts/nvd3/deprecated/stackedAreaChart_old.html +137 -0
  73. data/vendor/assets/javascripts/nvd3/deprecated/stackedAreaWithLegend.html +222 -0
  74. data/vendor/assets/javascripts/nvd3/deprecated/stackedAreaWithLegend.js +297 -0
  75. data/vendor/assets/javascripts/nvd3/examples/bullet.html +96 -0
  76. data/vendor/assets/javascripts/nvd3/examples/bulletChart.html +94 -0
  77. data/vendor/assets/javascripts/nvd3/examples/crossfilter.html +167 -0
  78. data/vendor/assets/javascripts/nvd3/examples/crossfilterWithDimentions.html +180 -0
  79. data/vendor/assets/javascripts/nvd3/examples/crossfilterWithTables.html +288 -0
  80. data/vendor/assets/javascripts/nvd3/examples/cumulativeLineChart.html +155 -0
  81. data/vendor/assets/javascripts/nvd3/examples/discreteBarChart.html +116 -0
  82. data/vendor/assets/javascripts/nvd3/examples/dynamicTimeSeries.html +148 -0
  83. data/vendor/assets/javascripts/nvd3/examples/historicalBar.html +157 -0
  84. data/vendor/assets/javascripts/nvd3/examples/horizon.html +163 -0
  85. data/vendor/assets/javascripts/nvd3/examples/images/grey-minus.png +0 -0
  86. data/vendor/assets/javascripts/nvd3/examples/images/grey-plus.png +0 -0
  87. data/vendor/assets/javascripts/nvd3/examples/indentedtree.html +126 -0
  88. data/vendor/assets/javascripts/nvd3/examples/legend.html +75 -0
  89. data/vendor/assets/javascripts/nvd3/examples/line.html +95 -0
  90. data/vendor/assets/javascripts/nvd3/examples/lineChart.html +112 -0
  91. data/vendor/assets/javascripts/nvd3/examples/lineChartSVGResize.html +151 -0
  92. data/vendor/assets/javascripts/nvd3/examples/linePlusBarChart.html +114 -0
  93. data/vendor/assets/javascripts/nvd3/examples/linePlusBarWithFocusChart.html +128 -0
  94. data/vendor/assets/javascripts/nvd3/examples/lineTimeSeries.html +142 -0
  95. data/vendor/assets/javascripts/nvd3/examples/lineWithFisheyeChart.html +101 -0
  96. data/vendor/assets/javascripts/nvd3/examples/lineWithFocusChart.html +87 -0
  97. data/vendor/assets/javascripts/nvd3/examples/multiBar.html +92 -0
  98. data/vendor/assets/javascripts/nvd3/examples/multiBarChart.html +93 -0
  99. data/vendor/assets/javascripts/nvd3/examples/multiBarHorizontalChart.html +388 -0
  100. data/vendor/assets/javascripts/nvd3/examples/multiChart.html +93 -0
  101. data/vendor/assets/javascripts/nvd3/examples/nations.json +1 -0
  102. data/vendor/assets/javascripts/nvd3/examples/pie.html +93 -0
  103. data/vendor/assets/javascripts/nvd3/examples/pieChart.html +114 -0
  104. data/vendor/assets/javascripts/nvd3/examples/scatter.html +95 -0
  105. data/vendor/assets/javascripts/nvd3/examples/scatterChart.html +115 -0
  106. data/vendor/assets/javascripts/nvd3/examples/scatterPlusLineChart.html +116 -0
  107. data/vendor/assets/javascripts/nvd3/examples/sparkline.html +62 -0
  108. data/vendor/assets/javascripts/nvd3/examples/sparklinePlus.html +67 -0
  109. data/vendor/assets/javascripts/nvd3/examples/stackedArea.html +155 -0
  110. data/vendor/assets/javascripts/nvd3/examples/stackedAreaChart.html +245 -0
  111. data/vendor/assets/javascripts/nvd3/examples/stream_layers.js +35 -0
  112. data/vendor/assets/javascripts/nvd3/lib/cie.js +155 -0
  113. data/vendor/assets/javascripts/nvd3/lib/crossfilter.js +1180 -0
  114. data/vendor/assets/javascripts/nvd3/lib/crossfilter.min.js +1 -0
  115. data/vendor/assets/javascripts/nvd3/lib/d3.v2.js +7033 -0
  116. data/vendor/assets/javascripts/nvd3/lib/d3.v2.min.js +4 -0
  117. data/vendor/assets/javascripts/nvd3/lib/fisheye.js +86 -0
  118. data/vendor/assets/javascripts/nvd3/lib/hive.js +80 -0
  119. data/vendor/assets/javascripts/nvd3/lib/horizon.js +192 -0
  120. data/vendor/assets/javascripts/nvd3/lib/sankey.js +292 -0
  121. data/vendor/assets/javascripts/nvd3/nv.d3.js +11762 -0
  122. data/vendor/assets/javascripts/nvd3/src/core.js +117 -0
  123. data/vendor/assets/javascripts/nvd3/src/models/axis.js +398 -0
  124. data/vendor/assets/javascripts/nvd3/src/models/backup/bullet.js +250 -0
  125. data/vendor/assets/javascripts/nvd3/src/models/backup/bulletChart.js +349 -0
  126. data/vendor/assets/javascripts/nvd3/src/models/bullet.js +377 -0
  127. data/vendor/assets/javascripts/nvd3/src/models/bulletChart.js +341 -0
  128. data/vendor/assets/javascripts/nvd3/src/models/cumulativeLineChart.js +609 -0
  129. data/vendor/assets/javascripts/nvd3/src/models/discreteBar.js +327 -0
  130. data/vendor/assets/javascripts/nvd3/src/models/discreteBarChart.js +290 -0
  131. data/vendor/assets/javascripts/nvd3/src/models/distribution.js +146 -0
  132. data/vendor/assets/javascripts/nvd3/src/models/historicalBar.js +289 -0
  133. data/vendor/assets/javascripts/nvd3/src/models/indentedTree.js +306 -0
  134. data/vendor/assets/javascripts/nvd3/src/models/legend.js +203 -0
  135. data/vendor/assets/javascripts/nvd3/src/models/line.js +286 -0
  136. data/vendor/assets/javascripts/nvd3/src/models/lineChart.js +359 -0
  137. data/vendor/assets/javascripts/nvd3/src/models/lineDynTimeSeriesChart.js +434 -0
  138. data/vendor/assets/javascripts/nvd3/src/models/linePlusBarChart.js +422 -0
  139. data/vendor/assets/javascripts/nvd3/src/models/linePlusBarWithFocusChart.js +657 -0
  140. data/vendor/assets/javascripts/nvd3/src/models/lineTimeSeriesChart.js +340 -0
  141. data/vendor/assets/javascripts/nvd3/src/models/lineWithFisheye.js +197 -0
  142. data/vendor/assets/javascripts/nvd3/src/models/lineWithFisheyeChart.js +324 -0
  143. data/vendor/assets/javascripts/nvd3/src/models/lineWithFocusChart.js +565 -0
  144. data/vendor/assets/javascripts/nvd3/src/models/multiAxisLineChart.js +312 -0
  145. data/vendor/assets/javascripts/nvd3/src/models/multiBar.js +416 -0
  146. data/vendor/assets/javascripts/nvd3/src/models/multiBarChart.js +445 -0
  147. data/vendor/assets/javascripts/nvd3/src/models/multiBarHorizontal.js +420 -0
  148. data/vendor/assets/javascripts/nvd3/src/models/multiBarHorizontalChart.js +415 -0
  149. data/vendor/assets/javascripts/nvd3/src/models/multiBarTimeSeries.js +371 -0
  150. data/vendor/assets/javascripts/nvd3/src/models/multiBarTimeSeriesChart.js +403 -0
  151. data/vendor/assets/javascripts/nvd3/src/models/multiChart.js +444 -0
  152. data/vendor/assets/javascripts/nvd3/src/models/ohlcBar.js +365 -0
  153. data/vendor/assets/javascripts/nvd3/src/models/pie.js +358 -0
  154. data/vendor/assets/javascripts/nvd3/src/models/pieChart.js +281 -0
  155. data/vendor/assets/javascripts/nvd3/src/models/scatter.js +622 -0
  156. data/vendor/assets/javascripts/nvd3/src/models/scatterChart.js +576 -0
  157. data/vendor/assets/javascripts/nvd3/src/models/scatterPlusLineChart.js +577 -0
  158. data/vendor/assets/javascripts/nvd3/src/models/sparkline.js +179 -0
  159. data/vendor/assets/javascripts/nvd3/src/models/sparklinePlus.js +291 -0
  160. data/vendor/assets/javascripts/nvd3/src/models/stackedArea.js +336 -0
  161. data/vendor/assets/javascripts/nvd3/src/models/stackedAreaChart.js +453 -0
  162. data/vendor/assets/javascripts/nvd3/src/nv.d3.css +671 -0
  163. data/vendor/assets/javascripts/nvd3/src/tooltip.js +129 -0
  164. data/vendor/assets/javascripts/nvd3/src/utils.js +105 -0
  165. data/vendor/assets/javascripts/set-nvd3-env.js.erb +5 -0
  166. data/vendor/assets/stylesheets/nvd3-rails.css +3 -0
  167. metadata +233 -0
@@ -0,0 +1,403 @@
1
+ nv.models.multiBarTimeSeriesChart = function() {
2
+
3
+ //============================================================
4
+ // Public Variables with Default Settings
5
+ //------------------------------------------------------------
6
+
7
+ var multibar = nv.models.multiBarTimeSeries()
8
+ , xAxis = nv.models.axis()
9
+ , yAxis = nv.models.axis()
10
+ , legend = nv.models.legend()
11
+ , controls = nv.models.legend()
12
+ ;
13
+
14
+ var margin = {top: 30, right: 20, bottom: 50, left: 60}
15
+ , width = null
16
+ , height = null
17
+ , color = nv.utils.defaultColor()
18
+ , showControls = true
19
+ , showLegend = true
20
+ , reduceXTicks = true // if false a tick will show for every data point
21
+ , rotateLabels = 0
22
+ , tooltips = true
23
+ , tooltip = function(key, x, y, e, graph) {
24
+ return '<h3>' + key + '</h3>' +
25
+ '<p>' + y + ' on ' + x + '</p>'
26
+ }
27
+ , x //can be accessed via chart.xScale()
28
+ , y //can be accessed via chart.yScale()
29
+ , noData = "No Data Available."
30
+ , dispatch = d3.dispatch('tooltipShow', 'tooltipHide')
31
+ ;
32
+
33
+ multibar
34
+ .stacked(false)
35
+ ;
36
+ xAxis
37
+ .orient('bottom')
38
+ .tickPadding(7)
39
+ .highlightZero(false)
40
+ .showMaxMin(false)
41
+ ;
42
+ yAxis
43
+ .orient('left')
44
+ .tickFormat(d3.format(',.1f'))
45
+ ;
46
+
47
+ //============================================================
48
+
49
+
50
+ //============================================================
51
+ // Private Variables
52
+ //------------------------------------------------------------
53
+
54
+ var showTooltip = function(e, offsetElement) {
55
+ var left = e.pos[0] + ( offsetElement.offsetLeft || 0 ),
56
+ top = e.pos[1] + ( offsetElement.offsetTop || 0),
57
+ x = xAxis.tickFormat()(multibar.x()(e.point, e.pointIndex)),
58
+ y = yAxis.tickFormat()(multibar.y()(e.point, e.pointIndex)),
59
+ content = tooltip(e.series.key, x, y, e, chart);
60
+
61
+ nv.tooltip.show([left, top], content, e.value < 0 ? 'n' : 's', null, offsetElement);
62
+ };
63
+
64
+ //============================================================
65
+
66
+
67
+ function chart(selection) {
68
+ selection.each(function(data) {
69
+ var container = d3.select(this),
70
+ that = this;
71
+
72
+ var availableWidth = (width || parseInt(container.style('width')) || 960)
73
+ - margin.left - margin.right,
74
+ availableHeight = (height || parseInt(container.style('height')) || 400)
75
+ - margin.top - margin.bottom;
76
+
77
+ chart.update = function() { selection.transition().call(chart) };
78
+ chart.container = this;
79
+
80
+
81
+ //------------------------------------------------------------
82
+ // Display noData message if there's nothing to show.
83
+
84
+ if (!data || !data.length || !data.filter(function(d) { return d.values.length }).length) {
85
+ var noDataText = container.selectAll('.nv-noData').data([noData]);
86
+
87
+ noDataText.enter().append('text')
88
+ .attr('class', 'nvd3 nv-noData')
89
+ .attr('dy', '-.7em')
90
+ .style('text-anchor', 'middle');
91
+
92
+ noDataText
93
+ .attr('x', margin.left + availableWidth / 2)
94
+ .attr('y', margin.top + availableHeight / 2)
95
+ .text(function(d) { return d });
96
+
97
+ return chart;
98
+ } else {
99
+ container.selectAll('.nv-noData').remove();
100
+ }
101
+
102
+ //------------------------------------------------------------
103
+
104
+
105
+ //------------------------------------------------------------
106
+ // Setup Scales
107
+
108
+ x = multibar.xScale();
109
+ y = multibar.yScale();
110
+
111
+ //------------------------------------------------------------
112
+
113
+
114
+ //------------------------------------------------------------
115
+ // Setup containers and skeleton of chart
116
+
117
+ var wrap = container.selectAll('g.nv-wrap.nv-multiBarWithLegend').data([data]);
118
+ var gEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-multiBarWithLegend').append('g');
119
+ var g = wrap.select('g');
120
+
121
+ gEnter.append('g').attr('class', 'nv-x nv-axis');
122
+ gEnter.append('g').attr('class', 'nv-y nv-axis');
123
+ gEnter.append('g').attr('class', 'nv-barsWrap');
124
+ gEnter.append('g').attr('class', 'nv-legendWrap');
125
+ gEnter.append('g').attr('class', 'nv-controlsWrap');
126
+
127
+ //------------------------------------------------------------
128
+
129
+
130
+ //------------------------------------------------------------
131
+ // Legend
132
+
133
+ if (showLegend) {
134
+ legend.width(availableWidth / 2);
135
+
136
+ g.select('.nv-legendWrap')
137
+ .datum(data)
138
+ .call(legend);
139
+
140
+ if ( margin.top != legend.height()) {
141
+ margin.top = legend.height();
142
+ availableHeight = (height || parseInt(container.style('height')) || 400)
143
+ - margin.top - margin.bottom;
144
+ }
145
+
146
+ g.select('.nv-legendWrap')
147
+ .attr('transform', 'translate(' + (availableWidth / 2) + ',' + (-margin.top) +')');
148
+ }
149
+
150
+ //------------------------------------------------------------
151
+
152
+
153
+ //------------------------------------------------------------
154
+ // Controls
155
+
156
+ if (showControls) {
157
+ var controlsData = [
158
+ { key: 'Grouped', disabled: multibar.stacked() },
159
+ { key: 'Stacked', disabled: !multibar.stacked() }
160
+ ];
161
+
162
+ controls.width(180).color(['#444', '#444', '#444']);
163
+ g.select('.nv-controlsWrap')
164
+ .datum(controlsData)
165
+ .attr('transform', 'translate(0,' + (-margin.top) +')')
166
+ .call(controls);
167
+ }
168
+
169
+ //------------------------------------------------------------
170
+
171
+
172
+ wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
173
+
174
+
175
+ //------------------------------------------------------------
176
+ // Main Chart Component(s)
177
+
178
+ multibar
179
+ .width(availableWidth)
180
+ .height(availableHeight)
181
+ .color(data.map(function(d,i) {
182
+ return d.color || color(d, i);
183
+ }).filter(function(d,i) { return !data[i].disabled }))
184
+
185
+
186
+ var barsWrap = g.select('.nv-barsWrap')
187
+ .datum(data.filter(function(d) { return !d.disabled }))
188
+
189
+ d3.transition(barsWrap).call(multibar);
190
+
191
+ //------------------------------------------------------------
192
+
193
+
194
+ //------------------------------------------------------------
195
+ // Setup Axes
196
+
197
+ xAxis
198
+ .scale(x)
199
+ .ticks(availableWidth / 100)
200
+ .tickSize(-availableHeight, 0);
201
+
202
+ g.select('.nv-x.nv-axis')
203
+ .attr('transform', 'translate(0,' + y.range()[0] + ')');
204
+ d3.transition(g.select('.nv-x.nv-axis'))
205
+ .call(xAxis);
206
+
207
+ var xTicks = g.select('.nv-x.nv-axis > g').selectAll('g');
208
+
209
+ xTicks
210
+ .selectAll('line, text')
211
+ .style('opacity', 1)
212
+
213
+ if (reduceXTicks)
214
+ xTicks
215
+ .filter(function(d,i) {
216
+ return i % Math.ceil(data[0].values.length / (availableWidth / 100)) !== 0;
217
+ })
218
+ .selectAll('text, line')
219
+ .style('opacity', 0);
220
+
221
+ if(rotateLabels)
222
+ xTicks
223
+ .selectAll('text')
224
+ .attr('transform', function(d,i,j) { return 'rotate('+rotateLabels+' 0,0)' })
225
+ .attr('text-transform', rotateLabels > 0 ? 'start' : 'end');
226
+
227
+ yAxis
228
+ .scale(y)
229
+ .ticks( availableHeight / 36 )
230
+ .tickSize( -availableWidth, 0);
231
+
232
+ d3.transition(g.select('.nv-y.nv-axis'))
233
+ .call(yAxis);
234
+
235
+ //------------------------------------------------------------
236
+
237
+
238
+
239
+ //============================================================
240
+ // Event Handling/Dispatching (in chart's scope)
241
+ //------------------------------------------------------------
242
+
243
+ legend.dispatch.on('legendClick', function(d,i) {
244
+ d.disabled = !d.disabled;
245
+
246
+ if (!data.filter(function(d) { return !d.disabled }).length) {
247
+ data.map(function(d) {
248
+ d.disabled = false;
249
+ wrap.selectAll('.nv-series').classed('disabled', false);
250
+ return d;
251
+ });
252
+ }
253
+
254
+ selection.transition().call(chart);
255
+ });
256
+
257
+ controls.dispatch.on('legendClick', function(d,i) {
258
+ if (!d.disabled) return;
259
+ controlsData = controlsData.map(function(s) {
260
+ s.disabled = true;
261
+ return s;
262
+ });
263
+ d.disabled = false;
264
+
265
+ switch (d.key) {
266
+ case 'Grouped':
267
+ multibar.stacked(false);
268
+ break;
269
+ case 'Stacked':
270
+ multibar.stacked(true);
271
+ break;
272
+ }
273
+
274
+ selection.transition().call(chart);
275
+ });
276
+
277
+ dispatch.on('tooltipShow', function(e) {
278
+ if (tooltips) showTooltip(e, that.parentNode)
279
+ });
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
+ multibar.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
+ multibar.dispatch.on('elementMouseout.tooltip', function(e) {
300
+ dispatch.tooltipHide(e);
301
+ });
302
+ dispatch.on('tooltipHide', function() {
303
+ if (tooltips) nv.tooltip.cleanup();
304
+ });
305
+
306
+ //============================================================
307
+
308
+
309
+ //============================================================
310
+ // Expose Public Variables
311
+ //------------------------------------------------------------
312
+
313
+ // expose chart's sub-components
314
+ chart.dispatch = dispatch;
315
+ chart.multibar = multibar;
316
+ chart.legend = legend;
317
+ chart.xAxis = xAxis;
318
+ chart.yAxis = yAxis;
319
+
320
+ d3.rebind(chart, multibar, 'x', 'y', 'xDomain', 'yDomain', 'forceX', 'forceY', 'clipEdge', 'id', 'stacked', 'delay');
321
+
322
+ chart.margin = function(_) {
323
+ if (!arguments.length) return margin;
324
+ margin.top = typeof _.top != 'undefined' ? _.top : margin.top;
325
+ margin.right = typeof _.right != 'undefined' ? _.right : margin.right;
326
+ margin.bottom = typeof _.bottom != 'undefined' ? _.bottom : margin.bottom;
327
+ margin.left = typeof _.left != 'undefined' ? _.left : margin.left;
328
+ return chart;
329
+ };
330
+
331
+ chart.width = function(_) {
332
+ if (!arguments.length) return width;
333
+ width = _;
334
+ return chart;
335
+ };
336
+
337
+ chart.height = function(_) {
338
+ if (!arguments.length) return height;
339
+ height = _;
340
+ return chart;
341
+ };
342
+
343
+ chart.color = function(_) {
344
+ if (!arguments.length) return color;
345
+ color = nv.utils.getColor(_);
346
+ legend.color(color);
347
+ return chart;
348
+ };
349
+
350
+ chart.showControls = function(_) {
351
+ if (!arguments.length) return showControls;
352
+ showControls = _;
353
+ return chart;
354
+ };
355
+
356
+ chart.showLegend = function(_) {
357
+ if (!arguments.length) return showLegend;
358
+ showLegend = _;
359
+ return chart;
360
+ };
361
+
362
+ chart.reduceXTicks= function(_) {
363
+ if (!arguments.length) return reduceXTicks;
364
+ reduceXTicks = _;
365
+ return chart;
366
+ };
367
+
368
+ chart.rotateLabels = function(_) {
369
+ if (!arguments.length) return rotateLabels;
370
+ rotateLabels = _;
371
+ return chart;
372
+ }
373
+
374
+ chart.tooltip = function(_) {
375
+ if (!arguments.length) return tooltip;
376
+ tooltip = _;
377
+ return chart;
378
+ };
379
+
380
+ chart.tooltips = function(_) {
381
+ if (!arguments.length) return tooltips;
382
+ tooltips = _;
383
+ return chart;
384
+ };
385
+
386
+ chart.tooltipContent = function(_) {
387
+ if (!arguments.length) return tooltip;
388
+ tooltip = _;
389
+ return chart;
390
+ };
391
+
392
+ chart.noData = function(_) {
393
+ if (!arguments.length) return noData;
394
+ noData = _;
395
+ return chart;
396
+ };
397
+
398
+ //============================================================
399
+
400
+
401
+ return chart;
402
+ }
403
+
@@ -0,0 +1,444 @@
1
+ nv.models.multiChart = function() {
2
+
3
+ //============================================================
4
+ // Public Variables with Default Settings
5
+ //------------------------------------------------------------
6
+
7
+ var margin = {top: 30, right: 20, bottom: 50, left: 60},
8
+ color = d3.scale.category20().range(),
9
+ width = null,
10
+ height = null,
11
+ showLegend = true,
12
+ tooltips = true,
13
+ tooltip = function(key, x, y, e, graph) {
14
+ return '<h3>' + key + '</h3>' +
15
+ '<p>' + y + ' at ' + x + '</p>'
16
+ },
17
+ x, y; //can be accessed via chart.lines.[x/y]Scale()
18
+
19
+ //============================================================
20
+ // Private Variables
21
+ //------------------------------------------------------------
22
+
23
+ var x = d3.scale.linear(),
24
+ yScale1 = d3.scale.linear(),
25
+ yScale2 = d3.scale.linear(),
26
+
27
+ lines1 = nv.models.line().yScale(yScale1),
28
+ lines2 = nv.models.line().yScale(yScale2),
29
+
30
+ bars1 = nv.models.multiBar().stacked(false).yScale(yScale1),
31
+ bars2 = nv.models.multiBar().stacked(false).yScale(yScale2),
32
+
33
+ stack1 = nv.models.stackedArea().yScale(yScale1),
34
+ stack2 = nv.models.stackedArea().yScale(yScale2),
35
+
36
+ xAxis = nv.models.axis().scale(x).orient('bottom').tickPadding(5),
37
+ yAxis1 = nv.models.axis().scale(yScale1).orient('left'),
38
+ yAxis2 = nv.models.axis().scale(yScale2).orient('right'),
39
+
40
+ legend = nv.models.legend().height(30),
41
+ dispatch = d3.dispatch('tooltipShow', 'tooltipHide');
42
+
43
+ var showTooltip = function(e, offsetElement) {
44
+ var left = e.pos[0] + ( offsetElement.offsetLeft || 0 ),
45
+ top = e.pos[1] + ( offsetElement.offsetTop || 0),
46
+ x = xAxis.tickFormat()(lines1.x()(e.point, e.pointIndex)),
47
+ y = (e.series.bar ? yAxis1 : yAxis2).tickFormat()(lines1.y()(e.point, e.pointIndex)),
48
+ content = tooltip(e.series.key, x, y, e, chart);
49
+
50
+ nv.tooltip.show([left, top], content, undefined, undefined, offsetElement.offsetParent);
51
+ };
52
+
53
+ function chart(selection) {
54
+ selection.each(function(data) {
55
+ var container = d3.select(this),
56
+ that = this;
57
+
58
+ var availableWidth = (width || parseInt(container.style('width')) || 960)
59
+ - margin.left - margin.right,
60
+ availableHeight = (height || parseInt(container.style('height')) || 400)
61
+ - margin.top - margin.bottom;
62
+
63
+ var dataLines1 = data.filter(function(d) {return !d.disabled && d.type == 'line' && d.yAxis == 1})
64
+ var dataLines2 = data.filter(function(d) {return !d.disabled && d.type == 'line' && d.yAxis == 2})
65
+ var dataBars1 = data.filter(function(d) {return !d.disabled && d.type == 'bar' && d.yAxis == 1})
66
+ var dataBars2 = data.filter(function(d) {return !d.disabled && d.type == 'bar' && d.yAxis == 2})
67
+ var dataStack1 = data.filter(function(d) {return !d.disabled && d.type == 'area' && d.yAxis == 1})
68
+ var dataStack2 = data.filter(function(d) {return !d.disabled && d.type == 'area' && d.yAxis == 2})
69
+
70
+ var series1 = data.filter(function(d) {return !d.disabled && d.yAxis == 1})
71
+ .map(function(d) {
72
+ return d.values.map(function(d,i) {
73
+ return { x: d.x, y: d.y }
74
+ })
75
+ })
76
+
77
+ var series2 = data.filter(function(d) {return !d.disabled && d.yAxis == 2})
78
+ .map(function(d) {
79
+ return d.values.map(function(d,i) {
80
+ return { x: d.x, y: d.y }
81
+ })
82
+ })
83
+
84
+ x .domain(d3.extent(d3.merge(series1.concat(series2)), function(d) { return d.x } ))
85
+ .range([0, availableWidth]);
86
+
87
+ var wrap = container.selectAll('g.wrap.multiChart').data([data]);
88
+ var gEnter = wrap.enter().append('g').attr('class', 'wrap nvd3 multiChart').append('g');
89
+
90
+ gEnter.append('g').attr('class', 'x axis');
91
+ gEnter.append('g').attr('class', 'y1 axis');
92
+ gEnter.append('g').attr('class', 'y2 axis');
93
+ gEnter.append('g').attr('class', 'lines1Wrap');
94
+ gEnter.append('g').attr('class', 'lines2Wrap');
95
+ gEnter.append('g').attr('class', 'bars1Wrap');
96
+ gEnter.append('g').attr('class', 'bars2Wrap');
97
+ gEnter.append('g').attr('class', 'stack1Wrap');
98
+ gEnter.append('g').attr('class', 'stack2Wrap');
99
+ gEnter.append('g').attr('class', 'legendWrap');
100
+
101
+ var g = wrap.select('g');
102
+
103
+ if (showLegend) {
104
+ legend.width( availableWidth / 2 );
105
+
106
+ g.select('.legendWrap')
107
+ .datum(data.map(function(series) {
108
+ series.originalKey = series.originalKey === undefined ? series.key : series.originalKey;
109
+ series.key = series.originalKey + (series.yAxis == 1 ? '' : ' (right axis)');
110
+ return series;
111
+ }))
112
+ .call(legend);
113
+
114
+ if ( margin.top != legend.height()) {
115
+ margin.top = legend.height();
116
+ availableHeight = (height || parseInt(container.style('height')) || 400)
117
+ - margin.top - margin.bottom;
118
+ }
119
+
120
+ g.select('.legendWrap')
121
+ .attr('transform', 'translate(' + ( availableWidth / 2 ) + ',' + (-margin.top) +')');
122
+ }
123
+
124
+
125
+ lines1
126
+ .width(availableWidth)
127
+ .height(availableHeight)
128
+ .interpolate("monotone")
129
+ .color(data.map(function(d,i) {
130
+ return d.color || color[i % color.length];
131
+ }).filter(function(d,i) { return !data[i].disabled && data[i].yAxis == 1 && data[i].type == 'line'}));
132
+
133
+ lines2
134
+ .width(availableWidth)
135
+ .height(availableHeight)
136
+ .interpolate("monotone")
137
+ .color(data.map(function(d,i) {
138
+ return d.color || color[i % color.length];
139
+ }).filter(function(d,i) { return !data[i].disabled && data[i].yAxis == 2 && data[i].type == 'line'}));
140
+
141
+ bars1
142
+ .width(availableWidth)
143
+ .height(availableHeight)
144
+ .color(data.map(function(d,i) {
145
+ return d.color || color[i % color.length];
146
+ }).filter(function(d,i) { return !data[i].disabled && data[i].yAxis == 1 && data[i].type == 'bar'}));
147
+
148
+ bars2
149
+ .width(availableWidth)
150
+ .height(availableHeight)
151
+ .color(data.map(function(d,i) {
152
+ return d.color || color[i % color.length];
153
+ }).filter(function(d,i) { return !data[i].disabled && data[i].yAxis == 2 && data[i].type == 'bar'}));
154
+
155
+ stack1
156
+ .width(availableWidth)
157
+ .height(availableHeight)
158
+ .color(data.map(function(d,i) {
159
+ return d.color || color[i % color.length];
160
+ }).filter(function(d,i) { return !data[i].disabled && data[i].yAxis == 1 && data[i].type == 'area'}));
161
+
162
+ stack2
163
+ .width(availableWidth)
164
+ .height(availableHeight)
165
+ .color(data.map(function(d,i) {
166
+ return d.color || color[i % color.length];
167
+ }).filter(function(d,i) { return !data[i].disabled && data[i].yAxis == 2 && data[i].type == 'area'}));
168
+
169
+ g.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
170
+
171
+
172
+ var lines1Wrap = g.select('.lines1Wrap')
173
+ .datum(dataLines1)
174
+ var bars1Wrap = g.select('.bars1Wrap')
175
+ .datum(dataBars1)
176
+ var stack1Wrap = g.select('.stack1Wrap')
177
+ .datum(dataStack1)
178
+
179
+ var lines2Wrap = g.select('.lines2Wrap')
180
+ .datum(dataLines2)
181
+ var bars2Wrap = g.select('.bars2Wrap')
182
+ .datum(dataBars2)
183
+ var stack2Wrap = g.select('.stack2Wrap')
184
+ .datum(dataStack2)
185
+
186
+ var extraValue1 = dataStack1.length ? dataStack1.map(function(a){return a.values}).reduce(function(a,b){
187
+ return a.map(function(aVal,i){return {x: aVal.x, y: aVal.y + b[i].y}})
188
+ }).concat([{x:0, y:0}]) : []
189
+ var extraValue2 = dataStack2.length ? dataStack2.map(function(a){return a.values}).reduce(function(a,b){
190
+ return a.map(function(aVal,i){return {x: aVal.x, y: aVal.y + b[i].y}})
191
+ }).concat([{x:0, y:0}]) : []
192
+
193
+ yScale1 .domain(d3.extent(d3.extent(d3.merge(series1).concat(extraValue1), function(d) { return d.y } ).concat(lines1.forceY())))
194
+ .range([0, availableHeight])
195
+
196
+ yScale2 .domain(d3.extent(d3.extent(d3.merge(series2).concat(extraValue2), function(d) { return d.y } ).concat(lines2.forceY())))
197
+ .range([0, availableHeight])
198
+
199
+ lines1.yDomain(yScale1.domain())
200
+ bars1.yDomain(yScale1.domain())
201
+ stack1.yDomain(yScale1.domain())
202
+
203
+ lines2.yDomain(yScale2.domain())
204
+ bars2.yDomain(yScale2.domain())
205
+ stack2.yDomain(yScale2.domain())
206
+
207
+ if(dataStack1.length){d3.transition(stack1Wrap).call(stack1);}
208
+ if(dataStack2.length){d3.transition(stack2Wrap).call(stack2);}
209
+
210
+ if(dataBars1.length){d3.transition(bars1Wrap).call(bars1);}
211
+ if(dataBars2.length){d3.transition(bars2Wrap).call(bars2);}
212
+
213
+ if(dataLines1.length){d3.transition(lines1Wrap).call(lines1);}
214
+ if(dataLines2.length){d3.transition(lines2Wrap).call(lines2);}
215
+
216
+
217
+
218
+ xAxis
219
+ .ticks( availableWidth / 100 )
220
+ .tickSize(-availableHeight, 0);
221
+
222
+ g.select('.x.axis')
223
+ .attr('transform', 'translate(0,' + availableHeight + ')');
224
+ d3.transition(g.select('.x.axis'))
225
+ .call(xAxis);
226
+
227
+ yAxis1
228
+ .ticks( availableHeight / 36 )
229
+ .tickSize( -availableWidth, 0);
230
+
231
+
232
+ d3.transition(g.select('.y1.axis'))
233
+ .call(yAxis1);
234
+
235
+ yAxis2
236
+ .ticks( availableHeight / 36 )
237
+ .tickSize( -availableWidth, 0);
238
+
239
+ d3.transition(g.select('.y2.axis'))
240
+ .call(yAxis2);
241
+
242
+ g.select('.y2.axis')
243
+ .style('opacity', series2.length ? 1 : 0)
244
+ .attr('transform', 'translate(' + x.range()[1] + ',0)');
245
+
246
+ legend.dispatch.on('legendClick', function(d,i) {
247
+ d.disabled = !d.disabled;
248
+
249
+ if (!data.filter(function(d) { return !d.disabled }).length) {
250
+ data.map(function(d) {
251
+ d.disabled = false;
252
+ wrap.selectAll('.series').classed('disabled', false);
253
+ return d;
254
+ });
255
+ }
256
+ selection.transition().call(chart);
257
+ });
258
+
259
+ dispatch.on('tooltipShow', function(e) {
260
+ if (tooltips) showTooltip(e, that.parentNode);
261
+ });
262
+
263
+ });
264
+
265
+ chart.update = function() { chart(selection) };
266
+ chart.container = this;
267
+
268
+ return chart;
269
+ }
270
+
271
+
272
+ //============================================================
273
+ // Event Handling/Dispatching (out of chart's scope)
274
+ //------------------------------------------------------------
275
+
276
+ lines1.dispatch.on('elementMouseover.tooltip', function(e) {
277
+ e.pos = [e.pos[0] + margin.left, e.pos[1] + margin.top];
278
+ dispatch.tooltipShow(e);
279
+ });
280
+
281
+ lines1.dispatch.on('elementMouseout.tooltip', function(e) {
282
+ dispatch.tooltipHide(e);
283
+ });
284
+
285
+ lines2.dispatch.on('elementMouseover.tooltip', function(e) {
286
+ e.pos = [e.pos[0] + margin.left, e.pos[1] + margin.top];
287
+ dispatch.tooltipShow(e);
288
+ });
289
+
290
+ lines2.dispatch.on('elementMouseout.tooltip', function(e) {
291
+ dispatch.tooltipHide(e);
292
+ });
293
+
294
+ bars1.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
+ bars1.dispatch.on('elementMouseout.tooltip', function(e) {
300
+ dispatch.tooltipHide(e);
301
+ });
302
+
303
+ bars2.dispatch.on('elementMouseover.tooltip', function(e) {
304
+ e.pos = [e.pos[0] + margin.left, e.pos[1] + margin.top];
305
+ dispatch.tooltipShow(e);
306
+ });
307
+
308
+ bars2.dispatch.on('elementMouseout.tooltip', function(e) {
309
+ dispatch.tooltipHide(e);
310
+ });
311
+
312
+ stack1.dispatch.on('tooltipShow', function(e) {
313
+ //disable tooltips when value ~= 0
314
+ //// TODO: consider removing points from voronoi that have 0 value instead of this hack
315
+ if (!Math.round(stack1.y()(e.point) * 100)) { // 100 will not be good for very small numbers... will have to think about making this valu dynamic, based on data range
316
+ setTimeout(function() { d3.selectAll('.point.hover').classed('hover', false) }, 0);
317
+ return false;
318
+ }
319
+
320
+ e.pos = [e.pos[0] + margin.left, e.pos[1] + margin.top],
321
+ dispatch.tooltipShow(e);
322
+ });
323
+
324
+ stack1.dispatch.on('tooltipHide', function(e) {
325
+ dispatch.tooltipHide(e);
326
+ });
327
+
328
+ stack2.dispatch.on('tooltipShow', function(e) {
329
+ //disable tooltips when value ~= 0
330
+ //// TODO: consider removing points from voronoi that have 0 value instead of this hack
331
+ if (!Math.round(stack2.y()(e.point) * 100)) { // 100 will not be good for very small numbers... will have to think about making this valu dynamic, based on data range
332
+ setTimeout(function() { d3.selectAll('.point.hover').classed('hover', false) }, 0);
333
+ return false;
334
+ }
335
+
336
+ e.pos = [e.pos[0] + margin.left, e.pos[1] + margin.top],
337
+ dispatch.tooltipShow(e);
338
+ });
339
+
340
+ stack2.dispatch.on('tooltipHide', function(e) {
341
+ dispatch.tooltipHide(e);
342
+ });
343
+
344
+ lines1.dispatch.on('elementMouseover.tooltip', function(e) {
345
+ e.pos = [e.pos[0] + margin.left, e.pos[1] + margin.top];
346
+ dispatch.tooltipShow(e);
347
+ });
348
+
349
+ lines1.dispatch.on('elementMouseout.tooltip', function(e) {
350
+ dispatch.tooltipHide(e);
351
+ });
352
+
353
+ lines2.dispatch.on('elementMouseover.tooltip', function(e) {
354
+ e.pos = [e.pos[0] + margin.left, e.pos[1] + margin.top];
355
+ dispatch.tooltipShow(e);
356
+ });
357
+
358
+ lines2.dispatch.on('elementMouseout.tooltip', function(e) {
359
+ dispatch.tooltipHide(e);
360
+ });
361
+
362
+ dispatch.on('tooltipHide', function() {
363
+ if (tooltips) nv.tooltip.cleanup();
364
+ });
365
+
366
+
367
+
368
+ //============================================================
369
+ // Global getters and setters
370
+ //------------------------------------------------------------
371
+
372
+ chart.dispatch = dispatch;
373
+ chart.lines1 = lines1;
374
+ chart.lines2 = lines2;
375
+ chart.bars1 = bars1;
376
+ chart.bars2 = bars2;
377
+ chart.stack1 = stack1;
378
+ chart.stack2 = stack2;
379
+ chart.xAxis = xAxis;
380
+ chart.yAxis1 = yAxis1;
381
+ chart.yAxis2 = yAxis2;
382
+
383
+ chart.x = function(_) {
384
+ if (!arguments.length) return getX;
385
+ getX = _;
386
+ lines1.x(_);
387
+ bars1.x(_);
388
+ return chart;
389
+ };
390
+
391
+ chart.y = function(_) {
392
+ if (!arguments.length) return getY;
393
+ getY = _;
394
+ lines1.y(_);
395
+ bars1.y(_);
396
+ return chart;
397
+ };
398
+
399
+ chart.margin = function(_) {
400
+ if (!arguments.length) return margin;
401
+ margin = _;
402
+ return chart;
403
+ };
404
+
405
+ chart.width = function(_) {
406
+ if (!arguments.length) return width;
407
+ width = _;
408
+ return chart;
409
+ };
410
+
411
+ chart.height = function(_) {
412
+ if (!arguments.length) return height;
413
+ height = _;
414
+ return chart;
415
+ };
416
+
417
+ chart.color = function(_) {
418
+ if (!arguments.length) return color;
419
+ color = _;
420
+ legend.color(_);
421
+ return chart;
422
+ };
423
+
424
+ chart.showLegend = function(_) {
425
+ if (!arguments.length) return showLegend;
426
+ showLegend = _;
427
+ return chart;
428
+ };
429
+
430
+ chart.tooltips = function(_) {
431
+ if (!arguments.length) return tooltips;
432
+ tooltips = _;
433
+ return chart;
434
+ };
435
+
436
+ chart.tooltipContent = function(_) {
437
+ if (!arguments.length) return tooltip;
438
+ tooltip = _;
439
+ return chart;
440
+ };
441
+
442
+ return chart;
443
+ }
444
+