无法更改chart.js中的默认值

时间:2015-03-13 03:52:27

标签: javascript charts chart.js

我正在使用以下代码

window.onload = function(){
    Chart.defaults.global.tooltipFillColor = "rgba(255,0,0,0.8)";
    Chart.defaults.global = { 
    tooltipFillColor: "rgba(255,0,0,0.8)",
    tooltipFontFamily: "'Helvetica Neue', 'Helvetica', 'Arial', sans-serif",
    tooltipFontSize: 24,
    tooltipFontStyle: "bold",
    tooltipFontColor: "green",
    }
    var ctx = document.getElementById("canvas").getContext("2d");
    window.myBar = new Chart(ctx).Bar(barChartData, {
        responsive : true
    });
}

我无法一次更改多个值。当我在上面编写代码时,图表完全消失了。

1 个答案:

答案 0 :(得分:2)

您需要在创建图表之前设置默认值。

window.onload = function(){
    Chart.defaults.global.tooltipFillColor = "rgba(255,0,0,0.8)";
    var ctx = document.getElementById("canvas").getContext("2d");
    window.myBar = new Chart(ctx).Bar(barChartData, {
        responsive : true
    });
};

如果要一次更改多个选项,则必须遵循与一个选项相同的模式。以下代码重新定义了Chart.defaults.global。 (即Chart.defaults.global只有tooltipFillColor属性。所有其他属性都将被销毁)。

Chart.defaults.global = {
  tooltipFillColor: "rgba(255,0,0,0.8)"
};

相反,您希望重新定义每个属性:

Chart.defaults.global.tooltipFillColor ="rgba(255,0,0,0.8)";
Chart.defaults.globaltooltipFontFamily ="'Helvetica Neue', 'Helvetica', 'Arial', sans-serif";
Chart.defaults.globaltooltipFontSize =24;
Chart.defaults.globaltooltipFontStyle ="bold";
Chart.defaults.globaltooltipFontColor = "green";