如何在d3.js中顯示選定的刻度標籤

我正在使用d3庫創建甘特圖。到目前爲止，我已經做了類似這樣的圖片的東西：如何在d3.js中顯示選定的刻度標籤

enter image description here

然而，正如你可以看到，在整軸最左邊和最右邊12AM標籤正在運行的開箱。所以，我想知道是否有辦法從凌晨2點開始計時，並在晚上10點結束？

我定義小時軸這樣的：

x1HourAxis 
    .ticks(d3.time.hours, 2) 
    .tickFormat(d3.time.format('%I %p'));

我想保持這種配置，但正如我所說的，我想從此2AM凌晨4點開始的時間......直到上午10點，所以我在圖表上沒有這種不好的視覺效果

來源

2013-05-01 ppoliani

一種選擇是顯式設置要顯示的刻度值。你可以用axis.tickValues([values])

你軸線做到這一點，你的具體情況，將x1HourAxis，我相信values將[2, 4, 6, 8, 10, 12, 14, 16, 18, 20, 22]，但你可能需要或者讓他們爲時間值（如下午2:00）或其他的ms值。我沒有明確設定時間尺度的值，所以我不完全確定這個約定是什麼。

來源

2013-05-01 15:33:26 ckersch

不知道你能做到這一點的時間尺度上，我認爲它只能與定量秤工作;我會給它一個 – ppoliani 2013-05-01 15:37:27

axis.tickValues適用於定量比例尺，但不適用於時間尺度。 – Seri 2014-08-13 13:45:25

你有更多的代碼？這很難說是怎麼回事，但你可以嘗試：

x1HourAxis 
.ticks(d3.time.hours, 2) 
.tickFormat(d3.time.format('%I %p')) 
.tickSize(some value here for major tick size, some value here for minor tick size, 0);

在axis.tickSize（）設置的最後一個參數爲0，將抑制結束蜱。

見：https://github.com/mbostock/d3/wiki/SVG-Axes

來源

2013-05-01 15:36:37 rysloan

是否將刻度大小設置爲零還能抑制刻度標籤？ – ckersch 2013-05-01 16:07:48

如何在d3.js中顯示選定的刻度標籤

回答

相關問題