Comprimir Imagenes
Quote from Gustavo1973 on July 29, 2024, 8:35 pm@luishp
Existe alguna manera desde VisualNeo Web de poder a una imagen subida mediante FileInput poder reducirle su tamaño sin intervencion del usuario?
la idea es crear un catalogo online en el cual el usuario carga sus propias imagenes y son subidas al servidor para luego mostrarlas en un catalogo, pero ejemplo, si son subidas desde el movil tienen mucho peso y despues es complicado al mostrarlas.
Creo que alguna vez comentastes que mediante el plugin Fabricjs se podia realizar algo de esto , pero requiere intervencion manual, pienso en algo mas automatico por detras sin intervencion, se podria ?
Existe alguna manera desde VisualNeo Web de poder a una imagen subida mediante FileInput poder reducirle su tamaño sin intervencion del usuario?
la idea es crear un catalogo online en el cual el usuario carga sus propias imagenes y son subidas al servidor para luego mostrarlas en un catalogo, pero ejemplo, si son subidas desde el movil tienen mucho peso y despues es complicado al mostrarlas.
Creo que alguna vez comentastes que mediante el plugin Fabricjs se podia realizar algo de esto , pero requiere intervencion manual, pienso en algo mas automatico por detras sin intervencion, se podria ?
Quote from luishp on July 30, 2024, 8:50 am@gustavo1973, si utilizando el plugin FabricJS. Fijate en este ejemplo que siempre produce imágenes a un tamaño exacto:
https://bibliotecascolladovillalba.org/imagenUtiliza fabInitializeStatic y fabScaleToWidth para automatizarlo.
@gustavo1973, si utilizando el plugin FabricJS. Fijate en este ejemplo que siempre produce imágenes a un tamaño exacto:
https://bibliotecascolladovillalba.org/imagen
Utiliza fabInitializeStatic y fabScaleToWidth para automatizarlo.
Quote from Gustavo1973 on September 6, 2024, 5:35 am@luishp
Estuve haciendo pruebas con el ejemplo que me distes y funciono de maravillas
Ahora te pregunto, la imagen reducida generada mediante Fabricjs en el container puedo descargarla sin problemas a la PC, pero yo necesito poder subirla al servidor directamente mediante Neophp, y me encuentro con el siguiente problema:
la imagen original tiene un peso de 3,81mb
la imagen descargada reducida pesa 119kb,
hasta ahi todo bien, para poder subirla al servidor uso estas acciones:
fabSaveAsBase64 "Container126" [Imagen_Base64] neoPhpFileWriteFromBase64 "Fotos/Foto.jpg" "[Imagen_Base64]" "" fabSaveAsJPG "Container126" "image.jpg" 1
El problema es que la imagen subida al servidor ahora pesa 476kb
De que otra manera puedo subirla sin que aumente el tamaño?
Estuve haciendo pruebas con el ejemplo que me distes y funciono de maravillas
Ahora te pregunto, la imagen reducida generada mediante Fabricjs en el container puedo descargarla sin problemas a la PC, pero yo necesito poder subirla al servidor directamente mediante Neophp, y me encuentro con el siguiente problema:
la imagen original tiene un peso de 3,81mb
la imagen descargada reducida pesa 119kb,
hasta ahi todo bien, para poder subirla al servidor uso estas acciones:
fabSaveAsBase64 "Container126" [Imagen_Base64] neoPhpFileWriteFromBase64 "Fotos/Foto.jpg" "[Imagen_Base64]" "" fabSaveAsJPG "Container126" "image.jpg" 1
El problema es que la imagen subida al servidor ahora pesa 476kb
De que otra manera puedo subirla sin que aumente el tamaño?
Quote from luishp on September 6, 2024, 12:43 pm@gustavo1973 si utilizas fabSaveAsBase64 se guaradara en formato Base64 pero PNG que apenas tiene compresion.
Para guardar en Base64 utilizando JPG o mejor aun WebP he incluido dos nuevos comandos:fabSaveAsBase64JPG
fabSaveAsBase64WebPAmbos permiten indicar el nivel de compresion.
Te adjunto la ultima version del plugin que incluire en la proxima actualizacion.Por favor pruebalo y me confirmas que todo funciona correctamente.
@gustavo1973 si utilizas fabSaveAsBase64 se guaradara en formato Base64 pero PNG que apenas tiene compresion.
Para guardar en Base64 utilizando JPG o mejor aun WebP he incluido dos nuevos comandos:
fabSaveAsBase64JPG
fabSaveAsBase64WebP
Ambos permiten indicar el nivel de compresion.
Te adjunto la ultima version del plugin que incluire en la proxima actualizacion.
Por favor pruebalo y me confirmas que todo funciona correctamente.
Uploaded files:- You need to login to have access to uploads.
Quote from Gustavo1973 on September 6, 2024, 4:34 pm@luishp
Ambas opciones funcionan bien,
Algunas dudas:
El poder seleccionar la calidad de compresion o calidad es solo para las opciones de descarga como lo es "fabSaveAsJPG " pero pero no se puede cuando se convierten a Base64?
Si a la imagen cargada al container no le aplico que se adapte al mismo mediante "fabScaleToWidth" y "fabScaleToHeight " al momento de descargarla o convertirla a Base64 solo me exporta la parte visible del container, se puede adaptar el container en tiempo real a el tamaño de la imagen cargada? o mas alla del tamaño del container que me exporte la imagen completa?
Ambas opciones funcionan bien,
Algunas dudas:
El poder seleccionar la calidad de compresion o calidad es solo para las opciones de descarga como lo es "fabSaveAsJPG " pero pero no se puede cuando se convierten a Base64?
Si a la imagen cargada al container no le aplico que se adapte al mismo mediante "fabScaleToWidth" y "fabScaleToHeight " al momento de descargarla o convertirla a Base64 solo me exporta la parte visible del container, se puede adaptar el container en tiempo real a el tamaño de la imagen cargada? o mas alla del tamaño del container que me exporte la imagen completa?
Quote from Gustavo1973 on September 6, 2024, 7:07 pmLogre solucionar lo que antes te pedia de como hacer
pero el tamaño de la imagen subida al servidor es de 14.2 mb cuando el original es de 3,11Mb
Algo no esta bien, deberia ser menor o no?
El procedimiento que hago es el siguiente:
Cargo la foto al fabric mediante fileinput:
fabLoadFile "Container126" "prueba"
Obtengo las medidas de la foto cargada:
fabGetProperty "Container126" "prueba" "width" [width] fabGetProperty "Container126" "prueba" "height" [Height]Convierto el container a la misma medida de la foto:
fabSetCanvasSize "Container126" [width] [Height]Luego conviert la imagen a Base64
fabSaveAsBase64WebP "Container126" "[Imagen_Base64]" 1Y la subo al servidor
neoPhpFileWriteFromBase64 "Fotos/Foto.webp" "[Imagen_Base64]" ""
Logre solucionar lo que antes te pedia de como hacer
pero el tamaño de la imagen subida al servidor es de 14.2 mb cuando el original es de 3,11Mb
Algo no esta bien, deberia ser menor o no?
El procedimiento que hago es el siguiente:
Cargo la foto al fabric mediante fileinput:
fabLoadFile "Container126" "prueba"
Obtengo las medidas de la foto cargada:
fabGetProperty "Container126" "prueba" "width" [width] fabGetProperty "Container126" "prueba" "height" [Height]
Convierto el container a la misma medida de la foto:
fabSetCanvasSize "Container126" [width] [Height]
Luego conviert la imagen a Base64
fabSaveAsBase64WebP "Container126" "[Imagen_Base64]" 1
Y la subo al servidor
neoPhpFileWriteFromBase64 "Fotos/Foto.webp" "[Imagen_Base64]" ""
Quote from luishp on September 7, 2024, 9:28 am@gustavo1973 no utilices un valor de compresion de 1 que es la máxima calidad posible con mínima compresión.
Utiliza algo como esto:fabSaveAsBase64WebP "Container126" "[Imagen_Base64]" 0.7Verás que la diferencia en tamaño es abismal mientras que apenas se nota en la calidad.
Saludos.
@gustavo1973 no utilices un valor de compresion de 1 que es la máxima calidad posible con mínima compresión.
Utiliza algo como esto:
fabSaveAsBase64WebP "Container126" "[Imagen_Base64]" 0.7
Verás que la diferencia en tamaño es abismal mientras que apenas se nota en la calidad.
Saludos.