Usuario:ManuelRomero/JavaScript/canvas/ - Historial de revisiones

ManuelRomero: /* getContext() */

2016-05-25T09:59:33Z

‎getContext()

2016-03-25T21:42:28Z

‎Qué es

2016-03-12T09:36:38Z

2016-03-12T09:29:11Z

2016-03-12T09:28:24Z

2016-03-12T09:26:00Z

‎Qué es

2016-03-11T19:15:57Z

2016-03-11T19:11:05Z

2016-03-11T19:10:11Z

2016-03-11T18:59:12Z

Página creada con «{{Usuario:ManuelRomero/JavaScript/canvas/nav}} <br />»

Página nueva

{{Usuario:ManuelRomero/JavaScript/canvas/nav}}
<br />

← Revisión anterior		Revisión de 09:59 25 may 2016
Línea 37:		Línea 37:
	===getContext()===		===getContext()===
	*Este método nos devuelve un objeto que nos permitirá usar métdos y propiedades para dibujar		*Este método nos devuelve un objeto que nos permitirá usar métdos y propiedades para dibujar
		+	*Una vez que tenemos este método ya podemos empezar a dibujar.
		+	*Un objeto de este tipo es como un pincel para pintar
		+	===Pintando====
		+	*Vamos a ver métodos para pintar en el canvas
		+	*Ahora es cuestión de saber qué queremos hacer y buscar los métodos para pintar
		+	;Preparando el color para hacer un rectángulo
		+	<source src='javascript'>
		+	//fillStyle("color");
		+	//color ha de ser o el nombre del color si está codificado, o bien el código RGB
		+	fillStyle("red");
		+	fillStyle("#FF0000");
		+
		+
		+	</source>
		+
		+	;Dibujando un rectángulo
		+	<source src='javascript'>
		+	fillRect(x,y.ancho,alto)
		+	</source>
		+
		+	;Dibjando líneas
		+	;Haciendo un degradado de color

@@ Línea 18: / Línea 18: @@
    var lienzo = document.getElementobyId("idMiCanvas");
   //Obtener un objeto de la clase CanvasRenderingContext2D
-  var pincel = getContext("2d");
+  var pincel = lienzo.getContext("2d");
 </source>
 ===Canvas y 2D===

@@ Línea 15: / Línea 15: @@
 *Para obtener un objeto que nos permita dibujar debemos invocar al método de un '''''element''''' '''''<canvas>'''''
   <source lang=javascript>
-  //Obetener una referencia al tag canvas con un id "idMiCavas" var lienzo = document.getElementobyId("idMiCanvas");
+  //Obetener una referencia al tag canvas con un id "idMiCavas"
   //Obtener un objeto de la clase CanvasRenderingContext2D
   var pincel = getContext("2d");

@@ Línea 14: / Línea 14: @@
 [[imagen:iconWebGl.png|250px]]
 *Para obtener un objeto que nos permita dibujar debemos invocar al método de un '''''element''''' '''''<canvas>'''''
-  <source lang=javascrit>
+  <source lang=javascript>
   //Obetener una referencia al tag canvas con un id "idMiCavas" var lienzo = document.getElementobyId("idMiCanvas");
   //Obtener un objeto de la clase CanvasRenderingContext2D

@@ Línea 9: / Línea 9: @@
 *'''''<canvas>'''''Es una etiqueta o tag de html que sirve para especificar un contenedor donde dibujar gráficos en html
 *Estas acciones de dibujar se hacen mediante  lenguajes de programación; uno muy utilizado es JavaScript.
-[[imagen:iconCanvas.jpg]]
+[[imagen:iconCanvas.jpg|250px]]
 *Nosotros cuando rederizamos o dibujanmos en un lienzo cambas, lo podemos hacer usando 2D o escenas con profundidad o 3 coordenadas, realizando dibujos 3D.
 *Las técnicas 3D quedan descritas en WebGL.
-[[imagen:iconWebGl.jpg]]
+[[imagen:iconWebGl.png|250px]]
 *Para obtener un objeto que nos permita dibujar debemos invocar al método de un '''''element''''' '''''<canvas>'''''
   <source lang=javascrit>

@@ Línea 1: / Línea 1: @@
 {{Usuario:ManuelRomero/JavaScript/canvas/nav}}
 <br />
 {{Web|
 https://developer.mozilla.org/es/docs/Web/Guide/HTML/Canvas_tutorial
 }}
-{{Recursos de la Web|Escriba su texto aquí}}
 ===Qué es===
 *Es una etiqueta o tag de html que sirve para especificar un contenedor donde dibujar gráficos en html

← Revisión anterior		Revisión de 19:10 11 mar 2016
Línea 1:		Línea 1:
	{{Usuario:ManuelRomero/JavaScript/canvas/nav}}		{{Usuario:ManuelRomero/JavaScript/canvas/nav}}
	<br />		<br />
		+	{{Web\|
		+	https://developer.mozilla.org/es/docs/Web/Guide/HTML/Canvas_tutorial
		+	}}
		+	===Qué es===
		+	*Es una etiqueta o tag de html que sirve para especificar un contenedor donde dibujar gráficos en html
		+	*Estas acciones de dibujar se hacen mediante un lengaje de programación, muy utilizado JavaScript
		+
		+
		+
		+
		+
		+	===Creando un canvas===
		+	*Cuando se crea un canvas podríamos pensar que estamos creando un cuadro donde pintar o lienzo
		+	Por defecto se le asigna un tamaña de 300px 150px [ancho (width) * alto (height)]
		+	*Estos valores se pueden especificar en la definición o cambiar posteriormente.
		+	<source lang=html5>
		+	<canvas id="lienzo"> </canvas>
		+	</source>
		+
		+	<!--MRM ?-->
		+	*Para poder acceder al elemento y dibujar tenemos el método
		+	getContext()
		+	<!--MRM ?-->
		+	===getContext()===
		+	*Este método nos devuelve un objeto que nos permitirá usar métdos y propiedades para dibujar