Question

我无法正确显示第二个y轴线图。正如你所看到的那样，当我期望只有一条线随着每个时间点上下移动时，我最终都会看到整条线上的线条。任何人都能指出我的错误吗？

var options = {
    xaxis: {
        mode: "time",
        twelveHourClock: true,
        timezone: "browser"
    },
    yaxes: [
        //yaxis 1
        {
            position: "left",
            clolor: "black",
            axisLabel: "Count",
            axisLabelUseCanvas: true,
            axisLabelFontSizePixels: 12,
            axisLabelFontFamily: 'Verdana, Arial'
        }, {
            position: "right",
            clolor: "black",
            axisLabel: "Process Time (ms)",
            axisLabelUseCanvas: true,
            axisLabelFontSizePixels: 12,
            axisLabelFontFamily: 'Verdana, Arial'
        }
    ],
    colors: ["rgb(87, 136, 156)"],
    grid: {
        hoverable: true,
        clickable: true,
        borderWidth: 0,
        borderColor: "#efefef"
    },
    selection: {
        mode: "x"
    }
};

plot = $.plot($("#updating-chart"), 
              [{ data: data1, label: "Total", bars: { show: true, barWidth: 30 * 60000 } }, 
               { data: data2, label: "Process Time", yaxis: 2, lines: { show: true }, color: "#FF0000" }],             options);

http://jsfiddle.net/jguypztt/

Answer 1

只需对data2进行排序

data2.sort(function(a, b) { return a[0] - b[0]; });

小提琴 - http://jsfiddle.net/vw5kjutg/

flot第二yaxis线没有正确绘图

1 个答案: