如何始终使用 d3 svg 轴渲染结束刻度

use*_*284 4 svg d3.js

我不确定刻度位置如何与 d3 svg 轴配合使用。我尝试使用刻度、tickSize 选项,但基本上我“有时”会使用随机数据绘制开始和结束刻度

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);
        };
Run Code Online (Sandbox Code Playgroud)

如何始终为 X 轴和 Y 轴呈现开始和结束刻度?很明显,我总是在 X 和 y 轴上得到开始和结束刻度线(不确定这是怎么发生的 - 我在 chrome 检查器中的那个位置没有看到 .tick 元素)但是标签丢失了。我可以找到第一个和最后一个刻度并渲染带有刻度标签信息的文本,但显然我不能总是这样做,因为有时轴给了我开始刻度,有时它没有。

任何帮助表示赞赏。

谢谢

hua*_*eng 5

我不确定我是否完全理解你的问题,如果你想删除结束的 x 轴刻度,你应该设置

d3js V3

.outerTickSize(0),
Run Code Online (Sandbox Code Playgroud)

d3js V4 - V6

tickSizeOuter(0)
Run Code Online (Sandbox Code Playgroud)

如果要自定义结束刻度,可以使用

.tickValues(y.ticks(5).concat( y.domain() ));
Run Code Online (Sandbox Code Playgroud)

看看我的JSFiddle进行演示。