我想知道这是否可能以及如何在已绘制的 SVG 中绘制。假设我用 SVG 绘制了一些东西,但我想添加另一个元素,而不是重新绘制所有 map 或修改原始代码。
最佳答案
是的,这是可以做到的。实际上,这是 svg 的优点之一。这是一个例子:
<!DOCTYPE html>
<html>
<head>
<title>HTML5 SVG demo</title>
</head>
<body>
<h1>SVG DEMO</h1>
<svg id="circle" height="200" xmlns="http://www.w3.org/2000/svg">
<circle id="greencircle" cx="30" cy="30" r="30" fill="green" />
</svg>
<script type="text/javascript">
var rect = document.createElementNS('http://www.w3.org/2000/svg', 'rect');
rect.setAttributeNS(null,"id", "myrect");
rect.setAttributeNS(null,"fill", "red");
rect.setAttributeNS(null,"stroke", "black");
rect.setAttributeNS(null,"stroke-width", "5");
rect.setAttributeNS(null,"x", "100");
rect.setAttributeNS(null,"y", "100");
rect.setAttributeNS(null,"width", "100");
rect.setAttributeNS(null,"height", "50");
var svg = document.getElementById("circle");
svg.appendChild(rect);
</script>
</body>
</html>
关于javascript - 绘制一个已经绘制好的 SVG,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16373322/