javascript - TickRotor プラグインを使用して Flotchart に描画された余分な線

Question

FlotChart を使用して積み上げ棒グラフを作成しようとしています。私の課題は、最大 5 層までの複数の x 軸ラベルを作成することです。そこで、TickRotor プラグインを使用しようとしました (最初はラベルを垂直に回転させたかったため)。

今、私はいくつかの線を描きたいと思っていて、TickRotor のいくつかの機能を微調整しました。しかし、チャートのどこかに変な線が引かれています。何が起こっているのか教えてください。

の「else」部分は次のplot.hooks.draw.push(function (plot, ctx)とおりです。

if (ticks.length == 0) {
    return;
}
xaxis = plot.getAxes().xaxis;
var box = xaxis.box;
var tick, label, xoffset, yoffset;
var showWeek = false;
for (var i = 0; i < ticks.length; i++) {
    tick = ticks[i];
    if (!tick.label) {
        continue;
    }
    ctx.save();
    ctx.font = font;
    if (rotateTicks <= 90) {
        // Center such that the top of the label is at the center of the tick.
        xoffset = -Math.ceil(Math.cos(radsAboveHoriz) * tick.height) - 10;
        yoffset = Math.ceil(Math.sin(radsAboveHoriz) * tick.height) - 10;
        ctx.translate(Math.round(plot.getPlotOffset().left + xaxis.p2c(tick.v)) + xoffset,
                      box.top + box.padding + plot.getOptions().grid.labelMargin + yoffset);
        ctx.rotate(rotateTicksRads);
    } else {
        // We want the text to facing up, so we have to
        // rotate counterclockwise, which means the label
        // has to *end* at the center of the tick.
        xoffset = Math.ceil(Math.cos(radsAboveHoriz) * tick.height)
                  - Math.ceil(Math.cos(radsAboveHoriz) * tick.width);
        yoffset = Math.ceil(Math.sin(radsAboveHoriz) * tick.width)
                  + Math.ceil(Math.sin(radsAboveHoriz) * tick.height);
        ctx.translate(Math.round(plot.getPlotOffset().left + xaxis.p2c(tick.v) + xoffset),
                      box.top + box.padding + plot.getOptions().grid.labelMargin + yoffset);
        ctx.rotate(-radsAboveHoriz);
    }
    var ticksMe = tick.label.split(" ");

    // draw labels
    ctx.fillText(ticksMe[0], 0, 0);
    if(showWeek){
        ctx.fillText(ticksMe[1], xoffset, yoffset * 2);
        showWeek = false;
    }
    else{
        showWeek = true;
        ctx.moveTo(-4,-10);
        ctx.lineTo(-4,(yoffset * 2));
        ctx.stroke();
    }

    ctx.restore();
}

奇妙な線が描かれている場所を示す画像は次のとおりです。