多轴flot图与有序堆积酒吧，而不是堆积任何调整酒吧位置

Question

我需要以下图表的帮助，是与multaxes multiseries，我需要一些酒吧堆叠和其他没有。我粘贴代码，这里是一个演示http://jsfiddle.net/Willem/aAb3E/17/

这是我的第一轴数据（线未堆叠）：

var data1 = [ 
[1375302600000, 33], 
[1375300800000, 26] 
]; 
var data2 = [ 
[1375302600000, 0], 
[1375300800000, 12] 
]; 

这些都是酒吧（用户和日期（第一个值）堆叠）：

var user1_estado1 = [ 
[1375302600000, 20], 
[1375300800000, 40] 
]; 
var user1_estado2 = [ 
[1375302600000, 10], 
[1375300800000, 90] 
]; 
var user1_estado3 = [ 
[1375302600000, 30], 
[1375300800000, 70] 
]; 

var user2_estado1 = [ 
[1375302600000, 20], 
[1375300800000, 40] 
]; 
var user2_estado2 = [ 
[1375302600000, 10], 
[1375300800000, 90] 
]; 
var user2_estado3 = [ 
[1375302600000, 30], 
[1375300800000, 70] 
]; 

我按系列设置了数据集选项; data1和data2没有条和堆栈错误;其他酒吧显示：真和订单设置，因为我希望他们按用户和日期时间solape。

var dataset = [{ 
    label: "Answer", 
    data: data1, 
    bars: { 
     show: false 
    }, 
    stack: false, 
    xaxis: 2 
}, { 
    label: "Not answer", 
    data: data2, 
    bars: { 
     show: false 
    }, 
    stack: false, 
    xaxis: 2 
}, { 
    label: "User1_estado1", 
    data: user1_estado1, 
    bars: { 
     show: true, 
     order:1 
    }, 
    xaxis: 1, 
    yaxis: 2, 
}, { 
    label: "User1_estado2", 
    data: user1_estado2, 
    bars: { 
     show: true, 
     order:1 
    }, 
    xaxis: 1, 
    yaxis: 2, 
}, { 
    label: "User1_estado3", 
    data: user1_estado3, 
    bars: { 
     show: true, 
     order:1 
    }, 
    xaxis: 1, 
    yaxis: 2, 
}, { 
    label: "User2_estado1", 
    data: user2_estado1, 
    bars: { 
     show: true, 
     order:2 
    }, 
    xaxis: 1, 
    yaxis: 2, 
}, { 
    label: "User2_estado2", 
    data: user2_estado2, 
    bars: { 
     show: true, 
     order:2 
    }, 
    xaxis: 1, 
    yaxis: 2, 
}, { 
    label: "User2_estado3", 
    data: user2_estado3, 
    bars: { 
     show: true, 
     order:2 
    }, 
    xaxis: 1, 
    yaxis: 2, 
}]; 

绘制出来，设置barwith（每半年一次）这个我不知道如何调整:(和diferent轴，由现在时间xaxes，但我需要的xaxe1显示每个用户。

var plot = $.plot(
$("#placeholder"), dataset, { 
series: { 
    bars: { 
     barWidth: 60*30*1000, 
     align: "center", 
     fill: true, 
    }, 
    //pointLabels:{show:true, stackedValue: true}, 
}, 
grid: { 
    hoverable: true, 
    clickable: true, 
    tickColor: "#f9f9f9", 
    borderWidth: 2, 
    mouseActiveRadius: 10 
}, 
xaxes: [{ 
    show: true, 
    mode: "time", 
    timeformat: "%H:%M", 
    tickSize: [0.5, "hour"], 
    axisLabel: "Usuario", 
    axisLabelFontSizePixels: 3, 
    axisLabelPadding: 5 
}, { 
    show: true, 
    mode: "time", 
    timeformat: "%H:%M", 
    tickSize: [0.5, "hour"], 
    axisLabel: "Usuarios ocupados", 
    axisLabelFontSizePixels: 3, 
    axisLabelPadding: 5 
}], 
yaxes: { 
    color: "black", 
    axisLabel: "Usuarios ocupados", 
    axisLabelUseCanvas: true, 
    axisLabelFontSizePixels: 8, 
    axisLabelFontFamily: 'Verdana, Arial', 
    axisLabelPadding: 5, 
    tickDecimals: 0 
} 
}); 

我在这里补充一些互动，以呈现出一些提示图。

var previousPoint = null, 
previousLabel = null; 
$("#placeholder").bind("plothover", function (event, pos, item) { 
if (item) { 
    if ((previousLabel != item.series.label) || (previousPoint != item.dataIndex)) { 
     previousPoint = item.dataIndex; 
     previousLabel = item.series.label; 
     $("#tooltip").remove(); 

     var x = new Date(item.datapoint[0]); 
     var y = item.datapoint[1]; 
     var color = item.series.color; 

     showTooltip(item.pageX, item.pageY, color, 
      "<strong>" + item.series.label + "</strong><br>" + (x.getMonth() + 1) + "/"  + x.getDate() + 
      " : <strong>" + y + "</strong> llamadas"); 
    } 
} else { 
    $("#tooltip").remove(); 
    previousPoint = null; 
} 
}); 

function showTooltip(x, y, color, contents) { 
$('<div id="tooltip">' + contents + '</div>').css({ 
    position: 'absolute', 
    display: 'none', 
    top: y - 40, 
    left: x - 30, 
    border: '2px solid ' + color, 
    padding: '3px', 
     'font-size': '9px', 
     'border-radius': '5px', 
     'background-color': '#fff', 
     'font-family': 'Verdana, Arial, Helvetica, Tahoma, sans-serif', 
    opacity: 0.9 
}).appendTo("body").fadeIn(200); 
} 

我的问题是使每个用户和时间（更好的堆叠）的酒吧，并不能叠加的两行。我还喜欢在a中展示xis1是用户的时钟（而不是时间）。

你可以在这里看到它http://jsfiddle.net/Willem/aAb3E/17/

请需要用于驱动这个:)一些帮助。

非常感谢！

Answer 1

为了防止线从堆放，摆脱，你不真的有些选项需要：

var dataset = [{ 
    label: "Answer", 
    data: data1, 
    xaxis: 2 
}, { 
    label: "Not answer", 
    data: data2, 
    xaxis: 2 
}, ... 

说实话，我不完全知道为什么“假”，使他们堆栈;这看起来像一个错误，但在任何情况下，只是删除选项解决了这个问题，因为默认不堆栈。

我不清楚你的意思是“对齐每个用户和时间的酒吧”;你可以解释吗？