Foros del Web » Creando para Internet » Diseño web »

Problemas con redimensionamiento de imagenes

Estas en el tema de Problemas con redimensionamiento de imagenes en el foro de Diseño web en Foros del Web. Si tengo una imagen con unas dimensiones de 400px X 300px porque cuando en el codigo html la hago mas pequeña pierde resolucion? (esta en ...
  #1 (permalink)  
Antiguo 08/02/2009, 07:03
 
Fecha de Ingreso: febrero-2009
Mensajes: 45
Antigüedad: 8 años, 10 meses
Puntos: 0
Problemas con redimensionamiento de imagenes

Si tengo una imagen con unas dimensiones de 400px X 300px porque cuando en el codigo html la hago mas pequeña pierde resolucion? (esta en jpg)

Se supone que debe perder resolucion cuando la amplio, pero que debo hacer para que no suceda cuando la hago pequeña?

Es para mostrar varias vistas de unos zapatos, si son 4 vistas, no quiero tener 4 fotos con las dimensiones grandes y 4 con las dimensiones pequeñas, o no hay solucion?

Un saludo, y gracias por vuestro tiempo.
  #2 (permalink)  
Antiguo 08/02/2009, 11:58
Avatar de Wizart  
Fecha de Ingreso: noviembre-2008
Mensajes: 42
Antigüedad: 9 años
Puntos: 0
Respuesta: Problemas con redimensionamiento de imagenes

no la hay, lo normal es hacer tu imagen pequeña y tu imagen grande, si tuvieras muchos zapatos te recomiendo que hagas un Automatizador en Photoshop tienes la opción y te genera el mismo el Thumb de imágenes pequeñas y grandes, pero ten en cuenta que las imágenes pequeñas no es solo porque se van a ver bien ya que es su tamaño original y no redimensionado si no que también agilizarás la carga de información al ser la imagen mas pequeña, eso de enganchar las fotos en el dreamweaver y hacerlas mas pequeñas olvidate porque son triquiñuelas, las imagenes tienen su tamaño y nada mas.
  #3 (permalink)  
Antiguo 08/02/2009, 12:24
 
Fecha de Ingreso: diciembre-2008
Mensajes: 15
Antigüedad: 9 años
Puntos: 0
Respuesta: Problemas con redimensionamiento de imagenes

Hola Amigo, no te Recomiendo hacer Tanto Trabajo, Ademas Haces la Página más Pesada.
Mi Recomendación es que Trates de Usar Alguna Libreria de JavaScript jQuery, la cual tiene muchos Plugin Muy Buenos.

Mira mas Sobre el Tema, Cualquier Cosa Postea denuevo.

CrUX
  #4 (permalink)  
Antiguo 09/02/2009, 06:47
 
Fecha de Ingreso: febrero-2009
Mensajes: 45
Antigüedad: 8 años, 10 meses
Puntos: 0
Respuesta: Problemas con redimensionamiento de imagenes

ok,

Me he estado documentando y veo una serie de funciones para crear thumbails de las imagenes.

Lo he probado y funciona correctamente, la pregunta es:

Al crear la copia de la misma imagen pero mas reducida, pierde menos resolucion que si le cambiara el tamaño en el html no? A simple vista he probado y parece que se ve peor esta si cambio el tamaño en el html que si hago la copia...

dejo el codigo por si le interesan:

Código PHP:
function abrir_Imagen($imagen) {
    if (@
$info_imagen getimagesize($imagen)) {
        switch (
$info_imagen['mime']) {
        case 
"image/jpeg":
            if ([email protected]
$imagen_fuente imagecreatefromjpeg($imagen)) {
                return 
0;
            }
            break;
        case 
"image/gif":
            if ([email protected]
$imagen_fuente imagecreatefromgif($imagen)) {
                return 
0;
            }
            break;
        case 
"image/png":
            if ([email protected]
$imagen_fuente imagecreatefrompng($imagen)) {
                return 
0;
            }
            break;
        }
    } else {
        return 
0;
    }
    return 
$imagen_fuente;
}
 
function 
crear_Thumbnail($imagen$ancho_max 200$alto_max 200$calidad 80$destino ""$marca ""$posicion_marca 0$margen 4) {
 
    if (
$destino == "") {
        
header('Content-type: image/jpeg');
    }
 
    
//    OBTENGO LOS DATOS ORIGINALES DE LA IMAGEN Y CHEQUEO QUE SEA UNA IMAGEN VALIDA
    
if (@$datos_img getimagesize($imagen)) {
        
$ancho $datos_img[0];
        
$alto $datos_img[1];
        
        
        
$ancho_orig $ancho;
        
$alto_orig $alto;
        
        
//    CALCULO ANCHO Y ALTO PROPORCIONALES
        
if ($ancho $ancho_max) {
            
$proporcion round(($ancho_max 100) / $ancho);
            
$ancho $ancho_max;
            
$alto round(($alto $proporcion) / 100);
        }
        if (
$alto $alto_max) {
            
$proporcion round(($alto_max 100) / $alto);
            
$alto $alto_max;
            
$ancho round(($ancho $proporcion) / 100);
        }
        
        
//    CREO LA NUEVA IMAGEN
        
$imagen_nueva imagecreatetruecolor($ancho$alto);
        
        
//    ABRO LA IMAGEN FUENTE
        
if (!$imagen_fuente abrir_Imagen($imagen)) {
            return 
0;
            exit;
        }
        
        
//    COPIO LA IMAGEN FUENTE EN LA NUEVA
        
imagecopyresampled($imagen_nueva$imagen_fuente0000$ancho$alto$ancho_orig$alto_orig);
        
        
//    CHEQUEO SI HAY QUE AGREGAR UNA MARCA
        
if (($marca != "") && ($imagen_marca abrir_Imagen($marca))) {
            list(
$ancho_marca$alto_marca) = getimagesize($marca);
            
$pos_x $margen;
            
$pos_y $margen;
            switch (
$posicion_marca) {
            case 
1:
                
$pos_x = ($ancho $ancho_marca) - $margen;
                break;
            case 
2:
                
$pos_y = ($alto $alto_marca) - $margen;
                break;
            case 
3:
                
$pos_x = ($ancho $ancho_marca) - $margen;
                
$pos_y = ($alto $alto_marca) - $margen;
                break;
            }
            
imagecopy($imagen_nueva$imagen_marca$pos_x$pos_y00$ancho_marca$alto_marca);
        }
        
        
imagejpeg($imagen_nueva$destino$calidad);
        
        return 
1;
    } else {
        
//    HA OCURRIDO UN ERROR AL OBTENER LOS DATOS DE LA IMAGEN.
        //    PUEDE SER QUE EL ARCHIVO NO EXISTA, O QUE NO SEA UNA
        //    IMAGEN VALIDA.
        
return 0;
    }
}
crear_Thumbnail("zapato.jpg"10010080"zap_1.jpg"); 
Lo dicho, lo puedo hacer así? es que asi evitaria muchos procesos como:

Crear lotes/acciones en photoshop
Subir dos imagenes por modelos...

Pero bueno si es la única manera,....


Un saludo, y gracias por vuestra respuesta.
  #5 (permalink)  
Antiguo 09/02/2009, 09:05
Avatar de JoseAlejandro_Realza  
Fecha de Ingreso: agosto-2008
Ubicación: Maracay - Venezuela
Mensajes: 192
Antigüedad: 9 años, 4 meses
Puntos: 2
Respuesta: Problemas con redimensionamiento de imagenes

Hola que tal... yo estoy interesado en este tema, porque necesito que cuando mis usuarios vayan a subir sus fotos a su perfil si la imagen pasa un limite de px se redusca, intente con el script que dio el amigo Raul y no logro hacerlo funcionar, porque no me carga las imagenes a la carpeta "fotogracias/", y si meto imagenes png o gif igual hace todo como si la cargara, no me presenta errores ni nada, asi que algo no debe estar trabajando, y la diferencia es que yo no quiero seleccionarla por marca, solo quiero cargarla al directorio y cambiar sus dimensiones... Gracias por Todo, espero sepan ayudarnos..! =)

