2010-10-05 13 views
2

J'ai un service Web qui renvoie une chaîne de code svg. Mon problème est, je ne suis pas sûr de savoir quoi en faire. Je n'ai jamais travaillé avec SVG auparavant. Mes questions sont:Affichage de SVG en HTML

  1. Est-ce que SVG a le support fort par les navigateurs communs?
  2. Comment afficher réellement l'image que le SVG représente? SVG est pris en charge par presque tous les principaux navigateurs, sauf IE, je pense, mais qui peut également être rendue avec un plugin.

Répondre

1

IE rend VML

Je suggère d'utiliser RaphaelJS http://raphaeljs.com/reference.html#image

EDIT:

var r = Raphael("holder", 600, 540); //"holder" is the id of an empty div in html file 
r.image("lion.svg", 140, 140, 320, 240);// r.image(src,x,y,width,height) 
+0

Est-ce que Rapheal prend en charge le chargement SVG? J'ai un fichier XML SVG existant mais basé sur la documentation, je ne vois pas comment. Ai-je tort? – user462166

+0

J'ai édité le poste avec du code de base: vous pouvez consulter les démos sur raphael par exemple: http: //raphaeljs.com/reflection.html ici, il charge un jpg vous pouvez remplacer le chemin avec un svg. Si vous êtes à l'aise avec jquery essayez ceci http://keith-wood.name/svg.html – jknair

0

À partir de HTML5, vous pouvez intégrer SVG directement dans un document HTML. Ceci est supporté par tous les principaux navigateurs modernes, à l'exception d'Internet Explorer. Vous pouvez utiliser le concept de toile HTML (comme illustré here)

Mais, puisque vous avez très probablement ne peut pas laisser les gens IE derrière encore, vous pouvez aller avec l'une des trois options existantes montré here

0

La plupart state- les navigateurs de pointe supportent SVG, mais peu de navigateurs encore utilisés (par exemple Internet Explorer 7) échouent. Donc, pour une compatibilité parfaite, vous devriez coller aux formats gif, jpg ou png. Testez votre propre navigateur ici: http://alphanemoon.com/2008/artikel/inline-svg-browser-test.xhtml

+0

Internet Explorer 8 manque également de support pour SVG. – colinmarc

1

Svg est une spécification pour XML. La plupart des navigateurs modernes peuvent simplement l'afficher en ligne, mais pas Internet Explorer.

Je recommande d'entourer tout votre contenu svg en svgweb, qui est une couche mince autour du code svg. Si l'utilisateur utilise un navigateur compatible standard, il affiche normalement le svg. Sinon, il le convertit en contenu flash.