如何呈現結束刻度始終使用d3 svg軸

我不知道刻度線的位置如何與d3 svg軸一起工作。我試圖與蜱，tickSize選擇玩，但基本上是我得到的開始和結束蜱「有時」使用隨機數據繪製如何呈現結束刻度始終使用d3 svg軸

http://plnkr.co/edit/i5DBgfWzr2sa8Yugg2A8?p=preview

（請忽略angularjs的方面。我感興趣的部分是如下d3）

var make_x_axis = function() { 
      return d3.svg.axis() 
        .scale(x) 
        .orient("bottom") 
        .ticks(5) 
        .tickFormat("") 
        .tickPadding(8); 
     }; 

     var make_y_axis = function() { 
      return d3.svg.axis() 
        .scale(y) 
        .ticks(6) 
        .orient("left") 
        .tickSize(10,10) 
        .tickPadding(8); 
     };

我該如何總是得到X和Y軸的開始和結束刻度？我清楚地總是得到X軸和Y軸上的開始和結束刻度線（不確定這是怎麼回事 - 我沒有看到鉻檢查器中該位置的.tick元素），但標籤丟失。我可以找到第一個和最後一個滴答聲，並使用滴答標記信息呈現文本，但顯然我不能總是這樣做，因爲有時軸會給我開始滴答聲，而有時它不會。

任何幫助表示讚賞。

謝謝

來源

2014-10-19 user2789284

要做到這一點的唯一方法是使用'axis.tickValues（）'顯式設置刻度值。 – 2014-10-19 19:56:21

@Lars，謝謝你。我會試一試。我也看到這個x軸和y軸添加了一個類域的路徑元素，如下所示=> | --------------------- |我不想在最後滴答滴答。有沒有辦法刪除它？ – user2789284 2014-10-19 20:06:18

嗯，你可以刪除整個路徑，但是你必須繪製一條線來獲取軸線。 – 2014-10-19 20:29:29

我不知道我完全理解你的問題，如果你想刪除的結束x軸蜱，你應該設置

.outerTickSize(0),

如果您想自定義的結束蜱，你可以使用

.tickValues(y.ticks(5).concat(y.domain()));

看看我的JSFiddle進行演示。

來源

2014-10-20 03:15:45

outerTickSize工作得很整齊。關於tickValues（如Lars所建議的），我認爲這很好，但我想知道如何從我的數據值中選擇最好的樣本，即我的數據看起來像（t0，v0）（t1，v1）...（tn，vn ），我想肯定在y軸上包括x軸和v0，vn以及在x和y軸上均勻間隔的5個樣本。有沒有一種聰明的方式在d3中做到這一點？ – user2789284 2014-10-20 06:38:07

您的意思是yAxis從y0到yN，而xAxis不需要開始勾號並將x1顯示到xN？你有沒有看到我的小提琴在上面，我的xAxis和yAxis是否滿足你的需求？或者如果你想將域綁定到tick中，你可以這樣寫：.tickValues（y.ticks（5）.concat（y.domain（））） – 2014-10-20 08:31:54

Huan，感謝你幫助我。你的tickValues在你的條形圖上工作得非常好，但不會與我的系列圖 - 看到這個 - http://plnkr.co/edit/i5DBgfWzr2sa8Yugg2A8?p=preview。關於你如何表達你的tickValues，我認爲這是方向我應該朝前走，但我錯過了一些東西。當我這麼做的時候，我所有的蜱蟲都會在我的地盤的同一個地方崩塌......任何想法？ – user2789284 2014-10-20 17:24:05

如何呈現結束刻度始終使用d3 svg軸

回答

相關問題