以编程方式为Vaading图表系列创建颜色

问题描述

在Vaading 14.4.2中，是否可以创建具有多个系列的图表（请参见下面的屏幕截图），但是可以通过编程方式计算系列的颜色？具体来说，我可能有约100个系列，但是它们全都与一个“数字”（具体来说是化学元素的质量）相关联。由于我知道应用程序中“数字”（即质量）的范围是100到2000，因此我希望该系列的颜色范围从蓝色（100）到红色（2000）。这样，当用户查看图表时，他们会直观地知道该系列是指一种希贝化学药品（红色）还是一种浅色化学品（蓝色）。

要完成此操作，我想我需要某种方式以编程方式设置系列的颜色，但是我认为Vaading 14.4.2中实际上是不可能的，对吧？

以下是此类图表的示例：

解决方法

数据系列的颜色由自定义属性--vaadin-charts-color-0，-vaadin-charts-color-1，...，--vaadin-charts-color-9定义。您可以像下面这样以编程方式定义它们的值

charts.getElement().getStyle().set("vaadin-charts-color-1","#2dd7a4");

第二个字符串参数是颜色值，可以是CSS接受的任何格式。