Difference between revisions of "SVG Element"

From Level Access Web Labs
Jump to navigation Jump to search
(Initial Construction)
 
(Section updates to include <Title> element examples)
Line 617: Line 617:
 
</svg>
 
</svg>
 
</html>
 
</html>
−
 
+
==Content with True Text and an Explicit &lt;Title&gt; Element==
 +
<html>
 +
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
 +
              "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
 +
<svg xmlns="http://www.w3.org/2000/svg"
 +
    width="500px" height="250px"
 +
    viewBox="0 0 1167 623">
 +
<title>SVG Example</title>
 +
<g>
 +
<text x="580" y="90" font-family="Sans" font-size="60" stroke="#000000" fill="#FFFFFF">
 +
This Image Has Real
 +
</text>
 +
<text x="580" y="154" font-family="Sans" font-size="60" stroke="#000000" fill="#FFFFFF">
 +
Text Embedded as a
 +
</text>
 +
<text x="580" y="218" font-family="Sans" font-size="60" stroke="#000000" fill="#FFFFFF">
 +
&lt;Text&gt; Object
 +
</text>
 +
</g>
 +
  <path id="Selection"
 +
        fill="none" stroke="black" stroke-width="1"
 +
        d="M 442.00,191.00
 +
          C 442.00,191.00 466.00,188.84 466.00,188.84
 +
            466.00,188.84 503.00,181.63 503.00,181.63
 +
            503.00,181.63 528.00,176.00 528.00,176.00
 +
            527.99,178.67 528.11,181.40 527.36,184.00
 +
            526.08,188.46 515.66,204.84 512.60,210.00
 +
            504.09,224.39 495.87,242.20 490.34,258.00
 +
            490.34,258.00 479.92,286.89 479.92,286.89
 +
            478.89,288.50 478.33,288.80 477.00,290.00
 +
            477.00,290.00 474.12,282.00 474.12,282.00
 +
            474.12,282.00 468.31,272.00 468.31,272.00
 +
            455.82,249.02 452.31,242.76 434.42,223.04
 +
            434.42,223.04 421.00,210.00 421.00,210.00
 +
            418.98,207.97 415.45,204.77 414.86,202.00
 +
            414.25,200.28 414.68,199.56 414.86,198.00
 +
            411.26,196.68 410.87,196.51 409.00,193.00
 +
            417.81,190.50 432.58,191.11 442.00,191.00 Z
 +
          M 501.00,195.39
 +
          C 493.56,198.30 480.88,201.87 473.00,202.85
 +
            473.00,202.85 453.00,204.91 453.00,204.91
 +
            447.47,204.82 442.79,202.70 437.00,204.91
 +
            450.75,211.74 463.40,227.15 469.69,241.00
 +
            469.69,241.00 477.00,260.00 477.00,260.00
 +
            480.64,241.88 487.94,224.42 498.08,209.00
 +
            498.08,209.00 512.00,191.00 512.00,191.00
 +
            512.00,191.00 501.00,195.39 501.00,195.39 Z
 +
          M 439.00,256.00
 +
          C 439.00,256.00 421.00,272.58 421.00,272.58
 +
            421.00,272.58 400.00,291.83 400.00,291.83
 +
            400.00,291.83 349.00,337.16 349.00,337.16
 +
            349.00,337.16 108.00,549.05 108.00,549.05
 +
            108.00,549.05 46.00,603.15 46.00,603.15
 +
            41.91,606.76 26.77,620.82 23.00,622.26
 +
            20.71,623.13 17.46,623.00 15.00,623.00
 +
            15.00,623.00 0.00,623.00 0.00,623.00
 +
            0.97,617.06 3.66,615.91 8.00,612.05
 +
            8.00,612.05 28.00,594.73 28.00,594.73
 +
            28.00,594.73 109.00,524.42 109.00,524.42
 +
            109.00,524.42 323.00,340.92 323.00,340.92
 +
            323.00,340.92 385.00,289.58 385.00,289.58
 +
            396.66,280.02 418.82,262.02 431.00,254.42
 +
            431.00,254.42 445.00,247.00 445.00,247.00
 +
            444.95,250.91 441.65,253.36 439.00,256.00 Z" />
 +
</svg>
 +
</html>
 
=SVG Content Embedded Directly in HTML, Role Assignment of "Img"=  
 
=SVG Content Embedded Directly in HTML, Role Assignment of "Img"=  
 
==Content with Simulated Text==
 
==Content with Simulated Text==
Line 1,188: Line 1,253:
 
<text x="580" y="154" font-family="Sans" font-size="60" stroke="#000000" fill="#FFFFFF">Text Embedded as a</text>
 
<text x="580" y="154" font-family="Sans" font-size="60" stroke="#000000" fill="#FFFFFF">Text Embedded as a</text>
 
<text x="580" y="218" font-family="Sans" font-size="60" stroke="#000000" fill="#FFFFFF">&lt;Text&gt; Object</text>
 
