|
|
@@ -84,16 +84,26 @@ nv.models.growingPie = function() {
|
|
|
});
|
|
|
});
|
|
|
|
|
|
-
|
|
|
- var arc = d3.svg.arc()
|
|
|
- .outerRadius(arcRadius);
|
|
|
-
|
|
|
- var arcOver = d3.svg.arc()
|
|
|
- .outerRadius(arcRadius + 10);
|
|
|
-
|
|
|
- if (startAngle) arc.startAngle(startAngle)
|
|
|
- if (endAngle) arc.endAngle(endAngle);
|
|
|
- if (donut) arc.innerRadius(radius * donutRatio);
|
|
|
+ function updateVariables() {
|
|
|
+ availableWidth = width - margin.left - margin.right;
|
|
|
+ availableHeight = height - margin.top - margin.bottom;
|
|
|
+ radius = Math.min(availableWidth, availableHeight) / 2;
|
|
|
+ arcRadius = radius-(radius / 5);
|
|
|
+ }
|
|
|
+
|
|
|
+ var arcNormal = function() {
|
|
|
+ updateVariables();
|
|
|
+ return d3.svg.arc().outerRadius(arcRadius);
|
|
|
+ }
|
|
|
+
|
|
|
+ var arcOver = function() {
|
|
|
+ updateVariables();
|
|
|
+ return d3.svg.arc().outerRadius(arcRadius + 10);
|
|
|
+ }
|
|
|
+
|
|
|
+ if (startAngle) arcNormal().startAngle(startAngle)
|
|
|
+ if (endAngle) arcNormal().endAngle(endAngle);
|
|
|
+ if (donut) arcNormal().innerRadius(radius * donutRatio);
|
|
|
|
|
|
// Setup the Pie chart and choose the data element
|
|
|
var pie = d3.layout.pie()
|
|
|
@@ -115,7 +125,7 @@ nv.models.growingPie = function() {
|
|
|
slices.each(function(d, i) {
|
|
|
if ((typeof d.data.obj.from != "undefined" && d.data.obj.from == item) || d.data.obj.value == item) {
|
|
|
d3.select(this).classed('selected', true);
|
|
|
- d3.select(this).select("path").transition().duration(100).attr("d", arcOver);
|
|
|
+ d3.select(this).select("path").transition().duration(100).attr("d", arcOver());
|
|
|
}
|
|
|
});
|
|
|
});
|
|
|
@@ -124,7 +134,7 @@ nv.models.growingPie = function() {
|
|
|
var ae = slices.enter().append('g')
|
|
|
.attr('class', 'nv-slice')
|
|
|
.on('mouseover', function(d,i){
|
|
|
- d3.select(this).select("path").transition().duration(100).attr("d", arcOver);
|
|
|
+ d3.select(this).select("path").transition().duration(100).attr("d", arcOver());
|
|
|
d3.select(this).classed('hover', true);
|
|
|
dispatch.elementMouseover({
|
|
|
label: getX(d.data),
|
|
|
@@ -137,7 +147,7 @@ nv.models.growingPie = function() {
|
|
|
})
|
|
|
.on('mouseout', function(d,i){
|
|
|
if (!d3.select(this).classed('selected')){
|
|
|
- d3.select(this).select("path").transition().duration(100).attr("d", arc);
|
|
|
+ d3.select(this).select("path").transition().duration(100).attr("d", arcNormal());
|
|
|
}
|
|
|
d3.select(this).classed('hover', false);
|
|
|
dispatch.elementMouseout({
|
|
|
@@ -149,7 +159,7 @@ nv.models.growingPie = function() {
|
|
|
});
|
|
|
})
|
|
|
.on('click', function(d,i) {
|
|
|
- d3.select(this).select("path").transition().duration(100).attr("d", arcOver);
|
|
|
+ d3.select(this).select("path").transition().duration(100).attr("d", arcOver());
|
|
|
dispatch.elementClick({
|
|
|
label: getX(d.data),
|
|
|
value: getY(d.data),
|
|
|
@@ -161,7 +171,7 @@ nv.models.growingPie = function() {
|
|
|
d3.event.stopPropagation();
|
|
|
})
|
|
|
.on('dblclick', function(d,i) {
|
|
|
- d3.select(this).select("path").transition().duration(100).attr("d", arc);
|
|
|
+ d3.select(this).select("path").transition().duration(100).attr("d", arcNormal());
|
|
|
dispatch.elementDblClick({
|
|
|
label: getX(d.data),
|
|
|
value: getY(d.data),
|
|
|
@@ -183,16 +193,16 @@ nv.models.growingPie = function() {
|
|
|
|
|
|
slices.select('path')
|
|
|
.transition()
|
|
|
- .attr('d', arc)
|
|
|
+ .attr('d', arcNormal())
|
|
|
.attrTween('d', arcTween);
|
|
|
|
|
|
if (showLabels) {
|
|
|
// This does the normal label
|
|
|
var labelsArc = d3.svg.arc().innerRadius(0);
|
|
|
|
|
|
- if (pieLabelsOutside){ labelsArc = arc; }
|
|
|
+ if (pieLabelsOutside){ labelsArc = arcNormal(); }
|
|
|
|
|
|
- if (donutLabelsOutside) { labelsArc = d3.svg.arc().outerRadius(arc.outerRadius()); }
|
|
|
+ if (donutLabelsOutside) { labelsArc = d3.svg.arc().outerRadius(arc().outerRadius()); }
|
|
|
|
|
|
pieLabels.enter().append("g").classed("nv-label",true)
|
|
|
.each(function(d,i) {
|
|
|
@@ -311,7 +321,7 @@ nv.models.growingPie = function() {
|
|
|
var i = d3.interpolate(this._current, a);
|
|
|
this._current = i(0);
|
|
|
return function(t) {
|
|
|
- return arc(i(t));
|
|
|
+ return arcNormal()(i(t));
|
|
|
};
|
|
|
}
|
|
|
|
|
|
@@ -319,7 +329,7 @@ nv.models.growingPie = function() {
|
|
|
b.innerRadius = 0;
|
|
|
var i = d3.interpolate({startAngle: 0, endAngle: 0}, b);
|
|
|
return function(t) {
|
|
|
- return arc(i(t));
|
|
|
+ return arcNormal()(i(t));
|
|
|
};
|
|
|
}
|
|
|
|