[SVG] Combiner plusieurs masques de fusion sur une image?

[Argorate]

Bonjour,

je cherche a reproduire le même comportement que les masque de fusion sous photoshop en SVG, j'ai réussi via:

Code :

<style>
  .test
  {
    background:url(img.jpg) 0 -100px;
    width:50px;
    height:50px;
    mask: url(#mask);
    -webkit-mask: url(mask.svg) top left / cover;
    -o-mask: url(mask.svg) top left / cover;
    -ms-mask: url(mask.svg) top left / cover;
  }
  </style>
<svg xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg">
  <defs>  
    <mask id="mask" maskUnits="userSpaceOnUse" maskContentUnits="userSpaceOnUse">
        <image width="50px" height="50px" xlink:href="mask.png"></image>
    </mask>
  </defs>
</image>

</svg>

<div class="test"></div>

Mon problème est que j'aimerais parfois appliquer plusieurs masques en même temps. Je ne sais pas comment faire pour fusionner plusieurs images en une, qui elle même servirait de masque sur mon div (qui à l'image à filtrer en background).

Savez-vous comment faire?

merci.

[Ter Rowan]

regarde là : http://svground.fr/clip-et-mask.php

il fusionne une image d'un batiment avec une image d océan

[Argorate]

Le problème c'est qu'il "fusionne" en faisant un dégradé d'opacité. Hors moi, je suis dans le cas où j'ai plusieurs masques de fusion, et j'aimerais les cumulés. Il faudrait en quelque sorte additionné les pixels, je sais pas si tu vois ce que je veux dire? Et encore moins si c'est faisable^^

Le but étant: j'ai un masque qui cache le bord Nord de mes cases de terrain (enfin de superposé deux terrains différent et faire une transition plus douce). Mais dans le cas où je veux un bord "Nord" et "Est" en même temps, il me faudrait pouvoir cumulé le mask de base, plus une copie que je fais rotate(90), tu vois le délire?

[niahoo]

Bon à la limite tu fais autant de masques que de cas, c'est chiant mais ça peut dépanner :

4 masques à 1 bord
4 masques à 3 bords
(1 masque à 4 bords ?)
6 masques à 2 bords

[Xenos]

Si tu peux faire des rotations, tu réduis encore plus le nombre de combinaisons, c'est à dire 6 combinaisons seulement (au lieu de 16):
0000 (aucun bord)
0001 (1 bord)
0011 (2 bords perpendiculaires)
0101 (2 bords parallèles)
0111 (3 bords)
1111 (4 bords)

[Argorate]

Oui c'est ce que je pensais faire Xenos. Je chercher juste a savoir si y avait moyen d'avoir encore moins de cas en combinant plusieurs masque.

PS: vous oubliez les angles, mais peut importe^^

[niahoo]

Ah oui bien vu Xenos !

---

Les angles ? avec la rotation ça te fait 15 possibilités mais bien 6 defs à écrire seulement. Le code devra par contre déterminer lequel des ces 15 cas (oui, 16 avec 0 bord) appliquer.

[Argorate]

En fait c'est pire que ça, puisqu'il y a toute la combinatoire bord/angle... y a trop de cas. Seule solution viable, trouver cmt fusionner les masques. (retour à la question de départ!? )