ingenieradesistemas
499751083497328
Cargando...

Gráficos vectoriales



En nuestros documentos HTML5 es posible trabajar con gráficos vectoriales SVG por lo que se puede utilizar las etiquetas correspondientes. En nuestro ejercicio vamos a replicar el gráfico de un círculo, rectángulo, línea y elipse con sus correspondientes propiedades.

Gráficos vectoriales

El código Html es el que sigue:

<!DOCTYPE html>
<html>
      <head>
       <title>Grafico en SVG</title>
      </head>
      <body>
       
       <svg id="circulo" width="400" height="400" xmlns="http://www.w3.org/2000/svg">
                 <circle id="circuloazul" cx="200" cy="200" r="50" fill="green" />
                 <rect id="rectangulo" width="100" height="100" fill="red" />
                 <line x1="100" y1="100" x2="200" y2="200" style="stroke: blue; stroke-width:8;" />
                 <ellipse cx="200" cy="200" rx="200" ry="10" fill="black" />

            </svg>
      </body>
</html>

El resultado en pantalla debería verse así:

Gráficos vectoriales 


HTML5 y CSS3 3081434195643741941

Publicar un comentario Default Comments

emo-but-icon

Página principal item

Los apuntes en tu correo

Síguenos en Facebook

Apuntes aleatorios