gpt4 book ai didi

javascript - 如何在标签内附加 SVG 圆圈

转载 作者:行者123 更新时间:2023-12-01 02:06:38 27 4
gpt4 key购买 nike

enter image description here以下圆形标签位于标签内:

<circle cx="111.70110487400142" cy="134.60212936975006" r="10" stroke="#000000" fill="#000000" stroke-width="0" data-pdf-annotate-id="8e1b063b-ec08-4c73-8b86-d8e8cce5615e" data-pdf-annotate-type="fillcircle" aria-hidden="true" transform="scale(1.33) rotate(0) translate(0, 0)"></circle>

现在我必须将生成的圆圈附加到标签内,例如

<a href="#">
<circle cx="111.70110487400142" cy="134.60212936975006" r="10" stroke="#000000" fill="#000000" stroke-width="0" data-pdf-annotate-id="8e1b063b-ec08-4c73-8b86-d8e8cce5615e" data-pdf-annotate-type="fillcircle" aria-hidden="true" transform="scale(1.33) rotate(0) translate(0, 0)"></circle>
</a>

更新:

<svg class="annotationLayer" width="1118.53" height="1582.7" data-pdf-annotate-container="true" data-pdf-annotate-viewport="{&quot;viewBox&quot;:[0,0,841,1190],&quot;scale&quot;:1.33,&quot;rotation&quot;:0,&quot;offsetX&quot;:0,&quot;offsetY&quot;:0,&quot;transform&quot;:[1.33,0,0,-1.33,0,1582.7],&quot;width&quot;:1118.53,&quot;height&quot;:1582.7,&quot;fontScale&quot;:1.33}" data-pdf-annotate-document="/uploads/docs/Vishnu/file/IBC-CW1a-DE-02_2.pdf" data-pdf-annotate-page="1" style="width: 1118.53px; height: 1582.7px;">

<circle cx="138.76877404693374" cy="82.72243012162977" r="10" stroke="#000000" fill="#000000" stroke-width="0" data-pdf-annotate-id="b91a7011-656c-48d6-9f1c-62ac4bfc4f91" data-pdf-annotate-type="fillcircle" aria-hidden="true" transform="scale(1.33) rotate(0) translate(0, 0)"></circle>

</svg>


function createCircle(a) {
var circle = document.createElementNS('http://www.w3.org/2000/svg', 'circle');
(0, _setAttributes2.default)(circle, {
cx: a.cx,
cy: a.cy,
r: a.r
});
var spot_anchor = document.createElement("a")
console.log(spot_anchor)
spot_anchor.appendChild(circle)
console.log(spot_anchor)

console.log('Create_circl1')
return circle;
}

我怎样才能使用 javascript 做到这一点?

最佳答案

您正在创建您的<a>元素的方式不正确。您正在使用:

document.createElement("a")

这会创建一个 <a> HTML 命名空间中的元素。换句话说,一个 HTML <a>元素。

您需要创建一个 SVG <a>元素,尽管名称相同,但完全不同。

您的操作方式与创建 <circle> 的方式相同。元素:

document.createElementNS('http://www.w3.org/2000/svg', 'a');

关于javascript - 如何在标签内附加 SVG 圆圈,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50059361/

27 4 0