[legend.js] added radioButtonMode. If set to true, chart

legend will behave like a radio button group when clicked.
Mentioned in issue #168.
This commit is contained in:
Robin Hu 2013-08-10 22:54:38 -04:00
parent 4e861eaba0
commit f2375705a4

View File

@ -12,6 +12,7 @@ nv.models.legend = function() {
, align = true
, rightAlign = true
, updateState = true //If true, legend will update data.disabled and trigger a 'stateChange' dispatch.
, radioButtonMode = false //If true, clicking legend items will cause it to behave like a radio button. (only one can be selected at a time)
, dispatch = d3.dispatch('legendClick', 'legendDblclick', 'legendMouseover', 'legendMouseout', 'stateChange')
;
@ -48,11 +49,19 @@ nv.models.legend = function() {
.on('click', function(d,i) {
dispatch.legendClick(d,i);
if (updateState) {
d.disabled = !d.disabled;
if (data.every(function(series) { return series.disabled})) {
//the default behavior of NVD3 legends is, if every single series
// is disabled, turn all series' back on.
data.forEach(function(series) { series.disabled = false});
if (radioButtonMode) {
//Radio button mode: set every series to disabled,
// and enable the clicked series.
data.forEach(function(series) { series.disabled = true});
d.disabled = false;
}
else {
d.disabled = !d.disabled;
if (data.every(function(series) { return series.disabled})) {
//the default behavior of NVD3 legends is, if every single series
// is disabled, turn all series' back on.
data.forEach(function(series) { series.disabled = false});
}
}
dispatch.stateChange({
disabled: data.map(function(d) { return !!d.disabled })
@ -245,6 +254,12 @@ nv.models.legend = function() {
return chart;
};
chart.radioButtonMode = function(_) {
if (!arguments.length) return radioButtonMode;
radioButtonMode = _;
return chart;
};
//============================================================