0
我收到「未捕獲的TypeError:無法讀取屬性未定義的長度」,並且無法找到解決方案。目標是爲svg rects元素的x,y,寬度和高度創建一個隨機值的數據數組。嘗試隨機創建數據陣列時獲取未捕獲的TypeError
<html>
<head>
<meta name="description" content="Drawing Shapes w/ D3 - " />
<meta charset="utf-8">
<title>Drawing SVG Shapes with D3</title>
<script src="d3.v3.js" charset="utf-8"></script>
<style>
circle {
stroke-width: 5;
stroke:steelblue;
fill:#888;
fill-opacity: .5;
}
rect {
stroke-width: 1;
stroke:steelblue;
fill:#888;
fill-opacity: .5;
}
line {
stroke: red;
stroke-linecap: round;
stroke-width: 5;
}
</style>
</head>
<body>
<script>
function makeData(n){
var arr = [];
for (var i=0; i<n; i++){
arr.push({
x:Math.floor((Math.random() * 100) + 1),
y:Math.floor((Math.random() * 100) + 1),
width:Math.floor((Math.random() * 100) + 1),
height:Math.floor((Math.random() * 100) + 1)
})
};
return arr;
}
var data = makeData[2];
var svg = d3.select("body")
.append("svg")
.attr("width",200)
.attr("height",200);
svg.selectAll("rect")
.data(data)
.enter()
.append("rect")
.attr("x", function(d) { return d.x; })
.attr("y", function(d) { return d.y; })
.attr("width", function(d) { return d.width; })
.attr("height", function(d) { return d.height; });
</script>
</body>
</html>
它最初工作時,我有一個靜態的數據陣列,但在嘗試創建從隨機生成的值相同的數據對象時,現在沒有。先謝謝你。