如何在 SVG 中进行块注释

发布于 2024-10-22 23:28:59 字数 235 浏览 5 评论 0原文

我第一次尝试学习 SVG，但代码似乎与我的块注释有问题。我正在使用：

/* This is my
 * block comment
 */

当我运行代码时，出现以下错误：

'return' statement outside of function
line: 116, column: 4

这恰好发生在我的块注释之前。

原文

I'm trying to learn SVG for the first time but the code seems to have an issue with my block comments. I'm using:

/* This is my
 * block comment
 */

And when I run my code, I get the following error:

'return' statement outside of function
line: 116, column: 4

That so happens to be immediately before my block comment.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

听，心雨的声音 2024-10-29 23:29:00

由于 SVG 是 XML，因此您可以使用 XML 样式注释：

<!-- 
    comment 
-->

例如：

<g onclick = "setScale(1)">
    <rect id = "scale1" x = "120" y = "10" width = "30" height = "30"
        fill = "#ffc" stroke = "black"/>
    <!-- 
        this text describes middle rectangle
    -->
    <text x = "135" y = "30" text-anchor = "middle">M</text>
</g>

或者您可以排除代码的某些部分：

<!--
     this group is disabled for testing    
<g onclick = "setScale(1)">
    <rect id = "scale1" x = "120" y = "10" width = "30" height = "30"
        fill = "#ffc" stroke = "black"/>
    <text x = "135" y = "30" text-anchor = "middle">M</text>
</g>
-->

As SVG is XML, you can use XML style comments:

<!-- 
    comment 
-->

For example:

<g onclick = "setScale(1)">
    <rect id = "scale1" x = "120" y = "10" width = "30" height = "30"
        fill = "#ffc" stroke = "black"/>
    <!-- 
        this text describes middle rectangle
    -->
    <text x = "135" y = "30" text-anchor = "middle">M</text>
</g>

Or you can exclude some part of code:

<!--
     this group is disabled for testing    
<g onclick = "setScale(1)">
    <rect id = "scale1" x = "120" y = "10" width = "30" height = "30"
        fill = "#ffc" stroke = "black"/>
    <text x = "135" y = "30" text-anchor = "middle">M</text>
</g>
-->

回复收藏 0 原文

空宴 2024-10-29 23:29:00

就 DOM 而言，svg 文档与 html 文档非常相似。

此行将在所有浏览器中中断：

svgDocument = evt.getTarget().getOwnerDocument();

并且可以简单地替换为：

svgDocument = document;

实际上没有真正需要创建变量 svgDocument 因为 document 始终被定义并引用当前文档（svg）。

请阅读https://jwatt.org/svg/authoring/，特别是https://jwatt.org/svg/authoring/#asv-getters-and-setters。

An svg document is much the same as an html document as far as the DOM is concerned.

This line will break in all browsers:

svgDocument = evt.getTarget().getOwnerDocument();

And could simply be replaced by:

svgDocument = document;

Actually there's no real need to create a variable svgDocument since document is always defined and referring to the current document (the svg).

Please read https://jwatt.org/svg/authoring/ and in particular https://jwatt.org/svg/authoring/#asv-getters-and-setters.

回复收藏 0 原文

巨坚强 2024-10-29 23:29:00

您可以使用 xml 标签作为“desc”。

<svg width="250" height="130" viewBox="0 0 250 130">
    <desc>Cuadrado que marca el viewport</desc>
    <rect x="0" y="0" height="130" width="250" style="stroke:#f00; fill: none; stroke-width:5;"></rect>

    <desc>line from top left corner to bottom right corner of the viewport</desc>
    <line x1="0" y1="0" x2="250" y2="130" style="stroke:#f00; stroke-width:1;"></line>
</svg>

You can use a xml tag as "desc".

<svg width="250" height="130" viewBox="0 0 250 130">
    <desc>Cuadrado que marca el viewport</desc>
    <rect x="0" y="0" height="130" width="250" style="stroke:#f00; fill: none; stroke-width:5;"></rect>

    <desc>line from top left corner to bottom right corner of the viewport</desc>
    <line x1="0" y1="0" x2="250" y2="130" style="stroke:#f00; stroke-width:1;"></line>
</svg>

回复收藏 0 原文

~没有更多了~