stroke-dashoffset-and-pathLength-01.svg 827 B

1234567891011121314151617181920212223242526
  1. <!--
  2. Any copyright is dedicated to the Public Domain.
  3. http://creativecommons.org/publicdomain/zero/1.0/
  4. -->
  5. <svg xmlns="http://www.w3.org/2000/svg">
  6. <title>Test stroke-dashoffset with pathLength</title>
  7. <!--
  8. The path is much longer than 100 user units, so if the pathLength is not
  9. factored into the stroke-dashoffset calculation, the stroke will be visible.
  10. A correct implementation will see the first dash pushed off the end of the
  11. path which will mean that the path does not display at all.
  12. -->
  13. <style>
  14. path {
  15. fill: none;
  16. stroke-width: 5;
  17. stroke: red;
  18. stroke-dasharray: 100;
  19. stroke-dashoffset: 100;
  20. }
  21. </style>
  22. <rect width="100%" height="100%" fill="lime"/>
  23. <path pathLength="100" d="M175,25 A150,150,0,1,1,175,325 A150,150,0,1,1,175,25"/>
  24. </svg>