1 //TODO: consider deprecating and using multibar with single series for this
2 nv.models.historicalBar = function() {
4 //============================================================
5 // Public Variables with Default Settings
6 //------------------------------------------------------------
8 var margin = {top: 0, right: 0, bottom: 0, left: 0}
11 , id = Math.floor(Math.random() * 10000) //Create semi-unique ID in case user doesn't select one
12 , x = d3.scale.linear()
13 , y = d3.scale.linear()
14 , getX = function(d) { return d.x }
15 , getY = function(d) { return d.y }
20 , color = nv.utils.defaultColor()
25 , dispatch = d3.dispatch('chartClick', 'elementClick', 'elementDblClick', 'elementMouseover', 'elementMouseout')
29 //============================================================
32 function chart(selection) {
33 selection.each(function(data) {
34 var availableWidth = width - margin.left - margin.right,
35 availableHeight = height - margin.top - margin.bottom,
36 container = d3.select(this);
39 //------------------------------------------------------------
42 x .domain(xDomain || d3.extent(data[0].values.map(getX).concat(forceX) ))
45 x.range(xRange || [availableWidth * .5 / data[0].values.length, availableWidth * (data[0].values.length - .5) / data[0].values.length ]);
47 x.range(xRange || [0, availableWidth]);
49 y .domain(yDomain || d3.extent(data[0].values.map(getY).concat(forceY) ))
50 .range(yRange || [availableHeight, 0]);
52 // If scale's domain don't have a range, slightly adjust to make one... so a chart can show a single data point
54 if (x.domain()[0] === x.domain()[1])
56 x.domain([x.domain()[0] - x.domain()[0] * 0.01, x.domain()[1] + x.domain()[1] * 0.01])
59 if (y.domain()[0] === y.domain()[1])
61 y.domain([y.domain()[0] + y.domain()[0] * 0.01, y.domain()[1] - y.domain()[1] * 0.01])
64 //------------------------------------------------------------
67 //------------------------------------------------------------
68 // Setup containers and skeleton of chart
70 var wrap = container.selectAll('g.nv-wrap.nv-historicalBar-' + id).data([data[0].values]);
71 var wrapEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-historicalBar-' + id);
72 var defsEnter = wrapEnter.append('defs');
73 var gEnter = wrapEnter.append('g');
74 var g = wrap.select('g');
76 gEnter.append('g').attr('class', 'nv-bars');
78 wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
80 //------------------------------------------------------------
84 .on('click', function(d,i) {
94 defsEnter.append('clipPath')
95 .attr('id', 'nv-chart-clip-path-' + id)
98 wrap.select('#nv-chart-clip-path-' + id + ' rect')
99 .attr('width', availableWidth)
100 .attr('height', availableHeight);
102 g .attr('clip-path', clipEdge ? 'url(#nv-chart-clip-path-' + id + ')' : '');
106 var bars = wrap.select('.nv-bars').selectAll('.nv-bar')
107 .data(function(d) { return d }, function(d,i) {return getX(d,i)});
109 bars.exit().remove();
112 var barsEnter = bars.enter().append('rect')
113 //.attr('class', function(d,i,j) { return (getY(d,i) < 0 ? 'nv-bar negative' : 'nv-bar positive') + ' nv-bar-' + j + '-' + i })
115 .attr('y', function(d,i) { return nv.utils.NaNtoZero(y(Math.max(0, getY(d,i)))) })
116 .attr('height', function(d,i) { return nv.utils.NaNtoZero(Math.abs(y(getY(d,i)) - y(0))) })
117 .attr('transform', function(d,i) { return 'translate(' + (x(getX(d,i)) - availableWidth / data[0].values.length * .45) + ',0)'; })
118 .on('mouseover', function(d,i) {
119 if (!interactive) return;
120 d3.select(this).classed('hover', true);
121 dispatch.elementMouseover({
124 pos: [x(getX(d,i)), y(getY(d,i))], // TODO: Figure out why the value appears to be shifted
131 .on('mouseout', function(d,i) {
132 if (!interactive) return;
133 d3.select(this).classed('hover', false);
134 dispatch.elementMouseout({
142 .on('click', function(d,i) {
143 if (!interactive) return;
144 dispatch.elementClick({
149 pos: [x(getX(d,i)), y(getY(d,i))],
153 d3.event.stopPropagation();
155 .on('dblclick', function(d,i) {
156 if (!interactive) return;
157 dispatch.elementDblClick({
162 pos: [x(getX(d,i)), y(getY(d,i))],
166 d3.event.stopPropagation();
170 .attr('fill', function(d,i) { return color(d, i); })
171 .attr('class', function(d,i,j) { return (getY(d,i) < 0 ? 'nv-bar negative' : 'nv-bar positive') + ' nv-bar-' + j + '-' + i })
173 .attr('transform', function(d,i) { return 'translate(' + (x(getX(d,i)) - availableWidth / data[0].values.length * .45) + ',0)'; })
174 //TODO: better width calculations that don't assume always uniform data spacing;w
175 .attr('width', (availableWidth / data[0].values.length) * .9 );
179 .attr('y', function(d,i) {
180 var rval = getY(d,i) < 0 ?
182 y(0) - y(getY(d,i)) < 1 ?
185 return nv.utils.NaNtoZero(rval);
187 .attr('height', function(d,i) { return nv.utils.NaNtoZero(Math.max(Math.abs(y(getY(d,i)) - y(0)),1)) });
194 //Create methods to allow outside functions to highlight a specific bar.
195 chart.highlightPoint = function(pointIndex, isHoverOver) {
196 d3.select(".nv-historicalBar-" + id)
197 .select(".nv-bars .nv-bar-0-" + pointIndex)
198 .classed("hover", isHoverOver)
202 chart.clearHighlights = function() {
203 d3.select(".nv-historicalBar-" + id)
204 .select(".nv-bars .nv-bar.hover")
205 .classed("hover", false)
208 //============================================================
209 // Expose Public Variables
210 //------------------------------------------------------------
212 chart.dispatch = dispatch;
214 chart.options = nv.utils.optionsFunc.bind(chart);
216 chart.x = function(_) {
217 if (!arguments.length) return getX;
222 chart.y = function(_) {
223 if (!arguments.length) return getY;
228 chart.margin = function(_) {
229 if (!arguments.length) return margin;
230 margin.top = typeof _.top != 'undefined' ? _.top : margin.top;
231 margin.right = typeof _.right != 'undefined' ? _.right : margin.right;
232 margin.bottom = typeof _.bottom != 'undefined' ? _.bottom : margin.bottom;
233 margin.left = typeof _.left != 'undefined' ? _.left : margin.left;
237 chart.width = function(_) {
238 if (!arguments.length) return width;
243 chart.height = function(_) {
244 if (!arguments.length) return height;
249 chart.xScale = function(_) {
250 if (!arguments.length) return x;
255 chart.yScale = function(_) {
256 if (!arguments.length) return y;
261 chart.xDomain = function(_) {
262 if (!arguments.length) return xDomain;
267 chart.yDomain = function(_) {
268 if (!arguments.length) return yDomain;
273 chart.xRange = function(_) {
274 if (!arguments.length) return xRange;
279 chart.yRange = function(_) {
280 if (!arguments.length) return yRange;
285 chart.forceX = function(_) {
286 if (!arguments.length) return forceX;
291 chart.forceY = function(_) {
292 if (!arguments.length) return forceY;
297 chart.padData = function(_) {
298 if (!arguments.length) return padData;
303 chart.clipEdge = function(_) {
304 if (!arguments.length) return clipEdge;
309 chart.color = function(_) {
310 if (!arguments.length) return color;
311 color = nv.utils.getColor(_);
315 chart.id = function(_) {
316 if (!arguments.length) return id;
321 chart.interactive = function(_) {
322 if(!arguments.length) return interactive;
327 //============================================================