Question

C3.js绘制xy图表的问题。任何帮助将不胜感激。

var T = [];
var F = [];
var n = [];

T.push('T');
F.push('F');

d3.csv("/abc.csv", function(d) {
            {
                True_SJs.push(d[" T"]);
                False_SJs.push(d[" F"]);

            },
            function(error, rows) {
                var chart = c3.generate({
                    bindto: '#roc',
                    data: {
                        x: 'F',
                        columns: [
                            F,
                            T
                        ],
                        order: 'asc',
                        selection: {
                            grouped: true
                        }
                    },
                    zoom: {
                        enabled: true,
                        rescale: true,
                        extent: [1, 10]
                    },
                    tooltip: {
                        format: {
                            title: function(x) {
                                return 'F' + x;
                            }
                        }
                    },
                    grid: {
                        x: {
                            show: true
                        },
                        y: {
                            show: true
                        }
                    }
                });
            });

预期输出应该从4点的顶点开始，然后连接下一点。以下是示例http://c3js.org/samples/simple_xy.html

的链接

Answer 1

这是因为您的数据具有重复的x值，并且相应的y值上升然后下降。像

这样的东西

 F => ['F', .... 4, 4, 4, ...];
 T => ['T', .... 21, 23, 22, ...];

如果希望线条连续，则可以在F（X）值相等时对T值进行排序。像

这样的东西

// construct an array of arrays - each element contains the T values for an F value
var groupedT = [];
T.forEach(function (e, i) {
    // skip element 0 (the label)
    if (i) {
        groupedT[T[i]] = groupedT[T[i]] || [];
        groupedT[T[i]].push(e);
    }
})
// flattening array of arrays
T = groupedT.reduce(function (a, b) {
    return a.concat(b.sort());
}, ['T']);

在生成图表之前，您将获得所需的信息。

C3.js绘制xy图表，线之间没有正确连接

1 个答案: