Javascript Flotr2颜色不工作

Javascript Flotr2颜色不工作,javascript,data-visualization,flotr2,Javascript,Data Visualization,Flotr2,我刚刚收到一本斯蒂芬·托马斯的书,名叫《Javascript数据可视化》,我正在练习。第一章是关于Flotr2的。以下是这本书告诉我要做的: var wins = [[[0, 13], [1, 11], [2, 15], [3, 15], [4, 18], [5, 21], [6, 28]]]; var wins2 = [[[0,28], [1,28], [2, 21], [3,20], [4,19]]]; var years = [[0, "2006"], [1, "2007"], [2, "

我刚刚收到一本斯蒂芬·托马斯的书,名叫《Javascript数据可视化》,我正在练习。第一章是关于Flotr2的。以下是这本书告诉我要做的:

var wins = [[[0, 13], [1, 11], [2, 15], [3, 15], [4, 18], [5, 21], [6, 28]]];
var wins2 = [[[0,28], [1,28], [2, 21], [3,20], [4,19]]];
var years = [[0, "2006"], [1, "2007"], [2, "2008"], [3, "2009"], [4, "2010"], [5, "2011"], [6, "2012"]];
var teams = [[0, "MCI"], [1, "MUN"], [2, "ARS"], [3, "TOT"], [4, "NEW"]];
window.addEventListener('load', function() {
    Flotr.draw(document.getElementById('chart2'), wins2, {
        title: "Premier League Wins (2011-2012)",
        colors: ['#89afd2', '#1d1d1d', '#df021d', '#0e204b', '#e67840'],
        bars: {
            show: true,
            barWidth: 0.5,
            shadowSize: 0,
            fillOpacity: 1,
            lineWidth: 0
        },
        yaxis: {
            min: 0,
            tickDecimals: 0
        },
        xaxis: {
            ticks: teams
        },
        grid: {
            horizontalLines: false,
            verticalLines: false
        }
    });
});

现在,这与书中的唯一区别是,书中告诉我要执行window.onload,而我使用addEventListener。这本书说,这应该是一个具有多种颜色(列出的颜色)的条形图,但我所有的条形图都是相同的颜色,这是列出的第一种颜色。我什么都试过了,但似乎都没用。还有其他人在Flotr2中遇到过这个问题吗?我使用的是最新版本,所以这仅仅是自本书问世以来新推出的Flotr2的一个问题吗?还是我做错了什么?

我想这可能与您的阵列有关

var wins2 = [[[0,28], [1,28], [2, 21], [3,20], [4,19]]];
这将生成一个包含1个数组的数组,该数组包含4个数组。所以flotr看到只有一个索引,这就是为什么它只使用一种颜色

试一试

试试这个

var wins2 = [[[0,28]],[[1,28]],[[2,21]], [[3,20]],[[4,19]]];

好奇,这对窗户有用吗。超负荷?不,我也试过了。不走运,很有趣。该书是否列出了特定的Flotr2版本?如果是这样的话,我会尝试使用它来查看它是否是一个版本特定的问题。您可能还想尝试在Github问题页面上询问Flotr2:外部数组可以包含Flotr中的多个数据点系列,但原始数据集(
wins
)只有一个系列。新数据集确实需要指定为
var wins2=[[0,28]]、[[1,28]]、[[2,21]]、[[3,20]]、[[4,19]]
var wins2 = [[[0,28]],[[1,28]],[[2,21]], [[3,20]],[[4,19]]];