D3/SVG。我如何定位一個孩子svg元素超出父母的範圍？

使用d3我有一個svg元素，我想父母孩子svg元素層次結構。扭轉是我想定位超出其母公司程度兒女D3/SVG。我如何定位一個孩子svg元素超出父母的範圍？

var svg, 
    group; 

svg = d3.select("body") 
    .append("svg") 
    .attr("width", 200) 
    .attr("height", 100); 

group = svg 
    .append("g") 
    .attr("transform", "translate(" + 400 + "," + 300 + ")"); 

group 
    .append("rect") 
    .attr("x", "0") 
    .attr("y", "0") 
    .attr("width", "300") 
    .attr("width", "150");

如果我運行這段代碼的矩形將是無形的，由其父裁剪。我如何禁用此父母剪輯？

來源

2015-06-30 dugla

@RobertLongson爽不知道。感謝您的回答 –

設置overflow =「可見」<svg>元素。例如。

var svg, 
 
     group; 
 

 
    svg = d3.select("body") 
 
     .append("svg") 
 
     .attr("width", 200) 
 
     .attr("height", 100) 
 
     .attr("overflow", "visible"); 
 

 
    group = svg 
 
     .append("g") 
 
     .attr("transform", "translate(" + 400 + "," + 300 + ")"); 
 

 
    group 
 
     .append("rect") 
 
     .attr("x", "0") 
 
     .attr("y", "0") 
 
     .attr("width", "300") 
 
     .attr("height", "150");

html, body { 
 
    width: 100%; 
 
    height: 100%; 
 
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.min.js"></script> 
 
<body></body>

（請注意，你可能需要做這個全屏幕才能看到的矩形）

來源

2015-06-30 14:13:48

Bingo！乾杯羅伯特。 – dugla

羅伯特，關於爲什麼溢出不是svg元素的默認行爲的任何想法？遏制和層級往往是獨立的。我正在考慮圍繞太陽旋轉的行星。分層連接等。真的，任何嵌套轉換層次結構。只是好奇。 – dugla

因爲SVG規範是這樣說的。請參閱答案中的鏈接。 –

D3/SVG。我如何定位一個孩子svg元素超出父母的範圍？

回答

相關問題