答案 0 :(得分:5)
如果您想使图例的内容(即图例项在右侧)而不是整个图例本身对齐(我想是这样,因为图例位于外部自定义<div>
中,并且直接从我们的主题指南中删除。如果您有其他意思,请告知我们。),则必须更改其layout
,然后对齐其内容通过contentAlign
向右移动。例如
// Align legend items to the right
chart.legend.layout = "vertical";
chart.legend.contentAlign = "right";
这是一个演示:
https://codepen.io/team/amcharts/pen/0aa8b7741a25a86fafa48b747077b8e3
我强烈建议您查看我们的指南"Working with Containers",其中包含有关在amCharts v4中进行布局的各种详细信息。此外,将所有内容向右对齐后,图例仍将被锁定在其html包装器的高度中,即您的情况下为150px
,而无法访问其余内容。上面的演示是我们"Making the external legend scrollable" guide中发现的内容的一个分支。
答案 1 :(得分:3)
legend.align
不起作用,因为图例的宽度为100%
。
父级Container在布置其子级时使用。
您应将内容与legend.contentAlign
对齐:
chart.legend.contentAlign = 'right';
Here我分叉了您的密码笔以显示结果。
代码笔中的另一个错误是legend.valign
的值
有效值为:
“顶部” | “中间” | “底部” | “没有”
请参见VerticalAlign。
所以您应该这样设置:
chart.legend.valign = 'middle';