动态调整 amCharts 4 图表大小时触发响应行为
Triggering responsive behavior when dynamically resizing amCharts 4 chart
最新版本的 amCharts（我使用的是 v4.7.8）包括一些允许响应式图表设计的机制。我正在尝试利用 chart.responsive.rules 功能，该功能允许根据图表大小（and/or 内部图表元素）使用不同的图表 属性 值。
与此同时，我们在所有图表上实施了 "zoom" 功能。每个图表都包裹在一个 "zoomable" 容器元素中，图表的样式设置为容器宽度的 95%。单击 "zoom" 图标按钮时，容器设置为 position: fixed; top: 3rem; right: 3rem; bottom: 3rem; left: 3rem;，大部分填满屏幕。
问题是图表只是……似乎没有注意到这一点。如果我 创建 缩放尺寸的图表，它会使用正确的规则集，但如果我以较小的尺寸创建图表，然后将其调整为较大尺寸，它会继续使用 "small" 规则集。我试过在调整大小后调用 chart.appear、chart.invalidate 和 chart.deepInvalidate，但结果始终相同：图表使用最初初始化时使用的任何规则集呈现。
让我觉得至少发生了一些事情（虽然时间不对）的一件事是当我放大（所以图表是全屏的）然后使用水平滚动条时，滚动条移动得更快比我的鼠标光标 - 几乎就好像它认为它比它小。这符合我的初步印象。但是，一旦我将图表的大小重新调整为较小的尺寸，滚动条的移动速度 比我的鼠标光标慢 ，就好像它认为图表比实际的大。
这整个过程都是通过多个 LitElement 网络组件完成的，因此很难提供 fiddle/codepen 示例，但如果有必要，我可以模拟一个示例，至少应该可以演示问题。我不确定这是否有必要，因为我怀疑知道他们在说什么的人会立即知道这个问题的答案，但如果你认为它会有所帮助，请告诉我，我会看看我的答案可以做。
编辑：我找到了解决方法，但它并不理想。我发现如果我在 zoom in/out 上完全处理现有图表并以新尺寸完全重新创建它，那么它会按照我想要的方式运行，但是重新创建其中一些图表需要大量处理器。我仍然非常希望找到一个可以利用当前图表并重新计算其布局的解决方案。
调整大小后尝试使用 setTimeout(()=>{chart.responsive.enabled = false;chart.responsive.enabled = true; })
原来，答案是 amCharts 4 不支持我试图通过响应规则更改的实际属性。有问题的属性是 groupData 和 groupCount。支持人员告诉我，围绕这些功能的逻辑被认为过于复杂，无法支持动态更新。我请他们重新考虑那个决定。我们将看看他们是否这样做。
同时我为解决我的问题所做的是创建两个图表，一个配置为较大尺寸，一个配置为较小尺寸，我只是在缩放时换掉显示哪个 in/out.
最新版本的 amCharts（我使用的是 v4.7.8）包括一些允许响应式图表设计的机制。我正在尝试利用 chart.responsive.rules 功能，该功能允许根据图表大小（and/or 内部图表元素）使用不同的图表 属性 值。
与此同时，我们在所有图表上实施了 "zoom" 功能。每个图表都包裹在一个 "zoomable" 容器元素中，图表的样式设置为容器宽度的 95%。单击 "zoom" 图标按钮时，容器设置为 position: fixed; top: 3rem; right: 3rem; bottom: 3rem; left: 3rem;，大部分填满屏幕。
问题是图表只是……似乎没有注意到这一点。如果我 创建 缩放尺寸的图表，它会使用正确的规则集，但如果我以较小的尺寸创建图表，然后将其调整为较大尺寸，它会继续使用 "small" 规则集。我试过在调整大小后调用 chart.appear、chart.invalidate 和 chart.deepInvalidate，但结果始终相同：图表使用最初初始化时使用的任何规则集呈现。
让我觉得至少发生了一些事情（虽然时间不对）的一件事是当我放大（所以图表是全屏的）然后使用水平滚动条时，滚动条移动得更快比我的鼠标光标 - 几乎就好像它认为它比它小。这符合我的初步印象。但是，一旦我将图表的大小重新调整为较小的尺寸，滚动条的移动速度 比我的鼠标光标慢 ，就好像它认为图表比实际的大。
这整个过程都是通过多个 LitElement 网络组件完成的，因此很难提供 fiddle/codepen 示例，但如果有必要，我可以模拟一个示例，至少应该可以演示问题。我不确定这是否有必要，因为我怀疑知道他们在说什么的人会立即知道这个问题的答案，但如果你认为它会有所帮助，请告诉我，我会看看我的答案可以做。
编辑：我找到了解决方法，但它并不理想。我发现如果我在 zoom in/out 上完全处理现有图表并以新尺寸完全重新创建它，那么它会按照我想要的方式运行，但是重新创建其中一些图表需要大量处理器。我仍然非常希望找到一个可以利用当前图表并重新计算其布局的解决方案。
调整大小后尝试使用 setTimeout(()=>{chart.responsive.enabled = false;chart.responsive.enabled = true; })
原来，答案是 amCharts 4 不支持我试图通过响应规则更改的实际属性。有问题的属性是 groupData 和 groupCount。支持人员告诉我，围绕这些功能的逻辑被认为过于复杂，无法支持动态更新。我请他们重新考虑那个决定。我们将看看他们是否这样做。
同时我为解决我的问题所做的是创建两个图表，一个配置为较大尺寸，一个配置为较小尺寸，我只是在缩放时换掉显示哪个 in/out.