Thanks for the reply! Your JSFiddle code was very helpful including the addition of the groupName attribute, however I noticed it had one issue. Toggling Efficiency visibility would unhide any other hidden series in the legend. I modified it a bit to achieve the desired result.
legend: {
fontFamily: "Open Sans, Arial",
fontSize: 14,
cursor: "pointer",
itemclick: function(e) {
var hideEfficiencySeries = false;
for (var i = 0; i < e.chart.options.data.length; i++) {
if (e.chart.options.data[i].groupName === "efficiency" && e.dataSeriesIndex === e.chart.data[i]._index) {
hideEfficiencySeries = true;
}
}
if (hideEfficiencySeries) {
for (var i = 0; i < e.chart.options.data.length; i++) {
if (typeof (e.chart.data[i].visible) === "undefined" || e.chart.data[i].visible && e.chart.options.data[i].groupName === "efficiency") {
e.chart.options.data[i].visible = false;
} else if (!e.chart.data[i].visible && e.chart.options.data[i].groupName === "efficiency") {
e.chart.options.data[i].visible = true;
}
}
} else {
if (typeof (e.dataSeries.visible) === "undefined" || e.dataSeries.visible) {
e.dataSeries.visible = false;
} else {
e.dataSeries.visible = true;
}
}
e.chart.render();
}
}
I was attempting to store parts of the chart into a JSON file specific to that pump. That way I could simply load the desired JSON file and render the curve. Mostly everything unique to the pump curve resides within data:[].
