為了重用代碼，我想將我的 SVG 放入一個函式并根據需要呼叫它。一旦我選擇了 DIV，在其中呈現 SVG 的適當構造是什么？
...
if (intLocations.includes(comm.location)) {
const intActivities = d3.select('div#intActivities')
intActivities.append(Pill(comm))
} else {
const extActivities = d3.select('div#extActivities')
actActivities.append(Pill(comm))
}
...
function Pill(comm) {
const svgNode = d3.create('svg')
svgNode
.attr('width', 100)
.attr('height', 100)
.append('g')
// More code to draw the figure using comm data.
return svgNode;
}
uj5u.com熱心網友回復：
intActivities.append(() => Pill(comm).node())應該做的伎倆。這是一個例子：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="https://d3js.org/d3.v7.js"></script>
</head>
<body>
<div id="my-div"></div>
<script>
d3.select('#my-div').append(() => square().node());
function square() {
const svg = d3.create('svg')
.attr('width', 100)
.attr('height', 100);
svg.append('rect')
.attr('width', 100)
.attr('height', 100)
.attr('fill', 'navy');
return svg;
}
</script>
</body>
</html>或者，您可以將Pill要添加到的 div 選擇傳遞給您的函式。
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/443688.html
標籤：javascript d3.js 可观察的
上一篇：D3js組縮放