Amcharts5图例垂直对齐配置不生效问题如何解决？

问题根因 #

你配置的XYChart使用了horizontalLayout水平布局，该布局会自动排列所有直接子元素的位置，手动为图例设置的y、centerY属性会被布局逻辑覆盖，因此无法生效。

解决方法 #

方案1：保留图表水平布局，让图例脱离自动排列

给图例添加isMeasured: false属性，即可跳过布局的自动位置计算，让手动设置的坐标生效。同时补充水平对齐的配置实现右上角定位：

var legend = chart3.children.push(
  am5.Legend.new(root3, {
    centerY: am5.percent(0),
    y: am5.percent(0),
    centerX: am5.percent(100),
    x: am5.percent(100),
    isMeasured: false
  })
);
// 绑定图表系列到图例，确保系列条目正常显示
legend.data.setAll(chart3.series.values);

方案2：移除图表的水平布局配置

如果你的图表没有必须使用水平布局的需求，可以直接删掉XYChart的layout配置，后续手动设置的图例坐标也会正常生效：

// 修改XYChart初始化代码，删除layout配置
var chart3 = root3.container.children.push(
  am5xy.XYChart.new(root3, {}),
);

// 图例初始化补充水平对齐配置即可
var legend = chart3.children.push(
  am5.Legend.new(root3, {
    centerY: am5.percent(0),
    y: am5.percent(0),
    centerX: am5.percent(100),
    x: am5.percent(100)
  })
);
legend.data.setAll(chart3.series.values);

内容的提问来源于stack exchange，提问作者Koori koori