Webmaster Workers utiliza cookies. Lea nuestra Política de Privacidad para obtener más información. Para eliminar este mensaje, haga clic en el siguiente botón: Acepto el uso de cookies


CANVAS (gradiente radial)





El método createRadialGradient crea una gradiente radial. La gradiente radial se crea con dos pares de coordenadas (x1,y1) a (x2,y2). Luego se especifica el radio de inicio y el radio final.



lienzo.createRadialGradient(comienzo x,comienzo y, radio de comienzo,x final, y final radio final)

Graficaremos un círculo con gradiente radial:



<!DOCTYPE HTML>
<html>
<head>

<script type="text/javascript">
function retornarLienzo(x) {
var canvas = document.getElementById(x);
if (canvas.getContext) {
var lienzo = canvas.getContext("2d");
return lienzo;
} else
return false;
}

function dibujar() {
var lienzo=retornarLienzo("lienzo1");
if (lienzo) {
var gradiente1=lienzo.createRadialGradient(200,200,0,200,200,200);
gradiente1.addColorStop(0,"rgb(255,0,0)");
gradiente1.addColorStop(1,"rgb(0,0,255)");
lienzo.fillStyle=gradiente1;
lienzo.arc(200,200,100,0,Math.PI*2,true);
lienzo.fill();

}
}

</script>

</head>
<body onLoad="dibujar()">
<canvas id="lienzo1" width="600" height="600">
Su navegador no permite utilizar canvas.
</canvas>
</body>
</html>








Opciones
Estadísticas
Creado 01.01.1970 a las 00:00 hs
Categoría HTML 5

  • Medallas
  • 0
    Favoritos
  • 9786
    Visitas
  • 0
    Puntos
  • 0
    Seguidores
Comentarios
0
Cargando comentarios espera un momento...
No tienes permisos para comentar.

Para poder comentar necesitas estar Registrado. O.. ya tienes usuario? Logueate!
Autor del post
Ver perfil de Administrador Administrador
Hombre Administrador  Mensaje
43 1,352 1
Medallas
No tiene medallas
Tags
Posts relacionados