问题描述
我使用 Angular 11 和 ng2-charts 在我的应用程序中绘制图表。我有一个绘制水平堆积条形图的组件，并且每个图表总是只有一个条形图。我想为条形图设置圆角，因此我使用了在此堆栈闪电战中找到的代码：https://stackblitz.com/edit/chart-js-horizontalbar-rounded-corners
上面 stackblitz 中的代码是为普通条形图（不是堆叠的）制作的，并在堆叠条形的每个部分的每个右侧产生圆角。所以我调整代码的方式是，只有最后一个小节在右边有圆角，但第一个在左边也有圆角。到目前为止一切顺利，就像一个魅力。
但前提是我在一个视图中只使用这个组件一次。如果我在我的视图中两次使用该组件，并且有不同数量的条形部件（堆叠条形 A 由 3 个堆叠条形组成，堆叠条形 B 由 4 个堆叠条形组成），这将不再起作用。似乎 draw 函数只能访问两个图表之一的图表数据，而不是两个图表。该函数被非常频繁地调用，当我记录图表数据时，我可以看到它只为第二个组件调用，从不为第一个组件调用。我的示例中的结果是，堆叠的条形 A 在右侧没有圆角。
您可以在 stackblitz 中看到详细信息，但我想这是相关的行：
Chart.elements.Rectangle.prototype.draw = function () {
...
}
这个函数表达式在我组件的构造函数中，包含圆角的所有逻辑。我不是 chart.js 的专家。在我看来，这个函数表达式改变了一些全局设置，就像一般绘制 recangles 一样。
是否有可能以某种方式从我的组件中获取图表的实例并仅将更改应用于该实例？
解决方法
暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！
如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@）