如何使用javascript将从for循环生成的SVG彼此堆叠在一起？
到目前为止，这就是我所知道的，问题是每次生成svg时，它们不会堆叠在一起形成动画效果，而是堆叠在一起或下面，有人知道如何解决这个问题吗？还有人知道我如何使圆圈从容器底部而不是顶部出现吗？提前谢谢如何使用javascript将从for循环生成的SVG彼此堆叠在一起？,javascript,for-loop,d3.js,svg,Javascript,For Loop,D3.js,Svg,到目前为止，这就是我所知道的，问题是每次生成svg时，它们不会堆叠在一起形成动画效果，而是堆叠在一起或下面，有人知道如何解决这个问题吗？还有人知道我如何使圆圈从容器底部而不是顶部出现吗？提前谢谢 <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Animation</title> <script src
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Animation</title>
<script src="https://d3js.org/d3.v4.min.js"></script>
<style>
</style>
</head>
<body>
</svg>
<script>
var height1 = 0;
for (let height1 = 0; height1 < 20; height1 ++) {
setTimeout(function timer(){
console.log(height1)
//make SVG container
var svgContainer = d3.select("body").append("svg")
.attr("width", 100)
.attr("height", height1);
//Draw circle
var circle = svgContainer.append("circle")
.attr("cx", 50)
.attr("cy", 50)
.attr("r", 50);
}, height1*500)
}
</script>
</body>
</html>
动画
var height1=0；
对于（让高度1=0；高度1<20；高度1++）{
setTimeout（函数计时器（）{
控制台日志（高度1）
//制作SVG容器
var svgContainer=d3.select（“body”）.append（“svg”）
.attr（“宽度”，100）
.attr（“高度”，高度1）；
//画圈
var circle=svgContainer.append（“circle”）
.attr（“cx”，50）
.attr（“cy”，50）
.attr（“r”，50）；
}，高度1*500）
}
var高度1=0；
var svgContainer=d3.select（“body”）.append（“svg”）
.attr（“宽度”，100）；
对于（让高度1=0；高度1<20；高度1++）{
setTimeout（函数计时器（）{
//制作SVG容器
svgContainer.attr（“高度”，高度1）；
//画圈
var circle=svgContainer.append（“circle”）
.attr（“cx”，50）
.attr（“cy”，50）
.attr（“r”，50）；
}，高度1*500）
}高度1varletvar