Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Dual y axis for line charts

See original GitHub issue

I’m submitting a … (check one with “x”)

[ ] bug report => search github for a similar issue or PR before submitting
[x] feature request
[ ] support request => Please do not submit support request here

Request Would it be possible to support dual y axis for line charts? Something like this: http://bl.ocks.org/benjchristensen/2579619

(I think this may be related to #347)

Issue Analytics

State:
Created 6 years ago
Reactions:13
Comments:12 (1 by maintainers)

Top GitHub Comments

7reactions

fravezzimattiacommented, Apr 27, 2018

hey @chrisaige, here an example:

https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/demo/combo-dual-axes/

   yAxis: [{ // Primary yAxis
        labels: {
            format: '{value}°C',
            style: {
                color: Highcharts.getOptions().colors[1]
            }
        },
        title: {
            text: 'Temperature',
            style: {
                color: Highcharts.getOptions().colors[1]
            }
        }
    }, { // Secondary yAxis
        title: {
            text: 'Rainfall',
            style: {
                color: Highcharts.getOptions().colors[0]
            }
        },
        labels: {
            format: '{value} mm',
            style: {
                color: Highcharts.getOptions().colors[0]
            }
        },
        opposite: true
    }],

  series: [{
        name: 'Rainfall',
        type: 'column',
        yAxis: 1,  // => Secondary yAxis
        data: [49.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4],
        tooltip: {
            valueSuffix: ' mm'
        }
    }, {
        name: 'Temperature',
        type: 'spline',
    // is omitted,  yAxis: 0 // Primary yAxis
        data: [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6],
        tooltip: {
            valueSuffix: '°C'
        }
    }]

2reactions

belstcommented, May 15, 2018

@fravezzimattia this is an issue about ngx-charts not highcharts.