Enregistrer photo après rotation

Résolu/Fermé

mont_dani Messages postés 232 Date d'inscription mardi 6 juin 2017 Statut Membre Dernière intervention 7 mai 2024 - Modifié le 1 févr. 2021 à 18:58
yg_be Messages postés 23392 Date d'inscription lundi 9 juin 2008 Statut Contributeur Dernière intervention 16 décembre 2024 - 10 févr. 2021 à 23:05

Bonjour

Dans mon site web, je propose aux utilisateur de laisser un témoignage texte + photo qui s'affiche en forme de livre.
Tout cela est parfait.

Le problème: le format des photos: vertical, horizontal...

Comme je ne suis pas sur que l'utilisateur charge une photo dans le bon sens, je lui propose, après avoir réduit la taille, de faire pivoter sa photo si necésaire.

Avec un peu de css et JS j'assure la rotation de la photo.

Mon problème: comment enregistrer la photo avec ce nouveau format?

Merci pour votre aide

Daniel.

Voici mon code

<?php
    if(isset($_POST['submit'])){
      if (isset ($_FILES['myImage'])){
    $imagename = $_FILES['myImage']['name'];
    $source = $_FILES['myImage']['tmp_name'];
    
	
    //Ceci est le nouveau fichier que vous enregistrez
    $save = "archivos/" . $imagename; 
   
	$info = getimagesize($_FILES['myImage']['tmp_name']);
    $mime = $info['mime'];
    switch ($mime) {
        case 'image/jpeg':
            $image_create_func = 'imagecreatefromjpeg';
            $image_save_func = 'imagejpeg';
            break;
		case 'image/jpg':
            $image_create_func = 'imagecreatefromjpg';
            $image_save_func = 'imagejpg';
            break;
        case 'image/png':
            $image_create_func = 'imagecreatefrompng';
            $image_save_func = 'imagepng';
            break;
        case 'image/gif':
            $image_create_func = 'imagecreatefromgif';
            $image_save_func = 'imagegif';
            break;
        default: 
            throw new Exception('Unknown image type.');
    }
      
   
	list($width, $height) = getimagesize($_FILES['myImage']['tmp_name']);
    $modwidth = 500;  //target width
	
    $diff = $width / $modwidth;
    
	$modheight = $height / $diff;
    
	
	$tn = imagecreatetruecolor($modwidth, $modheight) ;
    $image = $image_create_func($_FILES['myImage']['tmp_name']) ;
	imagecopyresampled($tn, $image, 0, 0, 0, 0, $modwidth, $modheight, $width, $height) ;
	$image_save_func($tn, $save) ;
	
	      
    echo ' PREMIERE SOLUTION
	<table border="0" width="50%" heigth="50%" align="center" text-align="center">
		
		<tr>
			
			<td  height="80%" align="center">
			
			<img id="image" src="'.$save.' ">
			<button onclick="pivoterdroite()">A DROITE<img src="image/tourne_droite.gif" width="10%" ></button><br><br>
			<button onclick="pivotergauche()">A GAUCHE<img scr="image/tourne_gauche.gif" width="10%"></button>
			
			
			
			</td>
			
		</tr>
		<tr>
			
			<td  align="center">
			<button onclick="une fonction pour enregistrer cette photo()">ENREGISTRER</button>
			</td>
			
		</tr>
	</table>';
	
	
	
	
	
      }
    }
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> </title>
		<meta name="viewport" content="width=device-width"/>
		<link rel="stylesheet" type="text/css" href="css/general.css"/>
		
