是否有一种方法来删除在ApexCharts折线图底部的气泡框?



还没有找到一种方法来删除或隐藏在折线图底部的气泡框。已经查过文档了,还是没有找到,或者是我遗漏了什么。对于这个问题,我很抱歉,对于Angular和apexcharts的使用,我仍然是个初学者。

示例如下:https://codesandbox.io/s/apx-line-basic-forked-iltgss?file=/src/app/app.component.html

我要删除的图片:https://i.stack.imgur.com/8WUoB.jpg

app.component.ts

import { Component, ViewChild } from "@angular/core";
import {
ChartComponent,
ApexAxisChartSeries,
ApexChart,
ApexXAxis,
ApexYAxis,
ApexStroke,
ApexGrid,
ApexFill,
ApexTooltip
} from "ng-apexcharts";
export type ChartOptions = {
series: ApexAxisChartSeries;
chart: ApexChart;
xaxis: ApexXAxis;
yaxis: ApexYAxis;
grid: ApexGrid;
stroke: ApexStroke;
fill: ApexFill;
tooltip: ApexTooltip;
};
@Component({
selector: "app-root",
templateUrl: "./app.component.html",
styleUrls: ["./app.component.css"]
})
export class AppComponent {
@ViewChild("chart") chart: ChartComponent;
public chartOptions: Partial<ChartOptions>;
constructor() {
this.chartOptions = {
series: [
{
name: "",
data: [2, 10, 18, 22, 36, 15, 47, 75, 65, 19, 14, 2, 47, 42, 15]
}
],
chart: {
height: 350,
type: "line",
toolbar: {
show: false
},
zoom: {
enabled: false
}
},
stroke: {
curve: "smooth"
},
grid: {
show: false
},
xaxis: {
labels: {
show: false
},
axisBorder: {
show: false
}
},
yaxis: {
show: false
},
fill: {
type: "gradient",
gradient: {
shade: "dark",
gradientToColors: ["#5156be"],
shadeIntensity: 1,
type: "horizontal",
opacityFrom: 1,
opacityTo: 1,
stops: [100]
}
},
tooltip: {
enabled: true,
followCursor: false,
marker: {
show: false
},
x: {
show: false
},
y: {
formatter: undefined,
title: {
formatter: (seriesName) => seriesName
}
}
}
};
}
}

<div id="chart">
<apx-chart
[series]="chartOptions.series"
[chart]="chartOptions.chart"
[xaxis]="chartOptions.xaxis"
[yaxis]="chartOptions.yaxis"
[grid]="chartOptions.grid"
[stroke]="chartOptions.stroke"
[fill]="chartOptions.fill"
[tooltip]="chartOptions.tooltip"
></apx-chart>
</div>

禁用xaxis工具提示https://apexcharts.com/docs/options/xaxis/#tooltip

tooltip: {
enabled: false,
},

最新更新