SvgForXaml
SvgForXaml copied to clipboard
mntone
fill and fill-rule for grouped
I use Sketch app to export SVG file.
When this app exports as SVG, the place for fill and fill-rule is different by being grouped or not grouped.
if grouped,
<g id="man-with-pen" transform="translate(66.500000, 11.799999)" fill-rule="nonzero" fill="#FFFFFF"> <path d="M24.9972378,31.5623524 C25.64362,31.7042296 26.2659459,31.9244344 26.8409428,32.2203132 C27.8347132,32.731682 28.6576994,33.4926622 29.9119051,34.8990007 C31.5714499,36.7598453 31.8665677,37.0577507 32.4386752,37.3393474 C33.9812679,38.0986262 35.3133223,38.2713557 37.8291619,38.0136942 L38,40.0049651 C35.1915506,40.2925945 33.5494459,40.0796602 31.6868031,39.1628498 C30.7966636,38.7247147 30.508832,38.4341643 28.6008581,36.2947567 C27.4941564,35.0538141 26.7951214,34.4074463 26.0609982,34.0296853 C25.5734205,33.7787903 25.0376839,33.5992184 24.4800364,33.4925743 L24.9972378,31.5623524 L24.9972378,31.5623524 Z" id="Combined-Shape"></path>
if not grouped
<path d="M91.4972378,43.3623516 C92.14362,43.5042288 92.7659459,43.7244337 93.3409428,44.0203124 C94.3347132,44.5316812 95.1576994,45.2926614 96.4119051,46.699 C98.0714499,48.5598445 98.3665677,48.85775 98.9386752,49.1393467 C100.481268,49.8986254 101.813322,50.071355 104.329162,49.8136934 L104.5,51.8049643 C101.691551,52.0925937 100.049446,51.8796594 98.1868031,50.9628491 C97.2966636,50.524714 97.008832,50.2341636 95.1008581,48.0947559 C93.9941564,46.8538133 93.2951214,46.2074456 92.5609982,45.8296845 C92.0734205,45.5787895 91.5376839,45.3992176 90.9800364,45.2925736 L91.4972378,43.3623516 L91.4972378,43.3623516 Z" id="Combined-Shape" fill="#FFFFFF" fill-rule="nonzero"></path>
I'm not sure this behavior is fit to SVG specification or not, but this causes grouped path is drawn as filling black by this library.
@omanuke It depends on the specification of the grouping function of the application.
Supposing a group has 2 paths which intersect each other, which "fill-rule" attribute or attributes belong to makes different shapes, and neither violates the SVG specification.
