D3 V4は、だからここ線X1値

Question

を刻みシナリオです：私はX軸設定

：axisLeft().tickSize(-width)、y軸に対して同じことを、これは軸の外にグリッドを作る：

をすることは可能それをですティックラインからグリッドを作成し、同時にこのようなティック値を指すようにしますか？

（この例では、私は目盛り線までてmanualy X1の値を設定します）。

Answer 1

tickSizeを使用して、内側と外側の両方のティックを使用することはできません。正の値を指定すると、目盛りが外側に拡大し、負の値を指定すると、目盛りがプロット領域内で拡大します。

しかし、ダニの内側と外側の両方に異なる方法があります。私の好きなものは、軸ジェネレータを使わずに別々の線のセット（グリッド線）を作成することです（私の答えはこちら：https://stackoverflow.com/a/38329969/5768908参照）。これはより複雑ですが、異なる色、ストローク幅、不透明度などを設定できる利点があります。

このようなカスタマイズを許可しない簡単なアプローチは、ティックを左に変換しています。

.attr("transform", "translate(-someValue, 0)"); 

チェックデモ：

var svg = d3.select("body").append("svg"); 
 
var data = d3.range(10); 
 
var yScale = d3.scaleLinear().domain([0,10]).range([140,10]); 
 
var yAxis = d3.axisLeft(yScale).tickSize(-256).tickPadding(10); 
 
var gY = svg.append("g").attr("class", "y axis").attr("transform", "translate(50,0)").call(yAxis); 
 
d3.selectAll(".y.axis .tick line").attr("transform", "translate(-6,0)");

.y.axis .tick line{ 
 
\t stroke: #999 
 
}

<script src="https://d3js.org/d3.v4.min.js"></script>