<text x="580" y="218" font-family="Sans" font-size="60" stroke="#000000" fill="#FFFFFF">&lt;Text&gt; Object</text>
 +
</g>
 +
  <path id="Selection"
 +
        fill="none" stroke="black" stroke-width="1"
 +
        d="M 442.00,191.00
 +
          C 442.00,191.00 466.00,188.84 466.00,188.84
 +
            466.00,188.84 503.00,181.63 503.00,181.63
 +
            503.00,181.63 528.00,176.00 528.00,176.00
 +
            527.99,178.67 528.11,181.40 527.36,184.00
 +
            526.08,188.46 515.66,204.84 512.60,210.00
 +
            504.09,224.39 495.87,242.20 490.34,258.00
 +
            490.34,258.00 479.92,286.89 479.92,286.89
 +
            478.89,288.50 478.33,288.80 477.00,290.00
 +
            477.00,290.00 474.12,282.00 474.12,282.00
 +
            474.12,282.00 468.31,272.00 468.31,272.00
 +
            455.82,249.02 452.31,242.76 434.42,223.04
 +
            434.42,223.04 421.00,210.00 421.00,210.00
 +
            418.98,207.97 415.45,204.77 414.86,202.00
 +
            414.25,200.28 414.68,199.56 414.86,198.00
 +
            411.26,196.68 410.87,196.51 409.00,193.00
 +
            417.81,190.50 432.58,191.11 442.00,191.00 Z
 +
          M 501.00,195.39
 +
          C 493.56,198.30 480.88,201.87 473.00,202.85
 +
            473.00,202.85 453.00,204.91 453.00,204.91
 +
            447.47,204.82 442.79,202.70 437.00,204.91
 +
            450.75,211.74 463.40,227.15 469.69,241.00
 +
            469.69,241.00 477.00,260.00 477.00,260.00
 +
            480.64,241.88 487.94,224.42 498.08,209.00
 +
            498.08,209.00 512.00,191.00 512.00,191.00
 +
            512.00,191.00 501.00,195.39 501.00,195.39 Z
 +
          M 439.00,256.00
 +
          C 439.00,256.00 421.00,272.58 421.00,272.58
 +
            421.00,272.58 400.00,291.83 400.00,291.83
 +
            400.00,291.83 349.00,337.16 349.00,337.16
 +
            349.00,337.16 108.00,549.05 108.00,549.05
 +
            108.00,549.05 46.00,603.15 46.00,603.15
 +
            41.91,606.76 26.77,620.82 23.00,622.26
 +
            20.71,623.13 17.46,623.00 15.00,623.00
 +
            15.00,623.00 0.00,623.00 0.00,623.00
 +
            0.97,617.06 3.66,615.91 8.00,612.05
 +
            8.00,612.05 28.00,594.73 28.00,594.73
 +
            28.00,594.73 109.00,524.42 109.00,524.42
 +
            109.00,524.42 323.00,340.92 323.00,340.92
 +
            323.00,340.92 385.00,289.58 385.00,289.58
 +
            396.66,280.02 418.82,262.02 431.00,254.42
 +
            431.00,254.42 445.00,247.00 445.00,247.00
 +
            444.95,250.91 441.65,253.36 439.00,256.00 Z" />
 +
</svg>
 +
</html>
 +
==Content with True Text and an Explicit &lt;Title&gt; Element==
 +
<html>
 +
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
 +
              "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
 +
<svg xmlns="http://www.w3.org/2000/svg"
 +
    width="500px" height="250px"
 +
    viewBox="0 0 1167 623" role="img">
 +
<title>SVG Example</title>
 +
<g>
 +
<text x="580" y="90" font-family="Sans" font-size="60" stroke="#000000" fill="#FFFFFF">
 +
This Image Has Real
 +
</text>
 +
<text x="580" y="154" font-family="Sans" font-size="60" stroke="#000000" fill="#FFFFFF">
 +
Text Embedded as a
 +
</text>
 +
<text x="580" y="218" font-family="Sans" font-size="60" stroke="#000000" fill="#FFFFFF">
 +
&lt;Text&gt; Object
 +
</text>
 
</g>  
 
</g>  
 
   <path id="Selection"
 
   <path id="Selection"

Revision as of 19:52, 26 October 2016

SVG Content Embedded directly in HTML, no Role Assignment

Content with Simulated Text

Content with Embedded True Text

This Image Has Real Text Embedded as a <Text> Object

Content with True Text and an Explicit <Title> Element

SVG Example This Image Has Real Text Embedded as a <Text> Object

SVG Content Embedded Directly in HTML, Role Assignment of "Img"

Content with Simulated Text

Content with Embedded True Text

This Image Has Real Text Embedded as a <Text> Object

Content with True Text and an Explicit <Title> Element

SVG Example This Image Has Real Text Embedded as a <Text> Object

Retrieved from "https://labs.levelaccess.com/index.php?title=SVG_Element&oldid=2960"