如何使用 AMCharts V5 添加 X 軸和 Y 軸標題

Question

我正在使用 amCharts Version 5。如何沿 xAxis 和 y Axis 添加標簽。 我正在使用 ValueAxis（在 XY 圖表中）。 附上下面的圖片以便更好地理解

我能夠找到有關如何在 V4 而不是 V5 中實現它的文檔。

在 V4 中：

valueAxis.title.text = "營業額 ($M)";

X 軸 Y 軸標簽

Answer 1

使用amCharts 5 ，您可以使用此處介紹的Label類： Labels – amCharts 5 Documentation

完整的參考資料在那里： Label – amCharts 5 Documentation

因此，您只需使用new方法為每個軸創建一個Label實例即可。 我建議您在xAxis.children上push一個實例，並在unshift上取消移動另一個yAxis.children 。 如果您每次都使用push ，由於軸子項的自然順序，您可能需要一些額外的定位工作。

您將在下面找到一個示例。

 am5.ready(() => { let root = am5.Root.new("chartdiv"); let chart = root.container.children.push(am5xy.XYChart.new(root, {})); let xAxis = chart.xAxes.push(am5xy.CategoryAxis.new(root, { categoryField: "category", renderer: am5xy.AxisRendererX.new(root, {}) })); xAxis.children.push(am5.Label.new(root, { text: 'xAxis title', textAlign: 'center', x: am5.p50, fontWeight: 'bold' })); let yAxis = chart.yAxes.push(am5xy.ValueAxis.new(root, { renderer: am5xy.AxisRendererY.new(root, {}) })); yAxis.children.unshift(am5.Label.new(root, { text: 'yAxis title', textAlign: 'center', y: am5.p50, rotation: -90, fontWeight: 'bold' })); let series = chart.series.push(am5xy.ColumnSeries.new(root, { name: "Series", xAxis: xAxis, yAxis: yAxis, valueYField: "value", categoryXField: "category" })); let data = [ { category: "Foo", value: 1337 }, { category: "Bar", value: 42 } ]; xAxis.data.setAll(data); series.data.setAll(data); });

 #chartdiv { width: 100%; height: 350px; }

 <script src="https://cdn.amcharts.com/lib/5/index.js"></script> <script src="https://cdn.amcharts.com/lib/5/xy.js"></script> <div id="chartdiv"></div>