nvd3-fork
Version:
FORK! of NVD3, a reusable charting library written in d3.js
141 lines (115 loc) • 5 kB
JavaScript
nv.models.sunburstChart = function() {
"use strict";
//============================================================
// Public Variables with Default Settings
//------------------------------------------------------------
var sunburst = nv.models.sunburst();
var tooltip = nv.models.tooltip();
var margin = {top: 30, right: 20, bottom: 20, left: 20}
, width = null
, height = null
, color = nv.utils.defaultColor()
, showTooltipPercent = false
, id = Math.round(Math.random() * 100000)
, defaultState = null
, noData = null
, duration = 250
, dispatch = d3.dispatch('stateChange', 'changeState','renderEnd');
//============================================================
// Private Variables
//------------------------------------------------------------
var renderWatch = nv.utils.renderWatch(dispatch);
tooltip
.duration(0)
.headerEnabled(false)
.valueFormatter(function(d){return d;});
//============================================================
// Chart function
//------------------------------------------------------------
function chart(selection) {
renderWatch.reset();
renderWatch.models(sunburst);
selection.each(function(data) {
var container = d3.select(this);
nv.utils.initSVG(container);
var availableWidth = nv.utils.availableWidth(width, container, margin);
var availableHeight = nv.utils.availableHeight(height, container, margin);
chart.update = function() {
if (duration === 0) {
container.call(chart);
} else {
container.transition().duration(duration).call(chart);
}
};
chart.container = container;
// Display No Data message if there's nothing to show.
if (!data || !data.length) {
nv.utils.noData(chart, container);
return chart;
} else {
container.selectAll('.nv-noData').remove();
}
sunburst.width(availableWidth).height(availableHeight).margin(margin);
container.call(sunburst);
});
renderWatch.renderEnd('sunburstChart immediate');
return chart;
}
//============================================================
// Event Handling/Dispatching (out of chart's scope)
//------------------------------------------------------------
sunburst.dispatch.on('elementMouseover.tooltip', function(evt) {
evt.series = {
key: evt.data.name,
value: (evt.data.value || evt.data.size),
color: evt.color,
percent: evt.percent
};
if (!showTooltipPercent) {
delete evt.percent;
delete evt.series.percent;
}
tooltip.data(evt).hidden(false);
});
sunburst.dispatch.on('elementMouseout.tooltip', function(evt) {
tooltip.hidden(true);
});
sunburst.dispatch.on('elementMousemove.tooltip', function(evt) {
tooltip();
});
//============================================================
// Expose Public Variables
//------------------------------------------------------------
// expose chart's sub-components
chart.dispatch = dispatch;
chart.sunburst = sunburst;
chart.tooltip = tooltip;
chart.options = nv.utils.optionsFunc.bind(chart);
// use Object get/set functionality to map between vars and chart functions
chart._options = Object.create({}, {
// simple options, just get/set the necessary values
noData: {get: function(){return noData;}, set: function(_){noData=_;}},
defaultState: {get: function(){return defaultState;}, set: function(_){defaultState=_;}},
showTooltipPercent: {get: function(){return showTooltipPercent;}, set: function(_){showTooltipPercent=_;}},
// options that require extra logic in the setter
color: {get: function(){return color;}, set: function(_){
color = _;
sunburst.color(color);
}},
duration: {get: function(){return duration;}, set: function(_){
duration = _;
renderWatch.reset(duration);
sunburst.duration(duration);
}},
margin: {get: function(){return margin;}, set: function(_){
margin.top = _.top !== undefined ? _.top : margin.top;
margin.right = _.right !== undefined ? _.right : margin.right;
margin.bottom = _.bottom !== undefined ? _.bottom : margin.bottom;
margin.left = _.left !== undefined ? _.left : margin.left;
sunburst.margin(margin);
}}
});
nv.utils.inheritOptions(chart, sunburst);
nv.utils.initOptions(chart);
return chart;
};