Custom Tooltip showing angular default tooltip instead.

[amalmohann]

when I try to add custom tooltip color it is not reflecting on chart and also it shows the angular default tooltip. providing my code here.

chart.component.html

<div id="chart">
   <apx-chart [series]="chartOptions.series" [chart]="chartOptions.chart" [labels]="chartOptions.labels"
     [fill]="chartOptions.fill" [dataLabels]="chartOptions.dataLabels" [legend]="chartOptions.legends"
     [responsive]="chartOptions.responsive" [tooltip]="chartOptions.tooltip">
   </apx-chart>
</div>

chart.component.ts

this.chartOptions = {
      series: [],
      labels: [],
      colors: ['#003f5c', '#2f4b7c', '#665191', '#a05195', '#d45087', '#f95d6a', '#ff7c43', '#ffa600'],
      chart: {
        width: '70%',
        type: "donut",
      },
      fill: {
        colors: ['#003f5c', '#2f4b7c', '#665191', '#a05195', '#d45087', '#f95d6a', '#ff7c43', '#ffa600'],
      },
      dataLabels: {
        style: {
          colors: ['#003f5c', '#2f4b7c', '#665191', '#a05195', '#d45087', '#f95d6a', '#ff7c43', '#ffa600'],
        }
      },
      legends: {
        markers: {
          fillColors: ['#003f5c', '#2f4b7c', '#665191', '#a05195', '#d45087', '#f95d6a', '#ff7c43', '#ffa600']
        }
      },
      tooltip: {
        marker: {
          fillColors: ['#003f5c', '#2f4b7c', '#665191', '#a05195', '#d45087', '#f95d6a', '#ff7c43', '#ffa600']
        }
      },
      responsive: [
        {
          breakpoint: 480,
          options: {
            chart: {
              width: 400
            },
            legend: {
              colors: ['#003f5c', '#2f4b7c', '#665191', '#a05195', '#d45087', '#f95d6a', '#ff7c43', '#ffa600'],
              position: 'bottom'
            }
          }
        }
      ]
    };

can anyone please help me out on this one?

[MassiveHiggsField]

same problem here with a line chart