1

I am using chart.js library for plotting a line graph with two series in my angular 5 application. Following is my code from ts file : 

this.myChart = new Chart(this.ctx, {
  type: 'line',
  data: {
    labels: labels,
    datasets: [{
        label: 'Data1',
        data: [100, 345, 657, 788, 300],
        fill: false,
        backgroundColor: '#3C96D2',
        pointRadius: 1,
        borderColor: '#3C96D2',
        pointHoverRadius: 3
      },
      {
        label: 'Data2',
        data: [567, 879, 200, 800],
        fill: false,
        backgroundColor: '#122449',
        pointRadius: 1,
        borderColor: '#122449',
        pointHoverRadius: 3
      }
    ]
  },
  options: {
    layout: {
      padding: {
        left: 50,
        right: 0,
        top: 0,
        bottom: 0
      }
    },
    hover: {
      mode: 'point',
    },
    scales: {
      yAxes: [{
        ticks: {
          beginAtZero: false
        },
        scaleLabel: {
          display: true,
          labelString: 'prices'
        }
      }],
      xAxes: [{
        scaleLabel: {
          display: true,
          labelString: 'Year'
        }
      }],
    }
  }
});

It correctly plots the line graph with two datasets. What I want to find out is the point of intersection of these two lines and display some custom div at that point on the graph. I am also open to use any other plugin for the same. Already tried using amcharts, but didn't find any solution. Any help is much appreciated.

HeadhunterKev
  • 1,728
  • 5
  • 13
Shrutika Patil
  • 565
  • 3
  • 18

1 Answers1

0

This will be very hard to achieve with Bezier curves (lineTension !== 0). You will need to invest some time to learn the math for that.

Luckily if you don't need Bezier curves, so only staight lines between your data points, there already is an answer on StackOverflow, right here!

HeadhunterKev
  • 1,728
  • 5
  • 13
  • Thanks for your response but I had already looked into this before posting the question here. It doesn't fulfill my requirements. – Shrutika Patil Sep 24 '19 at 13:55
  • Ok. Then I'm sorry I can't help you. This is out of my reach and my time. I don't think there's a plugin for that. Good luck tho! – HeadhunterKev Sep 24 '19 at 19:55