- From: Paul LeBeau <paul.lebeau@gmail.com>
- Date: Fri, 13 Sep 2013 20:45:49 +1200
- To: www-svg <www-svg@w3.org>
- Message-ID: <CACfsppASrayDyTZ+JKQT5JGPxWtc9b_6ofUNq2LF6dq4Z_oscg@mail.gmail.com>
I know Brian has been working on a proposal for variable width strokes. However I wanted to proprose a different approach that I think uses a more familiar SVG style. Hopefully this approach hasn't already been suggeted and rejected. A quick summary follows: <?xml version="1.0"?> <svg xmlns:xlink="http://www.w3.org/1999/xlink" xmlns=" http://www.w3.org/2000/svg" version="1.1" width="450px" height="450px" viewBox="0 0 450 450"> <defs> <strokeProfile stopUnits="pathIndex" strokeUnits="userSpaceOnUse" interpolationMethod="linear"> <stop offset="0" stroke-width="4"/> <stop offset="2" stroke-width="32"/> <stop offset="4" stroke-width="16"/> <stop offset="5" stroke-width="10"/> <stop offset="6" stroke-width="24"/> <stop offset="8" stroke-width="4"/> </strokeProfile> </defs> <g fill="none" stroke="url(#swirl)"> <path d="M 375,225 C 375,180 285,195 240,240 C 195,285 180,375 225,375 C 270,375 255,285 210,240 C 165,195 75,180 75,225 C 75,270 165,255 210,210 C 255,165 270,75 225,75 C 180,75 195,165 240,210 C 285,255 375,270 375,225 Z" /> </g> </svg> *stopUnits *can be one of "pathIndex" or "pathLength". For "pathIndex", the stop offset value refers to the index of a coordinate in the path or shape. If there are more coordinates in the path than stops defined, then the last offset is re-used. For "pathLength", the stop offset value refers to a fraction of the path length (0..1 or 0%..100%) *strokeUnits *can be one of "userSpaceOnUse" or "strokeWidth" "userSpaceOnUse": absolute value in current userspace "strokeWidth": a multiple of the currently defined stroke-width value *interpolationMethod *can be one of "linear" or "spline" "linear": stroke width between stop offsets is linearly interpolated "spline": a Catmull-Rom spline is used to interpolate between stop offset widths Another sample definition: <strokeProfile id="swirl" stopUnits="pathLength" strokeUnits="strokeWidth" interpolationMethod="spline"> <stop offset="0" stroke-width="1"/> <stop offset="0.25" stroke-width="8"/> <stop offset="0.5" stroke-width="4"/> <stop offset="0.625" stroke-width="2.5"/> <stop offset="0.75" stroke-width="6"/> <stop offset="1.0" stroke-width="1"/> </strokeProfile> Any thoughts? Does this approach have any merit? I know it is a bit more verbose than the style suggested by Brian. Paul
Received on Friday, 13 September 2013 08:46:36 UTC