具有对X和Y值的数据

Question

是否可以在Chart.js的data选项中使用X和Y对来创建条形码？

data: [
    ['08/09/2016', 12],
    ['09/09/2016', 19]
],

采用[X, Y]

的形式

我在文档中没有找到任何关于它的参考。我越接近line charts example：

            data: [{
                x: -10,
                y: 0
            }, {
                x: 0,
                y: 10
            }, {
                x: 10,
                y: 5
            }]

Answer 1

没有内置方法可以直接使用数组创建图表。

但是你可以使用Chart.js plugins创建一个小作品。它们允许您处理在整个图表创建过程中触发的事件，例如在初始化之前，调整大小之后等等。

<小时/> 按照一个小插件，使用数组为您填充所有数据：

var myPlugin = {
    // We edit what is happening before the chart is initialized.
    beforeInit: function(chart) {
        var data = chart.config.data;

        // `APIarray` is what you get from your API.
        // For every data in this array ...
        for (var i = 0; i < APIarray.length; i++) {
            // Populate the labels array with the first value ..
            data.labels.push(APIarray[i][0]);
            // .. and the data with the second value
            data.datasets[0].data.push(APIarray[i][1]);
        }
    }
};

然后，您需要将这个新创建的插件添加到Chart插件服务中：

Chart.pluginService.register(myPlugin);

<小时/> 确保在创建图表之前注册插件 之前（在致电 new Chart()之前），否则它将无法正常工作。
我还建议您的图表中有一个空数据（在插件发生之前），以确保您不会拥有您不想要的数据。

您可以看到一个完整的示例on this jsFiddle。