Merge branch 'development' of https://github.com/novus/nvd3 into development

Conflicts:
	nv.d3.js
	nv.d3.min.js
	src/models/multiBarHorizontalChart.js
master
frank shao 11 years ago
commit ccb051cf5e

File diff suppressed because it is too large Load Diff

9
nv.d3.min.js vendored

File diff suppressed because one or more lines are too long

@ -276,7 +276,7 @@ nv.models.historicalBarChart = function() {
state.disabled = e.disabled;
}
selection.call(chart);
chart.update();
});
//============================================================

@ -19,6 +19,7 @@ nv.models.multiBarHorizontal = function() {
, disabled // used in conjunction with barColor to communicate from multiBarHorizontalChart what series are disabled
, stacked = false
, showValues = false
, showBarLabels = false
, valuePadding = 60
, valueFormat = d3.format(',.2f')
, delay = 1200
@ -231,6 +232,21 @@ nv.models.multiBarHorizontal = function() {
bars.selectAll('text').text('');
}
if (showBarLabels && !stacked) {
barsEnter.append('text').classed('nv-bar-label',true);
bars.select('text.nv-bar-label')
.attr('text-anchor', function(d,i) { return getY(d,i) < 0 ? 'start' : 'end' })
.attr('y', x.rangeBand() / (data.length * 2))
.attr('dy', '.32em')
.text(function(d,i) { return getX(d,i) });
bars.transition()
.select('text.nv-bar-label')
.attr('x', function(d,i) { return getY(d,i) < 0 ? y(0) - y(getY(d,i)) + 4 : -4 });
}
else {
bars.selectAll('text.nv-bar-label').text('');
}
bars
.attr('class', function(d,i) { return getY(d,i) < 0 ? 'nv-bar negative' : 'nv-bar positive'})
@ -405,6 +421,13 @@ nv.models.multiBarHorizontal = function() {
return chart;
};
chart.showBarLabels = function(_) {
if (!arguments.length) return showBarLabels;
showBarLabels = _;
return chart;
};
chart.valueFormat= function(_) {
if (!arguments.length) return valueFormat;
valueFormat = _;

@ -18,6 +18,8 @@ nv.models.multiBarHorizontalChart = function() {
, color = nv.utils.defaultColor()
, showControls = true
, showLegend = true
, showXAxis = true
, showYAxis = true
, stacked = false
, tooltips = true
, tooltip = function(key, x, y, e, graph) {
@ -221,6 +223,7 @@ nv.models.multiBarHorizontalChart = function() {
//------------------------------------------------------------
// Setup Axes
if (showXAxis) {
xAxis
.scale(x)
.ticks( availableHeight / 24 )
@ -231,6 +234,12 @@ nv.models.multiBarHorizontalChart = function() {
var xTicks = g.select('.nv-x.nv-axis').selectAll('g');
xTicks
.selectAll('line, text')
.style('opacity', 1);
}
if (showYAxis) {
yAxis
.scale(y)
.ticks( availableWidth / 100 )
@ -240,6 +249,7 @@ nv.models.multiBarHorizontalChart = function() {
.attr('transform', 'translate(0,' + availableHeight + ')');
g.select('.nv-y.nv-axis').transition()
.call(yAxis);
}
// Zero line
g.select(".nv-zeroLine line")
@ -306,7 +316,7 @@ nv.models.multiBarHorizontalChart = function() {
state.stacked = e.stacked;
}
selection.call(chart);
chart.update();
});
//============================================================
@ -347,7 +357,8 @@ nv.models.multiBarHorizontalChart = function() {
chart.xAxis = xAxis;
chart.yAxis = yAxis;
d3.rebind(chart, multibar, 'x', 'y', 'xDomain', 'yDomain', 'xRange', 'yRange', 'forceX', 'forceY', 'clipEdge', 'id', 'delay', 'showValues', 'valueFormat', 'stacked', 'barColor');
d3.rebind(chart, multibar, 'x', 'y', 'xDomain', 'yDomain', 'xRange', 'yRange', 'forceX', 'forceY',
'clipEdge', 'id', 'delay', 'showValues','showBarLabels', 'valueFormat', 'stacked', 'barColor');
chart.options = nv.utils.optionsFunc.bind(chart);
@ -391,6 +402,18 @@ nv.models.multiBarHorizontalChart = function() {
return chart;
};
chart.showXAxis = function(_) {
if (!arguments.length) return showXAxis;
showXAxis = _;
return chart;
};
chart.showYAxis = function(_) {
if (!arguments.length) return showYAxis;
showYAxis = _;
return chart;
};
chart.tooltip = function(_) {
if (!arguments.length) return tooltip;
tooltip = _;

@ -48,9 +48,11 @@ nv.models.pie = function() {
var g = wrap.select('g');
gEnter.append('g').attr('class', 'nv-pie');
gEnter.append('g').attr('class', 'nv-pieLabels');
wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
g.select('.nv-pie').attr('transform', 'translate(' + availableWidth / 2 + ',' + availableHeight / 2 + ')');
g.select('.nv-pieLabels').attr('transform', 'translate(' + availableWidth / 2 + ',' + availableHeight / 2 + ')');
//------------------------------------------------------------
@ -81,7 +83,11 @@ nv.models.pie = function() {
var slices = wrap.select('.nv-pie').selectAll('.nv-slice')
.data(pie);
var pieLabels = wrap.select('.nv-pieLabels').selectAll('.nv-label')
.data(pie);
slices.exit().remove();
pieLabels.exit().remove();
var ae = slices.enter().append('g')
.attr('class', 'nv-slice')
@ -150,7 +156,7 @@ nv.models.pie = function() {
if (donutLabelsOutside) { labelsArc = d3.svg.arc().outerRadius(arc.outerRadius()); }
ae.append("g").classed("nv-label", true)
pieLabels.enter().append("g").classed("nv-label",true)
.each(function(d,i) {
var group = d3.select(this);
@ -183,10 +189,16 @@ nv.models.pie = function() {
.style('text-anchor', labelSunbeamLayout ? ((d.startAngle + d.endAngle) / 2 < Math.PI ? 'start' : 'end') : 'middle') //center the text on it's origin or begin/end if orthogonal aligned
.style('fill', '#000')
});
slices.select(".nv-label").transition()
var labelLocationHash = {};
var avgHeight = 14;
var avgWidth = 140;
var createHashKey = function(coordinates) {
return Math.floor(coordinates[0]/avgWidth) * avgWidth + ',' + Math.floor(coordinates[1]/avgHeight) * avgHeight;
};
pieLabels.transition()
.attr('transform', function(d) {
if (labelSunbeamLayout) {
d.outerRadius = arcRadius + 10; // Set Outer Coordinate
@ -201,15 +213,22 @@ nv.models.pie = function() {
} else {
d.outerRadius = radius + 10; // Set Outer Coordinate
d.innerRadius = radius + 15; // Set Inner Coordinate
return 'translate(' + labelsArc.centroid(d) + ')'
/*
Overlapping pie labels are not good. What this attempts to do is, prevent overlapping.
Each label location is hashed, and if a hash collision occurs, we assume an overlap.
Adjust the label's y-position to remove the overlap.
*/
var center = labelsArc.centroid(d);
var hashKey = createHashKey(center);
if (labelLocationHash[hashKey]) {
center[1] -= avgHeight;
}
labelLocationHash[createHashKey(center)] = true;
return 'translate(' + center + ')'
}
});
slices.each(function(d, i) {
var slice = d3.select(this);
slice
.select(".nv-label text")
pieLabels.select(".nv-label text")
.style('text-anchor', labelSunbeamLayout ? ((d.startAngle + d.endAngle) / 2 < Math.PI ? 'start' : 'end') : 'middle') //center the text on it's origin or begin/end if orthogonal aligned
.text(function(d, i) {
var percent = (d.endAngle - d.startAngle) / (2 * Math.PI);
@ -220,15 +239,6 @@ nv.models.pie = function() {
};
return (d.value && percent > labelThreshold) ? labelTypes[labelType] : '';
});
var textBox = slice.select('text').node().getBBox();
slice.select(".nv-label rect")
.attr("width", textBox.width + 10)
.attr("height", textBox.height + 10)
.attr("transform", function() {
return "translate(" + [textBox.x - 5, textBox.y - 5] + ")";
});
});
}

Loading…
Cancel
Save