From a55b575e8089ee6cab7c5c262a7e6db55d0e34d6 Mon Sep 17 00:00:00 2001 From: Florian Merz Date: Thu, 11 Feb 2021 14:46:50 +0100 Subject: unslug es: move --- files/es/web/html/canvas/index.html | 170 ------------------------------------ 1 file changed, 170 deletions(-) delete mode 100644 files/es/web/html/canvas/index.html (limited to 'files/es/web/html/canvas/index.html') diff --git a/files/es/web/html/canvas/index.html b/files/es/web/html/canvas/index.html deleted file mode 100644 index dfdde2bf63..0000000000 --- a/files/es/web/html/canvas/index.html +++ /dev/null @@ -1,170 +0,0 @@ ---- -title: API Canvas -slug: Web/HTML/Canvas -tags: - - API - - Canvas - - JavaScript - - Referencia - - introducción -translation_of: Web/API/Canvas_API ---- -
{{CanvasSidebar}}
- -

Añadido en HTML5, el elemento HTML {{HTMLElement("canvas")}} se puede usar para dibujar gráficos mediante scripting en JavaScript. Por ejemplo, se puede usar para hacer gráficas, composiciones fotográficas, crear animaciones, o incluso procesado o renderizado de vídeo en tiempo real.

- -

Las aplicaciones de Mozilla soportan <canvas> desde Gecko 1.8 (es decir, Firefox 1.5). El elemento fue inicialmenmte presentado por Apple para el Dashboard de OS X y Safari. Internet Explorer soporta <canvas> desde la versión 9 en adelante; para versiones anteriores de IE, se puede añadir soporte para <canvas> a una página incluyendo un script del proyecto de Google Explorer Canvas. Google Chrome y Opera 9 también soportan <canvas>.

- -

El elemento <canvas> también se usa en WebGL para dibujar gráficos 3D con aceleración por hardware en páginas web.

- -

Ejemplo

- -

Esto es un trozo de código que usa el método {{domxref("CanvasRenderingContext2D.fillRect()")}}.

- -

HTML

- -
<canvas id="canvas"></canvas>
-
- -

JavaScript

- -
var canvas = document.getElementById('canvas');
-var ctx = canvas.getContext('2d');
-
-ctx.fillStyle = 'green';
-ctx.fillRect(10, 10, 100, 100);
-
- -

Edita este código para ver tus cambios en tiempo real en este canvas:

- - - -

{{ EmbedLiveSample('Código_editable', 700, 360) }}

- -

Referencia

- -
- -
- -

Las interfaces relacionadas con WebGLRenderingContext están en WebGL.

- -

{{domxref("CanvasCaptureMediaStream")}} está relacionado..

- -

Guías y tutoriales

- -
-
Tutorial Canvas
-
Tutorial exhaustivo que cubre tanto el uso básico de <canvas> como sus características avanzadas.
-
Fragmentos de código: Canvas
-
Algunos fragmentos de código orientados al desarrollador de extensiones usando <canvas>.
-
Demo: Un laberinto básico
-
Una demo de una animación de laberinto usando canvas.
-
Dibujar objetos DOM en un canvas
-
Cómo dibujar contenido DOM, como elementos HTML, en un canvas.
-
Manipulación de vídeo usando canvas
-
Combinando {{HTMLElement("video")}} y {{HTMLElement("canvas")}} para manipular datos de vídeo en tiempo real.
-
- -

Recursos

- -

Genéricos

- - - -

Librerías

- - - -

Especificaciones

- - - - - - - - - - - - - - - - -
EspecificaciónEstadoComentarios
{{SpecName('HTML WHATWG', 'scripting.html#the-canvas-element', '<canvas>')}}{{Spec2('HTML WHATWG')}} 
- -

Ver también

- - -- cgit v1.2.3-54-g00ecf