修复了 ApexCharts React 上的 y 轴值

如何解决修复了 ApexCharts React 上的 y 轴值

我试图在真实的时间线图中以赫兹为单位表示来自用户麦克风的输入（对应于从第二个八度到第六个八度的每个音符）。我正在尝试实现以下目标：this

现在我得到：this。如果我使用格式化程序功能，我会得到：this。

我的问题是我需要替换 Y 轴上八度音阶（A2、B2、C2、D2、E2、F2、G2 等）的赫兹值。

我的配置：

 const initialOptions = {
    chart: {
      id: "realtime",height: 350,type: "line",animations: {
        enabled: true,easing: "linear",dynamicAnimation: {
          speed: 20,},toolbar: {
        show: false,zoom: {
        enabled: true,type: "x",autoScaleYaxis: true,zoomedArea: {
          fill: {
            color: "#90CAF9",opacity: 0.4,stroke: {
            color: "#0D47A1",width: 1,dataLabels: {
      enabled: true,stroke: {
      curve: "smooth",width: 0.99,opacity: 1,markers: {
      size: 0,plotOptions: {
      bar: {
        horizontal: false,legend: {
      show: false,dataLabels: {
      offsetX: 0,enabled: true,xaxis: {
      show: true,categories: [0],tickAmount: 10,// optional tickAmount value
    },};

我尝试更新 useEffect 上的选项，如下所示：

 yaxis: {
          tickAmount: 1,labels: {
            enabled: true,formatter: function (val,index) {
              return currentNote; // This prints the same output on each line of the Y axis as in picture 2
            },

我已经被这个问题困扰了好几天了，我不确定是否应该转到另一个图书馆。欢迎提出任何建议！