1
0
Fork 0
freesewing/sites/shared/components/measurements/tim/hpstowaistfront.svg

40 lines
2.1 KiB
XML
Raw Normal View History

<!-- __SDEFILE__ - This file is a dependency for the stand-alone environment -->
<svg xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" width="2000" height="1500" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 2000 1500">
<defs>
<path id="path" d="M -575 -270 c 120 30 120 110 120 279 m 480 -280 l 0 276" style="fill: none; stroke-linejoin: round;"/>
</defs>
<style type="text/css"><![CDATA[
path {fill: none; stroke-linejoin: round;}
.tape {stroke: #000; stroke-width: 20px; stroke-linecap: butt;}
.redtape {stroke: #f00; stroke-width: 1px;stroke-linecap: round;}
.color {stroke: #fff86c; stroke-width: 16px; stroke-linecap: butt;}
.cm {stroke: #000; stroke-width: 16px; stroke-dasharray: 2 10; stroke-linecap: butt;}
.line {stroke: #000; stroke-width: 3px; stroke-dasharray: 8 5; stroke-linecap: round;}
]]></style>
<!-- Background image -->
<image xlink:href="./standing.jpg" x="0" y="0" width="2000" height="1500" />
<g transform="translate(875 598)">
<use x="0" y="0" xlink:href="#path" class="redtape">
<animate attributeType="CSS" attributeName="stroke-width" from="1" to="450" begin="loop.begin+2.5s" dur="0.5s" fill="freeze" />
<animate attributeType="CSS" attributeName="stroke-opacity" from="1" to="0" begin="loop.begin+2.7s" dur="0.3s" fill="freeze" />
</use>
<use x="0" y="0" xlink:href="#path" class="tape"/>
<use x="0" y="0" xlink:href="#path" class="color"/>
<use x="0" y="0" xlink:href="#path" class="cm"/>
</g>
<!-- Helplines -->
<g>
<path id="waistline" class="line" d="M 1498 595 l 213 0 M 880 600 c 70 15 140 15 203 0 M 335 605 l 85 5">
<animate attributeType="CSS" attributeName="stroke-dashoffset" from="0" to="13" dur="1s" repeatDur="indefinite" />
</path>
</g>
<!-- timing loop -->
<rect height="1" width="1" x="-10" y="-10">
<animate attributeType="CSS" attributeName="visibility" from="hide" to="hide" begin="0;loop.end" dur="4s" id="loop" />
</rect>
</svg>