Die Funktionen show() und hide() von Highchart erweitern

Question

Was wäre der beste Ansatz, um die Funktionen show() und hide() in Highcharts zu erweitern?

Ich möchte einen Boolean-ähnlichen show(effectLinkedSeries) und hide(effectLinkedSeries) hinzufügen, so dass ich steuern kann, wenn eine LinkedSeries entfernt oder zusammen mit seinem "Eltern" hinzugefügt wird. Hier ist eine Demo von linkedSeries functionality. Eine Eigenschaft namens „linkedTo“ setzt die Funktionalität auf:

series: [{ 
      name: 'Temperature', 
      data: averages, 
      zIndex: 1, 
      marker: { 
       fillColor: 'white', 
       lineWidth: 2, 
       lineColor: Highcharts.getOptions().colors[0] 
      } 
     }, { 
      name: 'Range', 
      data: ranges, 
      type: 'arearange', 
      lineWidth: 0, 
      linkedTo: ':previous', 
      color: Highcharts.getOptions().colors[0], 
      fillOpacity: 0.3, 
      zIndex: 0 
     }] 

Ich konnte die source directly ändern, aber ich würde lieber versuchen, die Bibliothek zu erweitern, anstatt sie zu hacken.

Answer 1

Figured I Verwendung des Highcharts.Series.prototype machen dieses

Highcharts.Series.prototype.setVisible = function (vis, redraw, effectLinkedSeries) { 
     var series = this, 
      chart = series.chart, 
      legendItem = series.legendItem, 
      showOrHide, 
      ignoreHiddenSeries = chart.options.chart.ignoreHiddenSeries, 
      oldVisibility = series.visible; 

     // if called without an argument, toggle visibility 
     series.visible = vis = series.userOptions.visible = vis === Highcharts.UNDEFINED ? !oldVisibility : vis; 
     showOrHide = vis ? 'show' : 'hide'; 

     // show or hide elements 
     Highcharts.each(['group', 'dataLabelsGroup', 'markerGroup', 'tracker'], function (key) { 
      if (series[key]) { 
       series[key][showOrHide](); 
      } 
     }); 


     // hide tooltip (#1361) 
     if (chart.hoverSeries === series || (chart.hoverPoint && chart.hoverPoint.series) === series) { 
      series.onMouseOut(); 
     } 


     if (legendItem) { 
      chart.legend.colorizeItem(series, vis); 
     } 


     // rescale or adapt to resized chart 
     series.isDirty = true; 
     // in a stack, all other series are affected 
     if (series.options.stacking) { 
      Highcharts.each(chart.series, function (otherSeries) { 
       if (otherSeries.options.stacking && otherSeries.visible) { 
        otherSeries.isDirty = true; 
       } 
      }); 
     } 

     // show or hide linked series 
     Highcharts.each(series.linkedSeries, function (otherSeries) { 
      if (effectLinkedSeries === true) { 
       otherSeries.setVisible(vis, false); 
      } 
     }); 

     if (ignoreHiddenSeries) { 
      chart.isDirtyBox = true; 
     } 
     if (redraw !== false) { 
      chart.redraw(); 
     } 

     Highcharts.fireEvent(series, showOrHide); 
}; // end Highcharts.Series.prototype.setVisible 

Highcharts.Series.prototype.show = function (effectLinkedSeries) { 
     this.setVisible(true,undefined,effectLinkedSeries); 
}; 

Highcharts.Series.prototype.hide = function (effectLinkedSeries) { 
     this.setVisible(false,undefined,effectLinkedSeries); 
}; 

zu erreichen