javascript - 如何在自定义 TFS 小部件中更改饼图颜色

Question

我必须在自定义中更改默认条形颜色，tfs widget我该怎么做？我知道有一个"color"选项，但我找不到正确的语法。谢谢。

这是我的图表代码：

             chartOptions = {
                "hostOptions": {
                    "height": "290",
                    "width": "300"
                },
                "chartType": "bar",
                "series": [{
                    "data": [myBugs, myVuln, myCodeSm]
                }],
                "xAxis": {
                    "labelValues": ["Bugs", "Vulnerabilities", "Code smells"]
                },
                "specializedOptions": {
                    "showLabels": "true",
                    "size": 200
                }
            };

标签： javascripttfswidget

Answer 1

在 vss-web-extension-sdk/typings/charts.d.ts 我发现 customColors 是一个 ColorEntry 数组。ColorEntry 有两个字符串属性：value、backgroundColor。经过反复试验，我发现该值应该是您要为其设置颜色的标签。

所以我认为这应该有效：

chartOptions = {
            "hostOptions": {
                "height": "290",
                "width": "300"
            },
            "chartType": "bar",
            "series": [{
                "data": [myBugs, myVuln, myCodeSm]
            }],
            "xAxis": {
                "labelValues": ["Bugs", "Vulnerabilities", "Code smells"]
            },
            "colorCustomizationOptions": {
                "customColors": [
                    {backgroundColor: "#FF0000", value: "Bugs"},
                    {backgroundColor: "#00CC00", value: "Vulnerabilities"},
                    {backgroundColor: "#302772", value: "Code smells"}
                ]
            },
            "specializedOptions": {
                "showLabels": "true",
                "size": 200
            }
        };