HTML5 en línea SVG
HTML5 soporta SVG en línea.
¿Cuál es SVG?
- SVG medios gráficos vectoriales escalables (Scalable Vector Graphics)
- SVG para gráficos utiliza para definir la red basada en vector
- SVG utiliza formato XML de definición de gráficos
- Imagen SVG para agrandar o no se perderá el cambio en el tamaño de su calidad de imagen
- SVG es un consorcio World Wide Web estándar
ventaja SVG
En comparación con otros formatos de imagen (como JPEG y GIF), utilizando SVG ventajas:
- Las imágenes SVG pueden ser creados y modificados usando un editor de texto
- Las imágenes SVG se pueden buscar, indexar, con guión o comprimidas
- SVG es escalable
- Las imágenes SVG se pueden imprimir en cualquier resolución de alta calidad
- SVG puede ser exagerada en la calidad de la imagen no disminuye
Soporte para el navegador
Internet Explorer 9 o superior, Firefox, Opera, Chrome, Safari y el apoyo SVG en línea.
El SVG incrustado directamente en la página HTML
En HTML5, usted será capaz de SVG elementos directamente en la página HTML:
Ejemplos
<html>
<body>
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" height="190">
<polygon points="100,10 40,180 190,60 10,60 160,180"
style="fill:lime;stroke:purple;stroke-width:5;fill-rule:evenodd;">
</svg>
</body>
</html>
Trate »
resultados:
Lo sentimos, su navegador no soporta SVG en línea.Más información sobre SVG tutorial, por favor visite SVG tutorial .
SVG y Canvas diferencia entre los dos
SVG es un gráfico 2D utilizando Descripción lenguaje XML.
Lienzo para dibujar gráficos en 2D utilizando JavaScript.
SVG basado en XML, lo que significa que cada elemento de la SVG DOM está disponible. Puede asociar controladores de eventos de JavaScript para un elemento.
En SVG, cada uno considerará que se dispone de objetos gráficos. Si los cambios de objeto SVG propiedad, el navegador puede reproducir automáticamente los gráficos.
La lona se hace pixel por pixel. En el lienzo, una vez que el gráfico se dibuja es completa, no va a seguir siendo la atención del navegador. Si se cambia la posición, a continuación, toda la escena también necesita ser redibujado, incluido cualquier objeto que pueda haber sido cubiertas con los gráficos.
La comparación de SVG y Canvas
La siguiente tabla muestra algunas de las diferencias entre el lienzo y SVG.
Canvas | SVG |
---|---|
|
|