<style type="text/css">
.rotated-image-droite {
	-ms-transform: rotate(90deg); /* IE 9 */
	-webkit-transform: rotate(90deg); /* Chrome, Safari, Opera */
	-moz-transform: rotate(90deg);  /* FF3.5/3.6 */
	-o-transform: rotate(90deg);  /* Opera 10.5 */
	-sand-transform: rotate(90deg);
	transform: rotate(90deg);
.rotated-image-gauche {
	-ms-transform: rotate(-90deg); /* IE 9 */
	-webkit-transform: rotate(-90deg); /* Chrome, Safari, Opera */
	-moz-transform: rotate(-90deg);  /* FF3.5/3.6 */
	-o-transform: rotate(-90deg);  /* Opera 10.5 */
	-sand-transform: rotate(-90deg);
	transform: rotate(-90deg);
}
</style>
<script> 
function pivoterdroite(){
  var img = document.getElementById("image");
  img.setAttribute("class", "rotated-image-droite");
}
function pivotergauche(){
  var img = document.getElementById("image");
  img.setAttribute("class", "rotated-image-gauche");
}
</script> 
	
 
 </head>
<body>
  <BR><BR>
<form action="" method="post" enctype="multipart/form-data">
  <input type="file" name="myImage" /> 
  <input type="submit" name="submit" value="Submit" />
</form>


 
   </body>
   
   </html>

A voir également:

Enregistrer photo après rotation
Audacity enregistrer son pc - Guide
Rotation ecran pc - Guide
Enregistrer en pdf - Guide
Partage photo - Guide
Photo aérienne de ma maison - Guide

4 réponses

Réponse 1 / 4

yg_be Messages postés 23392 Date d'inscription lundi 9 juin 2008 Statut Contributeur Dernière intervention 16 décembre 2024 Ambassadeur 1 556
1 févr. 2021 à 20:13

bonjour,
si je comprends, bien, tu ne modifies pas la photo, tu en modifies simplement l'affichage.
ne suffit-il alors pas de mémoriser comment la photo devra être chaque fois affichée ensuite?

mont_dani Messages postés 232 Date d'inscription mardi 6 juin 2017 Statut Membre Dernière intervention 7 mai 2024
2 févr. 2021 à 09:34

Bonjour.

Avant de verifier son affichage, je reduit la taille.

Pourrais-tu developper ton idée? Comment imagines-tu le faire?

merci

yg_be Messages postés 23392 Date d'inscription lundi 9 juin 2008 Statut Contributeur Dernière intervention 16 décembre 2024 1 556 > mont_dani Messages postés 232 Date d'inscription mardi 6 juin 2017 Statut Membre Dernière intervention 7 mai 2024
2 févr. 2021 à 12:52

si ton site mémorise quelle rotation il doit appliquer à chaque image, il peut appliquer cette rotation chaque fois qu'il affiche l'image.

Réponse 2 / 4

mont_dani Messages postés 232 Date d'inscription mardi 6 juin 2017 Statut Membre Dernière intervention 7 mai 2024
2 févr. 2021 à 13:17

En fait, je propose a l'utilisateur de télécharger une photo.

Je réduit la taille de la photo et l'enregistre sur le serveur.

Je m'appercoit en utilisant ces photos, que quelques unes doivent subir une rotation.
C'est pourquoi, je voudrai proposer a l'utilisateur une visualisation de sa photo avec la possiblisté de faire une rotattion et mettre un bouton pour lenregistrer sur le serveur.

J'ai réussi a programmer tout sauf l'enregistrement après rotation ou je bloque malgré mes recherches.

yg_be Messages postés 23392 Date d'inscription lundi 9 juin 2008 Statut Contributeur Dernière intervention 16 décembre 2024 1 556
2 févr. 2021 à 18:15

si je comprends ce que tu fais, l'image n'a pas subi de rotation, ce n'est que l'affichage de l'image qui a été tourné.

je pense qu'il y a deux possibilités:

1) tu fais la rotation sur le serveur, en utilisant un outil de traitement tel que imagerotate

2) tu ne touches pas à l'image, mais tu retiens que, chaque fois que quelqu'un voudra voir l'iage, il faudra la rourner à l'affichage.

Réponse 3 / 4

mont_dani Messages postés 232 Date d'inscription mardi 6 juin 2017 Statut Membre Dernière intervention 7 mai 2024
3 févr. 2021 à 08:59

La première solution me parait la meilleure.

Comment l'utilisateur peut-il visualiser la rotation de l'image en utilisant imagerotate?

yg_be Messages postés 23392 Date d'inscription lundi 9 juin 2008 Statut Contributeur Dernière intervention 16 décembre 2024 1 556
3 févr. 2021 à 13:39

imagerotate est fait sur le serveur, il faut ensuite envoyer l'image à l'utilisateur pour qu'il puisse la visualiser.

mont_dani Messages postés 232 Date d'inscription mardi 6 juin 2017 Statut Membre Dernière intervention 7 mai 2024 > yg_be Messages postés 23392 Date d'inscription lundi 9 juin 2008 Statut Contributeur Dernière intervention 16 décembre 2024
3 févr. 2021 à 17:47

Voici ce que j'ai préparé.

.

<?php
// Fichier et rotation
$nombre_archivo = 'image/fab.jpg';
$grados = 180;

// Type de contenu
header('Content-type: image/jpeg');

// Charger
$origen = imagecreatefromjpeg($nombre_archivo);

// Pivoter
$rotar = imagerotate($origen, $grados, 0);
//Imprime
imagejpeg($rotar);


?>
<html>
<body>
<p>
<?php echo $nombre_archivo; ?>
Ne renvoi aucune donnée
</p>
<table width="50%" height="50%">
<tr><td> <img src="<?php $nombre_archivo; ?>" ></td></tr>
<tr><td><p>test</p></td></tr>
</table>
</body>
</html>
<?php
imagejpeg($rotar,$nombre_archivo);

?>

Tout le php fonctionne.
Mon problème est d'afficher l'image dans la table

ne suffit-il pas de placer l'instruction qui affiche l'image au bon endroit dans le code?

Ou est le bon endroit dans le code?

tu écris que ton php fonctionne, sans décrire ce qu'il affiche.
que produit la ligne 15? si elle affiche l'image, tu pourrais la mettre au milieu de la ligne 26.
pour moi, le plus propre, ce serait, en ligne 15, de sauver l'image dans un fichier, et d'utiliser ce fichier en ligne 26.

Réponse 4 / 4

mont_dani Messages postés 232 Date d'inscription mardi 6 juin 2017 Statut Membre Dernière intervention 7 mai 2024
3 févr. 2021 à 15:30

Je fais un essais et te raconte