SVG Polygon

From http://www.w3schools.com (Copyright Refsnes Data)

# SVG <polygon>

The <polygon> tag is used to create a graphic that contains at least three sides.

## The <polygon> Tag

The <polygon> tag is used to create a graphic that contains at least three sides.

Copy the following code into Notepad and save the file as "polygon1.svg". Place the file in your Web directory:

    <?xml version="1.0" standalone="no"?>
    <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
    "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">

    <svg width="100%" height="100%" version="1.1"
    xmlns="http://www.w3.org/2000/svg">

    <polygon points="220,100 300,210 170,250"
    style="fill:#cccccc;
    stroke:#000000;stroke-width:1"/>

    </svg>

Code explanation:

- The points attribute defines the x and y coordinates for each corner of the polygon

View example

The following example creates a polygon with four sides:

    <?xml version="1.0" standalone="no"?>
    <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
    "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">

    <svg width="100%" height="100%" version="1.1"
    xmlns="http://www.w3.org/2000/svg">

    <polygon points="220,100 300,210 170,250 123,234"
    style="fill:#cccccc;
    stroke:#000000;stroke-width:1"/>

    </svg>

View example

From http://www.w3schools.com (Copyright Refsnes Data)