1

Picture as a reference

Picture As A reference

I want to build this type of chart and my data set link is below. I'm unable to find any example regarding this. https://docs.google.com/spreadsheets/d/1geCzzfBeyY8yDHAdEFWUSUf8ex3QWfqDtPg7ArOdTw0/edit?usp=sharing

koko-js478
  • 1,703
  • 7
  • 17
Karan Talwar
  • 108
  • 6

1 Answers1

0

From the referred image I can see that it is a stock chart, which demo base you can find here: https://www.highcharts.com/demo/stock

How to align the series to the particular yAxis you can find here: https://api.highcharts.com/highcharts/series.line.yAxis

Sample demo: https://jsfiddle.net/BlackLabel/95ptgrec/

// Create the chart
Highcharts.stockChart('container', {
  yAxis: [{
    title: {
      text: 'axis1'
    }
  }, {
    title: {
      text: 'axis2'
    }
  }, {
    title: {
      text: 'axis3'
    },
    opposite: false
  }],
  series: [{
    data: generateData()
  }, {
    data: generateData(),
    yAxis: 1
  }, {
    data: generateData(),
    yAxis: 2
  }]
});

If you want to implement charts in Angular or React environment I encourage to use the official wrappers:

https://github.com/highcharts/highcharts-angular

https://github.com/highcharts/highcharts-react

Sebastian Wędzel
  • 11,417
  • 1
  • 6
  • 16
  • Your question was how to use multiple yAxes in the Highcharts and I gave you a clear guideline on how to achieve it. Now it's your turn to implement it into your project. In case of face any trouble please reproduce your current attempt with the sample data and ask a specific question. – Sebastian Wędzel Oct 23 '20 at 08:36