Javascript chart.js是否将一个条形设置为不同的颜色？

因此，我有一段代码，它以我需要的格式愉快地显示了一个图形：

<script>var ChartTitleOps = {

showTooltips: true,
tooltipFillColor: "#e64c65",
tooltipFontFamily: "'Bree Serif', sans-serif",
tooltipFontColor: "#fff",
tooltipTemplate: "<%if (label){%><%=label%> <%}%>(<%= value %> votes)",
barValueSpacing : 2,
scaleLineWidth: 10,

    scaleFontFamily: "'Bree Serif', sans-serif",responsive: false,animation: false,maintainAspectRatio: false,scaleIntegersOnly: true,scaleShowGridLines : false,scaleBeginAtZero : true,scaleFontSize: 17,scaleFontColor: "#FFFFFF",scaleOverride:true,scaleSteps:<?php echo $highestVoteCount ?>,scaleStepWidth:1,scaleStartValue:0,scaleGridLineColor : "#1f253d"}; var ChartTitleData = {labels : [<?php styleFinishedVoteAmounts($votesPlaced); ?>],datasets : [{
                fillColor   : "rgba(52,104,175,0.7)",
                strokeColor : "rgba(52,104,175,1)",
                data        : [<?php styleFinishedVoteCount($VoteCounts); ?>]
            }]};var wpChartChartTitleBar = new Chart(document.getElementById("ChartTitle").getContext("2d")).Bar(ChartTitleData,ChartTitleOps);
</script>

var ChartTitleOps={
showTooltips:true，
工具提示FillColor:#e64c65“，
tooltipFontFamily:“'Bree衬线'，无衬线”，
tooltipFontColor:#fff“，
ToolTiptTemplate:“（投票）”，
barValueSpacing:2，
刻度宽度：10，
scaleFontFamily:“'Bree Serif'，sans Serif”，“responsive:false”，“animation:false”，“MaintaintAspectRatio:false”，“ScaleIntegerly:true”，“scaleShowGridLines:false”，“scaleBeginAtZero:true”，“scaleFontSize:17”，scaleFontColor:#FFFFFF”，“scaleOverride:true”，“scaleStepWidth:1”，“scaleStartValue:0”，“scaleGridLineColor:#1f253d”}；var ChartTitleData={labels:[]，数据集：[{
填充颜色：“rgba（52104175,0.7）”，
strokeColor:“rgba（52104175,1）”，
数据：[]
}]};var wpChartTitlebar=新图表（document.getElementById（“ChartTitle”）.getContext（“2d”））.Bar（ChartTitleData，ChartTitleOps）；

---

我希望该图形中的一个条形图显示为与上述代码中设置的颜色不同的颜色。

您可以在创建图表后更改条形图元素的颜色

在

new Chart（）

语句之后，您可以访问和修改图表元素属性，并按如下方式更新图表：

var wpChartChartTitleBar = new Chart(document.getElementById("myChart").getContext("2d")).Bar(ChartTitleData, ChartTitleOps);

// Change 2nd bar to red (display).
wpChartChartTitleBar.datasets[0].bars[1].fillColor = "rgba(229,12,12,0.7)";
wpChartChartTitleBar.datasets[0].bars[1].strokeColor = "rgba(229,12,12,1)";

// Change 2nd bar to red (highlight setting on mouse over)
wpChartChartTitleBar.datasets[0].bars[1].highlightFill = "rgba(0,229,0,0.7)";
wpChartChartTitleBar.datasets[0].bars[1].highlightStroke = "rgba(0,229,0,1)";

wpChartChartTitleBar.update();

---

请参阅。

由于rtome的方法在较新版本的Chart.js中似乎不起作用，下面是当前版本（截至本文的2.9.3版）中不同条形图颜色的工作示例

var ctx=document.getElementById（“myChart”）.getContext（“2d”）；
var图表=新图表（ctx{
//我们要创建的图表类型
类型：“水平条”，
//我们的数据集的数据
数据：{
标签：[“一月”、“二月”、“三月”、“四月”、“五月”、“六月”、“七月”]，
数据集：[{
标签：“我的第一个数据集”，
背景颜色：[
“rgb（255、99、132）”，
“rgb（255、159、64）”，
“rgb（255、205、86）”，
“rgb（75192192）”，
“rgb（54162235）”，
“rgb（153102255）”，
rgb（201、203、207）
],
边框颜色：“rgb（255、99、132）”，
数据：[3,10,5,2,20,30,45]
}]
},
//配置选项在这里
选项：{}
});
画布{
-moz用户选择：无；
-webkit用户选择：无；
-ms用户选择：无；
}
身体{
利润上限：35px；
}
#容器{
宽度：95%；
左边距：自动；
右边距：自动；
页边距底部：自动；
}

条形图颜色示例
工作正常！非常感谢您抽出时间来帮助我！：）可能的副本谢谢！我正在寻找一种方法，当标签符合一定的标准时，给它一个不同的颜色。但当我看到这个片段并意识到“backgroundColor”可能是一个数组时。我知道这个解决方案也会奏效！