y 轴上带有文本的 XY amchart 不起作用

Question

我正在尝试绘制 Amchart 的反转值轴。

它打印错误““货币”系列的数据字段未正确定义”。

我认为基于文本的 y 轴存在一些问题。

这是我的代码：

    
    function XYChart() {
      let myData = [
        {
          year: "2008",
          label: "COLOCATION",
        },
        // other objects
      ];
      useEffect(() => {
        am4core.useTheme(am4themes_animated);
        var chart = am4core.create("chartdiv", am4charts.XYChart);
        chart.data = myData;
        var xAxis = chart.xAxes.push(new am4charts.CategoryAxis());
        xAxis.dataFields.category = "year";
        xAxis.renderer.opposite = false;

        var yAxis = chart.yAxes.push(new am4charts.CategoryAxis());
        yAxis.dataFields.category = "label";
        yAxis.renderer.inversed = false;
        yAxis.renderer.grid.template.disabled = true;
        yAxis.renderer.labels.template.disabled = true;
    
        var series1 = chart.series.push(new am4charts.LineSeries());
        series1.dataFields.valueY = "label";
        series1.dataFields.categoryX = "year";
        series1.name = "Currency";
        series1.strokeWidth = 3;
        series1.bullets.push(new am4charts.CircleBullet());
        series1.tooltipText = "{name} in {categoryX}: {valueY}";
        series1.legendSettings.valueText = "{valueY}";
        series1.visible = false;
    
        chart.cursor = new am4charts.XYCursor();
        chart.cursor.behavior = "zoomY";
    
        chart.legend = new am4charts.Legend();
      });
    
      return (
          <div id="XYChartDiv"></div>
      );
    }
    
    export default XYChart;

Answer 1

对于双类别轴，您需要将系列数据字段设置为 categoryX 和 categoryY - 您的代码使用的是 valueY，它仅适用于数值轴。

y 轴上带有文本的 XY amchart 不起作用

XY amchart with text on yAxis not wok

amcharts

ecmascript-6

reactjs