Typescript AmCharts 4中的可滚动外部图表图例

如何实现AmCharts 4中的相同功能，即拥有一个可滚动的图例，以避免图例占用所有可用空间

在图表4中

legend.divId

不再存在，到目前为止，我只能用

chart.legend.height=am4core.percent（50）控制图例大小，控件是有限的，因为整个内容都呈现为单个SVG元素

我猜需要创建一个单独的图例，然后通过设置
legend.parent=container将图例“附加”但还无法使其工作

当前尝试：
您可以使用定义图例的元素并将其设置为图例的元素

请检查下面的示例，然后单击


/**
* --------------------------------------------------------
*此演示是使用amCharts V4预览版创建的。
* 
*V4是amCharts数据中的最新安装，即
*图书馆系列，将于2009年上半年发布
* 2018.
*
*有关更多信息和文档，请访问：
* https://www.amcharts.com/docs/v4/
* --------------------------------------------------------
*/
/*设置主题*/
am4core.useTheme（am4themes_动画）；
/*创建图表*/
var chart=am4core.create（“chartdiv”，am4charts.PieChart）；
/*添加数据*/
chart.data=[{
“国家”：“立陶宛”，
“升”：501.9
}, {
“国家”：“捷克共和国”，
“升”：301.9
}, {
“国家”：“爱尔兰”，
“升”：201.1
}, {
“国家”：“德国”，
“升”：165.8
}, {
“国家”：“澳大利亚”，
“升”：139.9升
}, {
“国家”：“奥地利”，
“升”：128.3升
}, {
“国家”：“英国”，
“升”：99
}, {
“国家”：“比利时”，
“升”：60
}, {
“国家”：“荷兰”，
“升”：50
}, {
“国家”：“匈牙利”，
“升”：50
}, {
“国家”：“波兰”，
“升”：50
}, {
“国家”：“希腊”，
“升”：50
}, {
“国家”：“意大利”，
“升”：50
}, {
“国家”：“法国”，
“升”：50
}, {
“国家”：“西班牙”，
“升”：50
}];
/*创建系列*/
var series=chart.series.push（新的am4charts.piesteries（））；
series.dataFields.value=“升”；
series.dataFields.category=“country”；
/*禁用标签*/
series.labels.template.disabled=true；
series.ticks.template.disabled=true；
/*创建图例*/
chart.legend=新的am4charts.legend（）；
/*创建一个单独的容器将图例放入其中*/
var legendContainer=am4core.create（“legenddiv”，am4core.Container）；
legendContainer.width=am4core.percent（100）；
legendContainer.height=am4core.percent（100）；
chart.legend.parent=legendContainer；
图表.events.on（“datavalidated”，resizeLegend）；
图表.events.on（“maxsizechanged”，resizeLegend）；
函数resizeLegend（ev）{
document.getElementById（“legenddiv”）.style.height=chart.legend.contentHeight+“px”；
}
正文{
字体系列：-苹果系统、BlinkMacSystemFont、“Segoe UI”、Roboto、Helvetica、Arial、无衬线、“苹果颜色表情”、“Segoe UI表情”、“Segoe UI符号”；
}
#chartdiv，#legendwrapper{
宽度：48%；
高度：200px；
边框：1个点#c99；
利润率：1米0；
显示：内联块；
浮动：左；
}
#传奇人物{
身高：100%；
}
#传奇包装{
溢出x：无；
溢出y：自动；
}

您可以使用定义图例的元素并将其设置为图例的元素

请检查下面的示例，然后单击


/**
* --------------------------------------------------------
*此演示是使用amCharts V4预览版创建的。
* 
*V4是amCharts数据中的最新安装，即
*图书馆系列，将于2009年上半年发布
* 2018.
*
*有关更多信息和文档，请访问：
* https://www.amcharts.com/docs/v4/
* --------------------------------------------------------
*/
/*设置主题*/
am4core.useTheme（am4themes_动画）；
/*创建图表*/
var chart=am4core.create（“chartdiv”，am4charts.PieChart）；
/*添加数据*/
chart.data=[{
“国家”：“立陶宛”，
“升”：501.9
}, {
“国家”：“捷克共和国”，
“升”：301.9
}, {
“国家”：“爱尔兰”，
“升”：201.1
}, {
“国家”：“德国”，
“升”：165.8
}, {
“国家”：“澳大利亚”，
“升”：139.9升
}, {
“国家”：“奥地利”，
“升”：128.3升
}, {
“国家”：“英国”，
“升”：99
}, {
“国家”：“比利时”，
“升”：60
}, {
“国家”：“荷兰”，
“升”：50
}, {
“国家”：“匈牙利”，
“升”：50
}, {
“国家”：“波兰”，
“升”：50
}, {
“国家”：“希腊”，
“升”：50
}, {
“国家”：“意大利”，
“升”：50
}, {
“国家”：“法国”，
“升”：50
}, {
“国家”：“西班牙”，
“升”：50
}];
/*创建系列*/
var series=chart.series.push（新的am4charts.piesteries（））；
series.dataFields.value=“升”；
series.dataFields.category=“country”；
/*禁用标签*/
series.labels.template.disabled=true；
series.ticks.template.disabled=true；
/*创建图例*/
chart.legend=新的am4charts.legend（）；
/*创建一个单独的容器将图例放入其中*/
var legendContainer=am4core.create（“legenddiv”，am4core.Container）；
legendContainer.width=am4core.percent（100）；
legendContainer.height=am4core.percent（100）；
chart.legend.parent=legendContainer；
图表.events.on（“datavalidated”，resizeLegend）；
图表.events.on（“maxsizechanged”，resizeLegend）；
函数resizeLegend（ev）{
document.getElementById（“legenddiv”）.style.height=chart.legend.contentHeight+“px”；
}
正文{
字体系列：-苹果系统、BlinkMacSystemFont、“Segoe UI”、Roboto、Helvetica、Arial、无衬线、“苹果颜色表情”、“Segoe UI表情”、“Segoe UI符号”；
}
#chartdiv，#legendwrapper{
宽度：48%；
高度：200px；
边框：1个点#c99；
利润率：1米0；
显示：内联块；
浮动：左；
}
#传奇人物{
身高：100%；
}
#传奇包装{
溢出x：无；
溢出y：自动；
}

谢谢。我丢失了额外的容器
var legendContainer = am4core.create("legenddiv", am4core.Container);
legendContainer.width = am4core.percent(100);
legendContainer.height = am4core.percent(100);
chart.legend.parent = legendContainer;