Skip to content

xringscoring/svg_target_faces

master
Switch branches/tags
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
 
 

SVG Target Faces

SVG renderings of typical archery target faces, such as WA 10-zone, 6-zone, triple spot, NFAA 5-zone and AGB Worcester faces.

See the examples here: https://xringscoring.github.io/svg_target_faces/

Usage

Please see index.html source code for details.

Example for a 6-zone WA target face:

<svg id="svg_wa_6_zone" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" height="100%" width="100%" viewBox="0 0 600 600">

  <g>
    <!-- 5-RING -->
    <circle cx="300" cy="300" r="239" fill="#00B4E4"/>

    <!-- 6-RING -->
    <circle cx="300" cy="300" r="199" fill="#00B4E4" stroke="#000000" stroke-width="1"/>

    <!-- 7-RING -->
    <circle cx="300" cy="300" r="159" fill="#FD1B14" stroke="#000000" stroke-width="1"/>

    <!-- 8-RING -->
    <circle cx="300" cy="300" r="119" fill="#FD1B14" stroke="#000000" stroke-width="1"/>

    <!-- 9-RING -->
    <circle cx="300" cy="300" r="79" fill="#FFE552" stroke="#000000" stroke-width="1"/>

    <!-- 10-RING -->
    <circle cx="300" cy="300" r="39" fill="#FFE552" stroke="#000000" stroke-width="1"/>

    <!-- INNER 10-RING -->
    <circle cx="300" cy="300" r="19" fill="#FFE552" stroke="#000000" stroke-width="1"/>

    <g class="spider">
      <line x1="295" y1="300" x2="305" y2="300" stroke="#000000" stroke-width="1"/>
      <line x1="300" y1="295" x2="300" y2="305" stroke="#000000" stroke-width="1"/>
    </g>
  </g>
</svg>

And, of course, SVG can be styled via CSS using appropriate selectors:

// General 'ring' with black outline
g circle {
  stroke: #000000;
  stroke-width: 1;
}

// A blue ring, inherits the black outline above
g circle.wa_blue {
  fill: #00B4E4;
}

// Same for a red ring
g circle.wa_red {
  fill: #FD1B14;
}

License

SVG Target Faces published under MIT License

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages