Javascript 多轴flot图表，带有序堆叠条，不堆叠，也不调整条位置

我需要以下图表的帮助，这是一个多轴的多系列，我需要一些堆叠的条形图，而其他的则不需要。我粘贴代码，这里是一个演示

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

以下是条形图（按用户和日期（第一个值）堆叠）：

我按系列设置数据集选项；数据1和数据2无条和堆栈错误；其他栏显示：true和顺序集，因为我希望它们按用户和日期时间进行排序

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,
}];

绘制它们，设置Bar（每半个时间），我不知道如何调整：（，以及不同的轴，现在按时间显示Xaxe，但我需要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);
}

var-previousPoint=null，
previousLabel=null；
$（“#占位符”）.bind（“plothover”，函数（事件、位置、项目）{
如果（项目）{
if（（previousLabel！=item.series.label）| |（previousPoint！=item.dataIndex））{
previousPoint=item.dataIndex；
previousLabel=item.series.label；
$（“#工具提示”）.remove（）；
var x=新日期（item.datapoint[0]）；
变量y=项目数据点[1]；
var color=item.series.color；
显示工具提示（item.pageX、item.pageY、颜色、，
“”+item.series.label+”
“+（x.getMonth（）+1）+“/”+x.getDate（）+
“：”+y+“llamadas”）；
}
}否则{
$（“#工具提示”）.remove（）；
previousPoint=null；
}
});
函数显示工具提示（x、y、颜色、内容）{
$（''+内容+''）.css({
位置：'绝对'，
显示：“无”，
顶部：y-40，
左：x-30，
边框：“2倍纯色”+彩色，
填充：“3px”，
“字体大小”：“9px”，
“边界半径”：“5px”，
“背景色”：“fff”，
“字体系列”：“Verdana、Arial、Helvetica、Tahoma、sans serif”，
不透明度：0.9
}).appendTo（“body”）.fadeIn（200）；
}

我的问题是按用户和时间对齐条（最好是堆叠），而不是堆叠两行。我还喜欢在axis1中按用户显示刻度（而不是时间）

你可以在这里看到

请需要一些驾驶帮助：）

---

多谢各位

要防止线条堆叠，请去掉一些您并不真正需要的选项：

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

老实说，我不完全清楚为什么“false”会导致它们堆叠；这看起来像是一个bug，但在任何情况下，只要删除该选项就可以解决问题，因为默认情况下不进行堆栈

---

我不清楚你所说的“按用户和时间对齐条”是什么意思；您能解释一下吗？

谢谢，我确实覆盖了选项，首先是在系列中，然后是在选项中。我已经把代码清理干净了。但是我不能用相同的时间线同时解决两张图表的问题。我打算放弃这个想法，做两张不同的图表。

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);
}

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