Aca esta el Codigo cambiandole la direccion del directorio:

Código PHP:
<?php

function abrir_Imagen($imagen) { 
    if (@
$info_imagen getimagesize($imagen)) { 
        switch (
$info_imagen['mime']) { 
        case 
"image/jpeg"
            if ([email protected]
$imagen_fuente imagecreatefromjpeg($imagen)) { 
                return 
0
            } 
            break; 
        case 
"image/gif"
            if ([email protected]
$imagen_fuente imagecreatefromgif($imagen)) { 
                return 
0
            } 
            break; 
        case 
"image/png"
            if ([email protected]
$imagen_fuente imagecreatefrompng($imagen)) { 
                return 
0
            } 
            break; 
        } 
    } else { 
        return 
0
    } 
    return 
$imagen_fuente

  
function 
crear_Thumbnail($imagen$ancho_max 500$alto_max 500$calidad 80$destino "Galerias/"$marca ""$posicion_marca 0$margen 4) { 
  
    if (
$destino == "Galerias/") { 
        
header('Content-type: image/jpeg'); 
    } 
  
    
//    OBTENGO LOS DATOS ORIGINALES DE LA IMAGEN Y CHEQUEO QUE SEA UNA IMAGEN VALIDA 
    
if (@$datos_img getimagesize($imagen)) { 
        
$ancho $datos_img[0]; 
        
$alto $datos_img[1]; 
         
         
        
$ancho_orig $ancho
        
$alto_orig $alto
         
        
//    CALCULO ANCHO Y ALTO PROPORCIONALES 
        
if ($ancho $ancho_max) { 
            
$proporcion round(($ancho_max 100) / $ancho); 
            
$ancho $ancho_max
            
$alto round(($alto $proporcion) / 100); 
        } 
        if (
$alto $alto_max) { 
            
$proporcion round(($alto_max 100) / $alto); 
            
$alto $alto_max
            
$ancho round(($ancho $proporcion) / 100); 
        } 
         
        
//    CREO LA NUEVA IMAGEN 
        
$imagen_nueva imagecreatetruecolor($ancho$alto); 
         
        
//    ABRO LA IMAGEN FUENTE 
        
if (!$imagen_fuente abrir_Imagen($imagen)) { 
            return 
0
            exit; 
        } 
         
        
//    COPIO LA IMAGEN FUENTE EN LA NUEVA 
        
imagecopyresampled($imagen_nueva$imagen_fuente0000$ancho$alto$ancho_orig$alto_orig); 
         
        
//    CHEQUEO SI HAY QUE AGREGAR UNA MARCA 
        
if (($marca != "") && ($imagen_marca abrir_Imagen($marca))) { 
            list(
$ancho_marca$alto_marca) = getimagesize($marca); 
            
$pos_x $margen
            
$pos_y $margen
            switch (
$posicion_marca) { 
            case 
1
                
$pos_x = ($ancho $ancho_marca) - $margen
                break; 
            case 
2
                
$pos_y = ($alto $alto_marca) - $margen
                break; 
            case 
3
                
$pos_x = ($ancho $ancho_marca) - $margen
                
$pos_y = ($alto $alto_marca) - $margen
                break; 
            } 
            
imagecopy($imagen_nueva$imagen_marca$pos_x$pos_y00$ancho_marca$alto_marca); 
        } 
         
        
imagejpeg($imagen_nueva$destino$calidad); 
         
        return 
1
    } else { 
        
//    HA OCURRIDO UN ERROR AL OBTENER LOS DATOS DE LA IMAGEN. 
        //    PUEDE SER QUE EL ARCHIVO NO EXISTA, O QUE NO SEA UNA 
        //    IMAGEN VALIDA. 
        
return 0
    } 

crear_Thumbnail("zapato.jpg"10010080"zap_1.jpg"); 
?>

<form enctype="multipart/form-data" action="redimencion.php" method="post"> 
<input type="hidden" name="MAX_FILE_SIZE" value="200000000"> 
Subir esta imagen: <input name="imagen" type="file">  
<form action="<? echo $PHP_SELF;?>" method="post"> 
Foto:<br> 
<input type="text" name="foto"><br> 
Descripcion: 
<br> 
<textarea name="descripcion" cols="50" rows="10"></textarea><br> 
<input type="submit" name='submit' value="Subir Foto"> 
</form>  
<p>&nbsp;</p>
<p>&nbsp;</p>
__________________
Tu Guía Empresarial http://www.empresarial.org.ve Soluciones Empresariales

Atte: José Alejandro Realza
  #6 (permalink)  
Antiguo 09/02/2009, 10:48
 
Fecha de Ingreso: febrero-2009
Mensajes: 45
Antigüedad: 8 años, 10 meses
Puntos: 0
Respuesta: Problemas con redimensionamiento de imagenes

Tienes creados dos formularios...

En el segundo tienes que ponerle enctype="multipart/form-data" para el envio del archivo temporal, sino no logras pasar la imagen, y el primero no creo que te sea necesario crearlo no?

Un saludo.
  #7 (permalink)  
Antiguo 09/02/2009, 12:23
Avatar de JoseAlejandro_Realza  
Fecha de Ingreso: agosto-2008
Ubicación: Maracay - Venezuela
Mensajes: 192
Antigüedad: 9 años, 4 meses
Puntos: 2
Respuesta: Problemas con redimensionamiento de imagenes

Si hermano, pero eso es porque esos otros campos seran insertados a una base de datos con la direccion nueva de la imagen
__________________
Tu Guía Empresarial http://www.empresarial.org.ve Soluciones Empresariales

Atte: José Alejandro Realza
  #8 (permalink)  
Antiguo 13/02/2009, 08:25
 
Fecha de Ingreso: febrero-2009
Mensajes: 45
Antigüedad: 8 años, 10 meses
Puntos: 0
Respuesta: Problemas con redimensionamiento de imagenes

Cita:
<form enctype="multipart/form-data" action="redimencion.php" method="post">
<input type="hidden" name="MAX_FILE_SIZE" value="200000000">
Subir esta imagen: <input name="imagen" type="file">
<form action="<? echo $PHP_SELF;?>" method="post">
Foto:<br>
<input type="text" name="foto"><br>
Descripcion:
<br>
<textarea name="descripcion" cols="50" rows="10"></textarea><br>
<input type="submit" name='submit' value="Subir Foto">
</form>
<p>&nbsp;</p>
<p>&nbsp;</p>
Haber te comento, esto no lo puedes hacer, no debes meter un formulario dentro de otro, ademas que pienso que con uno solo es suficiente.

Has probado a ejecutar unicamente el código??? antes de ponerle el formulario?

Si no lo has probado, pruebalo para detectar el fallo, ademas que según has pegado la linea:
crear_Thumbnail("zapato.jpg", 100, 100, 80, "zap_1.jpg");
es de mi código, asi que este codigo te crea el thumbnail de zapato.jpg, y si no tienes ese archivo no correrá bien el código ni te creará la copia en miniatura....

checkealo y cuentas que tal va...
  #9 (permalink)  
Antiguo 13/02/2009, 08:28
 
Fecha de Ingreso: febrero-2009
Mensajes: 45
Antigüedad: 8 años, 10 meses
Puntos: 0
Respuesta: Problemas con redimensionamiento de imagenes

Vuelvo a reabrir el tema, no me funciona la solucion que he tomato, las imagenes no tienen buena calidad cuando las reduzco en el thumbnail. Tienen la misma calidad que si cogiera el html y directamente le cambiara el tamaño.

El caso es que son varias vistas de una misma foto, que las puedo ver en grande o en pequeño, y si son 4 vistas, crear 8 imagenes(4 grandes y 4 pequeñas) para cada foto es un poco engorroso... a parte que a la hora de hacer modificaciones seria mas tedioso.

Estoy seguro que debe haber alguna solucion, hasta el mismo google en busquedas de imagenes lo utiliza, espero puedan ayudarme a conseguir que estas imagenes no pierdan calidad.
  #10 (permalink)  
Antiguo 13/02/2009, 15:21
ramonjosegn
Invitado
 
Mensajes: n/a
Puntos:
Respuesta: Problemas con redimensionamiento de imagenes

hay un script en php que hace lo que queréis pero no recuerdo el nombre...
  #11 (permalink)  
Antiguo 13/02/2009, 16:53
Avatar de ElJavista
Colaborador
 
Fecha de Ingreso: marzo-2007
Ubicación: Lima Perú
Mensajes: 2.231
Antigüedad: 10 años, 9 meses
Puntos: 67
Respuesta: Problemas con redimensionamiento de imagenes

Bueno, a continuación dejo una clase de mi autoría, sirve para lo que necesitan y talvez más. Pruebenla y si tiene preguntas las hacen:

Código PHP:
<?php
  
class Imagen {
        private 
$exist false;
        private 
$width 0;
        private 
$height 0;
        private 
$source null;
        private 
$thumb null;

        function 
Imagen($img) {
                 if (
file_exists($img)) {
                    list(
$wi$he$tip) = getimagesize($img);
                    
$this->width $wi;
                    
$this->height $he;

                    if (
$tip == 1$this->source imagecreatefromgif($img);
                    elseif (
$tip == 2$this->source imagecreatefromjpeg($img);
                    elseif (
$tip == 3$this->source imagecreatefrompng($img);
                    
$this->exist true;
                 }
        }

        private function 
createThumb($w$h) {
                
$this->thumb imagecreatetruecolor($w$h);
        }

        function 
makeThumb($ruta$w$h$opc false) {
                 if (
$this->exist) {
                    
$wi $this->width;
                    
$he $this->height;

                    if (
$w) {
                       
$wp $w;
                       
$hp round(($he $wi) * $wp);
                    }  elseif (
$h) {
                       
$hp $h;
                       
$wp round(($wi $he) * $hp);
                    }

                    
$this->createThumb($wp$hp);
                    
$this->reDim(0000$wp$hp$wi$he);

                    if (
$opc) return $this->thumb;
                    else return 
$this->setImg($ruta);
                 }  else return 
false;
        }

        function 
makeCuadro($ruta$w$h$opc false) {
                 if (
$this->exist) {
                    if (
$w && $h) {
                       
$wi $this->width;
                       
$he $this->height;

                       if (
$wi $w || $he $h) {
                          if (
$wi $w $he $h) {
                             
$wp $w;
                             
$hp round(($he $wi) * $wp);
                          }  else {
                             
$hp $h;
                             
$wp round(($wi $he) * $hp);                       
                          }
                       }  else {
                          
$wp $wi;
                          
$hp $he;
                       }

                       
$this->createThumb($wp$hp);
                       
$this->reDim(0000$wp$hp$wi$he);

                       if (
$opc) return $this->thumb;
                       else return 
$this->setImg($ruta);
                    }  else return 
false;
                 }  else return 
false;
        }

        function 
makeCorte($ruta$w$h$opc false) {
                 if (
$this->exist) {
                    
$wi $this->width;
                    
$he $this->height;

                    if (
$w && $h) {
                       if (
$wi $w $he $h) {
                          
$wp $wi;
                          
$hp round(($h $w) * $wp);
                       }  else {
                          
$hp $he;
                          
$wp round(($w $h) * $hp);
                       }
                       
$lf round(($wi $wp) / 2);
                       
$tp round(($he $hp) / 2);

                       
$this->createThumb($w$h);
                       
$this->reDim(00$lf$tp$w$h$wp$hp);

                       if (
$opc) return $this->thumb;
                       else return 
$this->setImg($ruta);
                    }  else return 
false;
                 }  else return 
false;
        }

        private function 
reDim($dstX$dstY$srcX$srcY$dstW$dstH$srcW$srcH) {
                
imagecopyresampled($this->thumb$this->source$dstX$dstY$srcX$srcY$dstW$dstH$srcW$srcH);
        }

        private function 
setImg($ruta) {
                return 
imagejpeg($this->thumb$ruta);
        }
}
if (isset(
$_GET["img"])) {
   
$img $_GET["img"];
   if (
file_exists($img)) {
      
$ima = new Imagen($img);
      
$tip $_GET["tip"];
      
$w $_GET["w"];
      
$h $_GET["h"];

      if (
$tip == 0$thumb $ima->makeThumb(""$w$htrue);
      if (
$tip == 1$thumb $ima->makeCuadro(""$w$htrue);
      if (
$tip == 2$thumb $ima->makeCorte(""$w$htrue);

      if (
$thumb) {
         
header('Content-type: image/jpeg');
         
imagejpeg($thumb);
      }  else echo 
"Error";
   }
}
?>
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 18:53.