Bonjour, je vais tenter de répondre point par point sur tes essais:
> Essai1:
Très grossier effectivement. Pas tous les navigateurs ne sont capable d'afficher une flux svg imbriquée dans ton xhtml. Tu peux trouver plein d'exemple d'embed dans SVG test suites.
> essai2:
Une possibilité, Object, comme tu l'a essayé. Problème, aucun composant standard ne génère une balise Object. T'as là 2 possibilités.
La première est de créer un composant "object" qui va te générer une balise Object. Créer un composant JSF perso n'est pas bien difficile. Le plus dur est d'oser le pas
. Pour créer un composant, il te faut l'objet composant, éventuellement une taglib (si tu utilise JSP, pas besoin avec facelets), définir ton composant en trois lignes de xml dans un META-INF/faces-config.xml, éventuellement, pour faire propre, un renderer, mais c'est pas indispensable, le composant peut se charger du rendering.
La deuxième possibilité, moins propre, est d'aller à la bourrin avec un <f:verbatim>autour te la partie ouvrante statique de ton Object, puis un h:outputText pour l'output de l'url et finalement un deuxième f:verbatim pour la partie fermante. Ca donnerais un truc dans ce gout:
1 2 3 4 5
| <f:verbatim>
<object data="
</f:verbatim>
<h:outputText value="..."/>
<f:verbatim>" width="80" height="60" type="image/svg+xml"/></f:verbatim> |
Une variante serait d'utiliser un outputText avec un escape="false" pour créer à l'intérieur la balise Object:
<h:outputText escape="false" value='<object data="#{...}" width="80" height="60" type="image/svg+xml"/>"/>
Moche dans les deux cas...
>essai 3
h:graphicImage est pour moi probablement le meilleur résultat. Tu pointe le h:graphicImage non pas sur un png comme tu le fais, mais tu peux le pointer directement sur un flux svg (les w3c a défini qu'on pouvait utiliser le tag <image> pour du svg). Comme ton svg c'est du xml, tu peux créer un jsp (jsf) qui ne fait que générer le flux. T'as plus qu'à pointer le h:graphicImage dessus.
Si tu préfère vraiment la génération png (support des "vieux" browsers), tu peux soit t'orienter vers le composant mediaOutput que fourni la libraire richfaces (attention, grosse tartine d'ajax qui arrive avec) ou alors créer un composant perso qui te balance le flux binaire sur l'outputStream de la requete. T'as alors plus qu'à créer, comme pour du svg, un fichier jsf qui n'inclu que l'output de l'image en utilisant ce composant perso. Exemple:
fichier machin.jsf:
<h:graphicImage url="/image/picture.jsf" />
fichier /images/picture.jsf (version svg):
1 2 3 4 5 6 7
| <?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1 Tiny//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11-tiny.dtd">
<svg version="1.1" baseProfile="tiny" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" id="svg-root"
width="100%" height="100%" viewBox="0 0 480 360">
..... |
Fichier images/picture.jsf, version binaire
<custom:binaryOutput value="#{monBean.fluxPng}" contentType="image/png"/>
(Cette dernière méthode fonctionne de manière confirmée à mon boulot, 3 fois pas de code pour le faire
)
Partager