Highstock: Fixed #7773, added new property (compareToMain).

js/indicators/indicators.src.js

@@ -83,10 +83,10 @@ seriesType(
      *
      * @extends      plotOptions.line
      * @since        6.0.0
-     * @excluding    allAreas, colorAxis, compare, compareBase, joinBy, keys,
-     *               navigatorOptions, pointInterval, pointIntervalUnit,
-     *               pointPlacement, pointRange, pointStart, showInNavigator,
-     *               stacking, useOhlcData
+     * @excluding    allAreas, colorAxis, joinBy, keys, navigatorOptions,
+     *               pointInterval, pointIntervalUnit, pointPlacement,
+     *               pointRange, pointStart, showInNavigator, stacking,
+     *               useOhlcData
      * @product      highstock
      * @optionparent plotOptions.sma
      */
@@ -112,6 +112,16 @@ seriesType(
          * @type {string}
          */
         linkedTo: undefined,
+        /**
+         * Whether to compare indicator to the main series values
+         * or indicator values.
+         *
+         * @sample {highstock} stock/plotoptions/series-comparetomain/
+         *         compareToMain
+         *
+         * @type {boolean}
+         */
+        compareToMain: false,
         /**
          * Paramters used in calculation of regression series' points.
          */
@@ -134,6 +144,17 @@ seriesType(
      * @lends Highcharts.Series.prototype
      */
     {
+        processData: function () {
+            var series = this,
+                compareToMain = series.options.compareToMain,
+                linkedParent = series.linkedParent;
+
+            Series.prototype.processData.apply(series, arguments);
+
+            if (linkedParent && linkedParent.compareValue && compareToMain) {
+                series.compareValue = linkedParent.compareValue;
+            }
+        },
         bindTo: {
             series: true,
             eventName: 'updatedData'

samples/stock/plotoptions/series-comparetomain/demo.details

@@ -0,0 +1,6 @@
+---
+ name: Highcharts Stock Demo
+ authors:
+   - Rafal Sebestjanski
+ js_wrap: b
+...

samples/stock/plotoptions/series-comparetomain/demo.html

@@ -0,0 +1,7 @@
+<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
+<script src="https://code.highcharts.com/stock/highstock.js"></script>
+<script src="https://code.highcharts.com/stock/indicators/indicators-all.js"></script>
+<script src="https://code.highcharts.com/stock/modules/exporting.js"></script>
+<script src="https://code.highcharts.com/stock/modules/export-data.js"></script>
+
+<div id="container" style="height: 400px; min-width: 310px"></div>

samples/stock/plotoptions/series-comparetomain/demo.js

@@ -0,0 +1,36 @@
+$.getJSON('https://www.highcharts.com/samples/data/aapl-c.json', function (data) {
+    // Create the chart
+    Highcharts.stockChart('container', {
+
+        plotOptions: {
+            series: {
+                compare: 'percent'
+            }
+        },
+
+        rangeSelector: {
+            selected: 1
+        },
+
+        title: {
+            text: 'AAPL Stock Price'
+        },
+
+        tooltip: {
+            pointFormat: '{series.name}: {point.y} ({point.change}%)',
+            valueDecimals: 2
+        },
+
+        series: [{
+            name: 'AAPL',
+            id: 'main',
+            data: data
+        }, {
+            type: 'sma',
+            name: 'SMA',
+            linkedTo: 'main',
+            compareToMain: true
+        }]
+
+    });
+});

samples/unit-tests/series/compare/demo.html

@@ -1,4 +1,5 @@
 <script src="https://code.highcharts.com/stock/highstock.js"></script>
+<script src="https://code.highcharts.com/stock/indicators/indicators-all.js"></script>
 
 
 <div id="qunit"></div>

samples/unit-tests/series/compare/demo.js

@@ -1,5 +1,3 @@
-
-
 QUnit.test('Compare in candlesticks', function (assert) {
     var chart = Highcharts.stockChart('container', {
         series: [{
@@ -98,4 +96,44 @@ QUnit.test('Compare with the correct compareValue', function (assert) {
         series.points[0][series.options.pointValKey],
         'compareValue is correct'
     );
+});
+
+QUnit.test('Compare to the proper series (#7773)', function (assert) {
+    var chart = Highcharts.stockChart('container', {
+
+        plotOptions: {
+            series: {
+                compare: 'percent'
+            }
+        },
+
+        tooltip: {
+            pointFormat: '{series.name}: {point.y} ({point.change}%)'
+        },
+
+        series: [{
+            data: [13, 12, 8, 4, 2, 5, 10, 30],
+            id: 'main'
+        }, {
+            type: 'sma',
+            name: 'SMA',
+            linkedTo: 'main',
+            compareToMain: true,
+            params: {
+                period: 3
+            }
+        }]
+    });
+
+    assert.strictEqual(
+        chart.series[1].compareValue,
+        13,
+        'compareValue is correct'
+    );
+
+    assert.strictEqual(
+        chart.series[1].data[0].change,
+        -15.384615384615387,
+        'First change value is correct'
+    );
 });