Example of PHP and js scaling database images in equal proportions

  • 2020-03-30 02:44:30
  • OfStack

Isometric scaling of an image by JS

code
 
Code highlighting produced by Actipro CodeHighlighter (freeware)http://www.CodeHighlighter.com/--><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title> The latest javascript Automatically displays the picture to scale and compresses the picture to scale </title> 
<script type="text/javascript"> 
function AutoResizeImage(maxWidth,maxHeight,objImg){ 
var img = new Image(); 
img.src = objImg.src; 
var hRatio; 
var wRatio; 
var Ratio = 1; 
var w = img.width; 
var h = img.height; 
wRatio = maxWidth / w; 
hRatio = maxHeight / h; 
if (maxWidth ==0 && maxHeight==0){ 
Ratio = 1; 
}else if (maxWidth==0){// 
if (hRatio<1) Ratio = hRatio; 
}else if (maxHeight==0){ 
if (wRatio<1) Ratio = wRatio; 
}else if (wRatio<1 || hRatio<1){ 
Ratio = (wRatio<=hRatio?wRatio:hRatio); 
} 
if (Ratio<1){ 
w = w * Ratio; 
h = h * Ratio; 
} 
objImg.height = h; 
objImg.width = w; 
} 
</script> 
</head> 
<body> 
<br /> 
 Original drawing shows ( 534 X 800 ) <br /> 
onload="AutoResizeImage(0,0,this)<br /> 
<a href="./img/IMG_20140424_200722.jpg" target="_blank"><img src="./img/IMG_20140424_200722.jpg" border="0" width="0" height="0" onload="AutoResizeImage(0,0,this)" alt="534 X 800"/></a><br/><br /> 
3. According to the height 250 The width of the 250  Proportional compression <br /> 
onload="AutoResizeImage(250,250,this)"<br /> 
<a href="./img/IMG_20140424_200722.jpg" target="_blank"><img src="./img/IMG_20140424_200722.jpg" border="0" width="0" height="0" onload="AutoResizeImage(250,250,this)" alt="200 X 300"/></a><br /><br /> 
6. If the original height and width of the image are less than the maximum height and width of the compression, the image will not be enlarged (as shown in the original) <br /> 
 The original image 444 x 207, Compressed into  500 x 600, The original image will remain <br /> 
onload="AutoResizeImage(500,600,this)"<br /> 
<a href="./img/IMG_20140424_200722.jpg" target="_blank"><img src="./img/IMG_20140424_200722.jpg" border="0" width="0" height="0" onload="AutoResizeImage(500,600,this)" alt="444 X 207"/></a><br /><br /> 
</body> 
</html> 

Proportional scaling of database images in PHP
 
<?php 
class ImgSF{ 
function make_img($img_address){ 
//Proportional scaling of images

//Because PHP can only manipulate resources, it copies the images that need to be scaled and creates them as new resources
$src=imagecreatefromjpeg($img_address); 

//Gets the width and height of the source image
$size_src=getimagesize($img_address); 
$w=$size_src['0']; 
$h=$size_src['1']; 

//Specifies the maximum width (or possibly height) to be zoomed out
$max=300; 

//According to the maximum value of 300, the length of the other side is calculated to obtain the width and height of the scaled image
if($w > $h){ 
$w=$max; 
$h=$h*($max/$size_src['0']); 
}else{ 
$h=$max; 
$w=$w*($max/$size_src['1']); 
} 


//Declare a $w wide, $h high true-color image resource
$image=imagecreatetruecolor($w, $h); 


//Key function, parameters (target resource, source, starting coordinates of target resource x,y, starting coordinates of source resource x,y, width and height of target resource w,h, width and height of source resource w,h)
imagecopyresampled($image, $src, 0, 0, 0, 0, $w, $h, $size_src['0'], $size_src['1']); 

//Tells the browser to parse as a picture
header('content-type:image/png'); 
imagepng($image); 

//Destruction of resources
imagedestroy($image); 
} 
} 
$obj=new ImgSF(); 
$obj->make_img("./img/IMG_20140424_200722.jpg"); 

Related articles: