Apex chart tooltip shared not working if series have different size

25 views Asked by At

If my series have different sizes apexchart doesn't render tooltip shared with value with same x point. Follow codepen

var ts2 = 1484418600000;
var dates = [];
var dates2 = [];
for (var i = 0; i < 120; i++) {
  ts2 = ts2 + 86400000;
  var innerArr = [ts2, i * Math.floor(Math.random() * 220)];
  var innerArr2 = [ts2, i * Math.floor(Math.random() * 400)];
  dates.push(innerArr);
  dates2.push(innerArr2);
  
}

dates2.push([ts2 + 86400000, 1000]);
console.log(dates)

var options = {
  chart: {
    type: "line",
    stacked: false,
    height: 250,
    zoom: {
      type: "x",
      enabled: true
    },
    toolbar: {
      autoSelected: "zoom"
    }
  },
  dataLabels: {
    enabled: false
  },
  series: [
    {
      name: "XYZ MOTORS",
      data: dates
    },{
      name: "asdasd",
      data: dates2
    }
  ],
  markers: {
    size: 0
  },
  title: {
    text: "Stock Price Movement",
    align: "left"
  },
  xaxis: {
    type: "datetime"
  },

  tooltip: {
    shared: true,
  }
};

var chart = new ApexCharts(document.querySelector("#chart"), options);

chart.render();

https://codepen.io/Fernando-BA-the-animator/pen/XWQjYmX

I want the tooltip shows all series value with same x point. And I cannot find any solution for this bug, maybe this is an issue with apex chart library.

0

There are 0 answers