ここで、x = 0、y = 0の座標が下の方にあるsvg座標空間を描画する方法

Question

こんにちは基本的にsvgの座標空間が上から下に向かっています。グラフ座標空間のように下から上に向かって変化する必要があります。私は

var svg = d3.select("body") 
     .append("svg") 
     .attr("width", 500) 
     .attr("height", 500); 

//Create and append line 
svg.append("line") 
     .attr("x1", 100) 
     .attr("x2", 500) 
     .attr("y1", 50) 
     .attr("y2", 250) 
     .attr("stroke", "black") 

Answer 1

トップに下に変更必要があるか左側に上から下に描画します以下のコードは、単純な座標を反転するには、メインSVG要素に変換を適用することができます。

var svg = d3.select("body") 
      .append("svg") 
       .attr("width", 500) 
       .attr("height", 500) 
       .attr('transform', 'scale(1 -1)'); 

MDN @scale()