Soustraire un cercle à partir d'un autre en SVG
J'essaie de trouver un moyen de soustraire une forme à une autre en SVG, créant un trou dans le milieu ou une morsure sur le côté. Un peu comme un chemin de détourage, mais au lieu de montrer l'intersection, j'en veux pour preuve l'une des parties à l'extérieur de l'intersection. Une solution impliqués à l'aide d'Adobe Flex, mais je ne sais pas comment la mettre en oeuvre correctement. Je comprends qu'il y a un moyen de le faire dans Inkscape en utilisant boolean opérations de tracé, mais je veux garder le cercle des éléments de la façon dont ils sont au lieu de les transforme en éléments de chemin d'accès.
<defs>
<subtractPath id="hole">
<circle r="50" cx="100" cy="100" />
</subtractPath>
</defs>
<circle id="donut" r="100" cx="100" cy="100" subtract-path="url(#hole)" />
Vous devez vous connecter pour publier un commentaire.
Un masque est ce que vous voulez. Pour créer un
<mask>
, faire des choses que vous voulez garder le blanc. Les choses que vous voulez être invisible, rendre noir. Couleurs entre entraînera la translucidité.De sorte que le montant SVG est similaire à votre pseudo-balisage et ressemble à ceci:
HTML:
Nous sommes remplissage du masque avec un rectangle blanc, et ensuite, nous avons un cercle noir où nous voulons que le trou.
<circle id="donut" r="100" cx="100" cy="100" mask="url(#hole)" fill="white" />
L'astuce est d'utiliser remplissez-la règle pour contrôler l'affichage d'un clip-path. Un (carré) beigne exemple serait
Qui utilise le remplissage de la règle de propriété des formes supprimer le carré intérieur - vous pu régler qu'à faire avec les courbes de bézier pour créer un cercle tel que requis.
Une fois que vous avez la base, tracé de détourage, vous pouvez créer un tracé de détourage pour en sortir, voir cette MDN entrée de l'info sur le clip-path.
Deux réponses suggèrent (1) d'utiliser un <masque> ou (2) utiliser le “remplissage de la règle=evenodd” attribut de soustraire une forme B d'une forme Un (Un ∖ B).
À la fois corrigé de résoudre le “trou dans le milieu” (B ⊆ A) partie de la question, mais seulement la masque approche est une solution raisonnable pour la “morsure sur le côté de la partie” (B ⊈ A). À l'aide de la evenodd remplissez-la règle signifie que les deux formes sont traités de la même manière, la partie de la deuxième forme qui ne se croisent pas la première sera une partie du résultat. Afin de mordre quelque chose d'une forme de “mordant” forme aurait à partager une partie de sa frontière avec le mordu de la forme. Cela peut être fastidieux à réaliser dans la pratique.
Un exemple: pour soustraire un cercle à partir d'un autre cercle que vous auriez à créer un “mordant” de la forme qui est l'intersection de deux cercles.
Le masque est beaucoup plus universel.
|*| Masque : permet de Soustraire des Objets :
|=> fill="blanc" => Blocs d'affichage
|=> fill="black" => Blocs pour les Supprimer
|=> fill="blanc" => Mettre l'Affichage de Bloc à l'intérieur du masque et la balise de remplissage blanc
|=> fill="black" => Mettre le Supprimer Bloc à l'intérieur du masque et la balise de remplissage noir
|::| Exemple pour utiliser un masque pour enlever centre petite rect de grandes rect
|::| Exemple pour utiliser un masque pour supprimer le centre d'un petit cercle de grand cercle :