如何在ng-apexchart中禁用工具提示

如何解决如何在ng-apexchart中禁用工具提示

我在我的角度应用程序中集成了顶点图表，实现了顶点折线图。我想隐藏启用了选项的尝试工具提示：false。但不起作用。甚至无法将自定义工具提示设置为折线图。 在系列上悬停时，它会显示一些垂直虚线，我需要隐藏工具提示或隐藏垂直虚线并创建自定义工具提示。

任何建议都会很有帮助。 谢谢。

import { Component,ViewChild,OnInit } from '@angular/core';

import {
  ChartComponent,ApexAxisChartSeries,ApexChart,ApexXAxis,ApexDataLabels,ApexTitleSubtitle,Apexstroke,ApexGrid,ApexLegend,ApexTooltip,ApexYAxis,} from 'ng-apexcharts';

export interface ChartOptions {
  series: ApexAxisChartSeries;
  chart: ApexChart;
  xaxis: ApexXAxis;
  yaxis: ApexYAxis;
  dataLabels: ApexDataLabels;
  grid: ApexGrid;
  stroke: Apexstroke;
  title: ApexTitleSubtitle;
  legend: ApexLegend;
  tooltip: ApexTooltip;
}
@Component({
  selector: 'app-line-chart',templateUrl: './line-chart.component.html',styleUrls: ['./line-chart.component.css'],})
export class LineChartComponent implements OnInit {
  @ViewChild('lineChart') lineChart: ChartComponent;
  public chartOptions: Partial<ChartOptions>;

  constructor() {}

  ngOnInit(): void {
    this.chartOptions = {
      series: [
        {
          name: 'Desktops',data: [10,41,35,51,49,62,69,91,148],},{
          name: 'Laptops',data: [22,55,66,77,88,99,90,110,170],],chart: {
        height: 350,type: 'line',zoom: {
          enabled: false,toolbar: {
          tools: {
            download: false,dataLabels: {
        enabled: false,stroke: {
        curve: 'straight',grid: {
        row: {
          colors: ['#f3f3f3','transparent'],// takes an array which will be repeated on columns
          opacity: 0.5,yaxis: {
        tooltip: {
          enabled: false,xaxis: {
        categories: ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep'],tooltip: {
          enabled: false,legend: {
        show: false,onItemClick: {
          toggleDataSeries: false,onItemHover: {
          highlightDataSeries: false,tooltip: {
        enabled: false,enabledOnSeries: undefined,marker: {
          show: false,}
      }
    };
  }
}

<apx-chart
      [series]="chartOptions.series"
      [chart]="chartOptions.chart"
      [xaxis]="chartOptions.xaxis"
      [dataLabels]="chartOptions.dataLabels"
      [grid]="chartOptions.grid"
      [stroke]="chartOptions.stroke"
      [title]="chartOptions.title"
      #lineChart
    ></apx-chart>

解决方法

您缺少组件中的工具提示属性

<apx-chart
  ...
  [tooltip]="chartOptions.tooltip"
  #lineChart
></apx-chart>