Highcharts Demo

author(s): Torstein Hønsi

by Black Label

HTML

<script src="https://code.highcharts.com/11.3/highcharts.js"></script>

<div id="container"></div>

CSS

#container {
  min-width: 310px;
  max-width: 800px;
  height: 400px;
  margin: 0 auto
}

JavaScript

(function (H) {
  const { merge, fireEvent, defaultOptions, pick, defined } = H;
  H.Series.prototype.setOptions = function (itemOptions) {
    const chart = this.chart,
      chartOptions = chart.options,
      plotOptions = chartOptions.plotOptions,
      userOptions = chart.userOptions || {},
      seriesUserOptions = merge(itemOptions),
      styledMode = chart.styledMode,
      e = {
        plotOptions: plotOptions,
        userOptions: seriesUserOptions,
      };
    let zone;
    fireEvent(this, 'setOptions', e);
    // These may be modified by the event
    const typeOptions = e.plotOptions[this.type],
      userPlotOptions = userOptions.plotOptions || {},
      userPlotOptionsSeries = userPlotOptions.series || {},
      defaultPlotOptionsType = defaultOptions.plotOptions[this.type] || {},
      userPlotOptionsType = userPlotOptions[this.type] || {};
    // use copy to prevent undetected changes (#9762)
    /**
     * Contains series options by the user without defaults.
     * @name Highcharts.Series#userOptions
     * @type {Highcharts.SeriesOptionsType}
     */
    this.userOptions = e.userOptions;
    const options = merge(
      typeOptions,
      plotOptions.series,
      // #3881, chart instance plotOptions[type] should trump
      // plotOptions.series
      userPlotOptionsType,
      seriesUserOptions
    );
    // The tooltip options are merged between global and series specific
    // options. Importance order asscendingly:
    // globals: (1)tooltip, (2)plotOptions.series,
    // (3)plotOptions[this.type]
    // init userOptions with possible later updates: 4-6 like 1-3 and
    // (7)this series options
    this.tooltipOptions = merge(
      defaultOptions.tooltip, // 1
      defaultOptions.plotOptions.series?.tooltip, // 2
      defaultPlotOptionsType?.tooltip, // 3
      chart.userOptions.tooltip, // 4
      userPlotOptions.series?.tooltip, // 5
      userPlotOptionsType.tooltip, // 6
      seriesUserOptions.tooltip // 7
    );
    // When...