Flot繪製額外的垂直網格線

Question

我無法擺脫圖中最後的垂直線。這裏

我複製了問題： http://jsfiddle.net/63BPw/4/

顏色的網格線是暗紅色，它的設置好的只有在JS這部分代碼：

grid: { 
    aboveData: false, 
    hoverable: true, 
    clickable: true, 
    color: "darkred", 
    borderWidth: { 
     top: 0, 
     bottom: 1, 
     left: 0, 
     right: 0 
    } 
} 

控制檯不拋出任何錯誤。我不使用JavaScript文件或外部css文件中的任何邊距。

Answer 1

我認爲這可能是一個錯誤。

問題不在於您的網格設置，而是在每個軸的繪圖中。具體來說，你設置了2個y軸，一個在左邊，一個在右邊。在代碼的深處，它根據軸是否是「最內層」來決定是否繪製一個「條」來附加刻度。當你有2個yaxes時，它不正確地決定你的右邊的yaxis是而不是最裏面，因此繪製一個滴答杆。

相關的代碼，這兩個位都稱爲每軸：

在allocateAxisBoxFirstPhase：

/*note this is only called for axes that have tickLength set 
    but later it is checked as true/false, not undefined 
    (which is what you'd get if you set your yaxis tickLength = 0) */ 
var sameDirection = $.grep(all, function (a) { 
    return a && a.reserveSpace; 
}); 

innermost = $.inArray(axis, sameDirection) == 0; 

在drawGrid：

if (!axis.innermost) { 

    //in here it draws the tick bar 

} 

解決方法：

查找!axis.innermost位並將其更改爲axis.innermost == false。在你的第二個yaxis中設置tickLength = 0。而已。

我已經在這裏實現這兩個變化：http://jsfiddle.net/63BPw/5/

此外，僅供參考我提起這個錯誤：https://github.com/flot/flot/issues/1056