How do you make a block comment in SVG

52.2k Views Asked by At

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.

3

There are 3 best solutions below

2
On BEST ANSWER

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>
-->
1
On

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
On

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.