Herramientas de imagen en html5

1. SVG - CANVAS

2. Scalable Vector Graphics
Formato de imagen vectorial basado en XML. La ventaja
es que se puede modificar el tamaño (la resolución) de la
imagen sin perder calidad.

3. Incluye
Se puede utilizar SVG para hacer muchas
tareas que se hacen con CANVAS como alguna
figura geométrica, algún texto, degradados o
patrones.

4. dentro de el elemento svg se dibujo un circulo con
Coordenada x cx=50
Coordenada y cy=50
Radio r=50
Fill (Relleno) Rojo

5. Una forma efectiva y de más posibilidades con svg es definir los
gráficos o contenido por medio del formato XML.

6. Rectángulo

7. Añadir al rectángulo estilo:
Con rx y ry se da la curvatura
de los ángulos del rectángulo

8. Elipse
Otras Figuras:
<ellipse>
Línea <line>
Polilínea <polyline>
Poligono <polygon>
Ruta <path>

10. es un elemento HTML incorporado en HTML5 que
permite la generación de gráficos dinámicamente por
medio del scripting. Permite generar gráficos
estáticos y animaciones. Cualquier texto dentro de
este elemento se mostrará solo en los navegadores
que no soportan el canvas.

11. La etiqueta canvas va dentro del cuerpo del documento:

12. SVG - CANVAS