Ensure ONLY ONE Legend Item is ON
by duarteleao
HTML
<script src="//cdnjs.cloudflare.com/ajax/libs/require.js/2.1.19/require.min.js"></script>
<script src="//webdetails.github.io/ccc/charts/lib/amd/require.config.js"></script>
<script src="//webdetails.github.io/ccc/charts/lib/q01-01.js"></script>
<div id="cccExample"></div>
JavaScript
require([
"ccc/pvc",
"ccc/def",
"ccc/protovis"
], function(pvc, def, pv) {
var chart = new pvc.BarChart({
canvas: "cccExample",
width: 450,
height: 400,
animate: false,
legend: {
scenes: {
item: {
execute: function() {
// Show/hide this item
if(!pvc.data.Data.toggleVisible(this.datums()))
return;
this.clearCachedState();
if(this.isOn()) {
var me = this;
// Hide all other legend items
this.root.childNodes.forEach(function(group) {
if(group.clickMode === 'togglevisible') {
group.childNodes
.forEach(function(item) {
// If not me, not locked and ON,
// then hide.
if(item !== me &&
item.executable() &&
item.isOn()) {
pvc.data.Data.setVisible(
item.datums(),
false);
}
});
}
});
}
this.chart().render(true, true, false);
}
}
}
}
})
.setData(relational_01, { crosstabMode: false })
.render();
function showFirstSeriesOnly() {
var firstSeries = chart.data.dimensions('series').min();
var hideDatums = chart.data.datums(null, {
where:...