Question

我对D3s轴对象如何获取其原点位置以及锚定位置感到有点困惑（我假设它的左上角）

此外，似乎原点根据相关比例的范围而变化，例如，下面的两个轴将从不同的位置开始

第1轴

    //Xscale with scale not augmented       
    var stageXScale=d3.scaleLinear()            
      .domain([0,150])
      .range([0,150]);

    var stageXAxis = d3.axisBottom(stageXScale)   //unaug axis
        .ticks(20);

第二轴

    //scale which is augmented
    var stageXScaleAug=d3.scaleLinear()            
      .domain([0,stageWidth])
      .range([0+stageMarginLeft,150+stageMarginLeft]);

    var stageXAxisAug = d3.axisBottom(stageXScaleAug)       //aug axis
        .ticks(20);

不是映射到父容器原点的轴的原点，如果是这样，为什么轴的比例会改变它。这是Js小提琴的例子：

https://jsfiddle.net/Snedden27/3wsx8bdy/12/

Answer 1

轴的原点位置（transform之前）由刻度范围的最小值决定。

对于轴1，范围为[0,150]，轴从父元素的屏幕x坐标0开始。（轴以x坐标150结束。）

对于轴2，范围为[0+stageMarginLeft,150+stageMarginLeft]，因此轴从父元素的屏幕x坐标stageMarginLeft（20）开始。

D3轴原点根据其刻度范围而变化

1 个答案: