html5-canvasLos tipos de medios y el lienzo.
Observaciones
Este tema trata sobre los distintos tipos de medios y cómo se pueden utilizar con el lienzo en la interfaz 2D.
Los tipos de medios tienen categorías genéricas y específicas de formato.
Tipos de medios
- Animaciones
- Videos
- Imágenes
- Imagenes HD
- Imagen vectorial
- Imagenes animadas
Formatos de medios
- Jpg / Jpeg
- Png
- Gif
- SVG
- M-JPEG
- Webm
- Webp
Imágenes
Hay una gran variedad de formatos de imagen compatibles con los navegadores, aunque ningún navegador los admite a todos. Si tiene formatos de imagen particulares, desea utilizar los navegadores Wiki y los formatos de imagen compatibles proporciona una buena visión general.
El mejor soporte es para los 3 formatos principales, "jpeg", "png" y "gif" con todos los navegadores principales que brindan soporte.
JPEG
Las imágenes JPEG se adaptan mejor a las fotos y fotos como imágenes. No se prestan a los cuadros, diagramas y texto. Las imágenes JPEG no admiten transparencia.
Canvas puede generar imágenes JPEG a través de canvas.toDataURL y canvas.toBlob y proporciona una configuración de calidad. Como JPEG no admite la transparencia, todos los píxeles transparentes se mezclarán con el negro para la salida final JPG. La imagen resultante no será una copia perfecta del lienzo.
Png
Las imágenes PNG son imágenes de la más alta calidad y también pueden incluir un canal alfa para píxeles transparentes. Los datos de la imagen están comprimidos pero no producen artefactos como las imágenes JPG.
Debido a la compresión sin pérdida y el soporte de canal alfa, los PNG se utilizan para juegos, imágenes de componentes de interfaz de usuario, cuadros, diagramas y texto. Cuando se usan para fotos como fotos, su tamaño de archivo puede ser mucho más grande que el de JPEG. .
El formato PNG también proporciona soporte de animación, aunque el soporte del navegador es limitado, y el acceso a la animación para usar en el lienzo solo se puede realizar a través de las API y bibliotecas de Javascript
El lienzo se puede usar para codificar imágenes PNG a través de canvas.toDataURL y canvas.toBlob aunque el formato de salida está limitado a RGBA comprimido de 32 bits. El PNG proporcionará una copia perfecta del pixel del lienzo.
GIF
Los GIF se usan para animaciones cortas, pero también se pueden usar para proporcionar gráficos, diagramas y texto de alta calidad como imágenes. Los GIF tienen un soporte de color muy limitado con un máximo de 256 colores por fotograma. Con el procesamiento de imágenes cleaver, las imágenes gif pueden producir resultados sorprendentemente buenos, especialmente cuando se animan. Los gifs también proporcionan transparencia, aunque esto está limitado a activado o desactivado.
AS con PNG, las animaciones GIF no son accesibles directamente para su uso en el lienzo y necesitará una API o biblioteca de Javascript para obtener acceso. GIF no se puede guardar a través del lienzo y requerirá una API o una biblioteca para hacerlo.
