我正在使用 apexcharts 并做出反应。我需要隐藏一系列,但我不知道如何在我的代码中实现这些方法。这个想法是使用 data4 进行一些计算并将其显示在自定义工具提示上。如何隐藏图表中的数据4但仍在后台使用数据?
我的代码是这样的
import Chart from 'react-apexcharts'
import React from 'react';
class ApexChart1 extends React.Component {
constructor(props) {
super(props);
this.state = {
series: [{
name: 'Data1',
data: this.props.data.map(d=>{return +d.data1})
}, {
name: 'data2',
data: this.props.data.map(d=>{return +d.data2})
}, {
name: 'data3',
data: this.props.data.map(d=>{return +d.data3})
}, {
name: 'data4',
data: this.props.data.map(d=>{return +d.data3})
}],
options:
{...,
tooltip: {
// console.log()
custom: function({series, seriesIndex, dataPointIndex, w}) {
// Here I want to use the data4 series but hide that data when the chart renders
}
}
}
}
render() {
return (
<div>
<Chart options={this.state.options} series={this.state.series} type="bar" height={425} />
</div>
)}
}
}
感谢您的帮助
我不确定我是否理解你的想法,但如果你想在你的函数中访问 data4 使用:
tooltip: {
// console.log()
custom: function({series, seriesIndex, dataPointIndex, w}) {
let data4 = this.props.data.map(d=>{return +d.data3})
// something to do with data4
}
}
如果您想隐藏图表中的 data4,只需将其从系列中删除,这样您的系列将如下所示:
series: [{
name: 'Data1',
data: this.props.data.map(d=>{return +d.data1})
}, {
name: 'data2',
data: this.props.data.map(d=>{return +d.data2})
}, {
name: 'data3',
data: this.props.data.map(d=>{return +d.data3})
}]
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)