Destramic Posted October 16, 2015 Share Posted October 16, 2015 (edited) hey guys i'm trying to crop a certain part of a image using imagecopyresized...i'm using js to get the coordinates of the image and the selected area that i'm after here is how i get the co-ordinates: var offset = image.position(), image_x = offset.left, image_y = offset.top, image_x2 = selected.width(), image_y2 = selected.height(), offset = selected.position(), selected_x = offset.left, selected_y = offset.top, selected_x2 = selected.width(), selected_y2 = selected.height(); co-ordinates image ----------------- x = 8 y = 8 selected area ----------------- x = 172 y = 75 x2 = 327 y2 = 292 i'm then using this function to try and get just the selected area as a image but it's not outputting correctley function crop($image, $selected_x = 0, $selected_y = 0, $image_x = 0, $image_y = 0, $selected_width = null, $selected_height = null) { list($width, $height) = getimagesize($image); $thumbnail = imagecreatetruecolor($width, $height); $image_source = imagecreatefromjpeg($image); imagecopyresized($thumbnail, $image_source, $selected_x, $selected_y, $image_x, $image_y, $selected_width, $selected_height, $width, $height); imagejpeg($thumbnail, "image-cropped.jpg", 100); } crop('image.jpg', 172, 75, 8, 8, 327, 292); image output: is it possible to get the selected image in the blue grid saved as a image please? any help on what i'm doing wrong would be great..please let me know if you need more info thank you Edited October 16, 2015 by Destramic Quote Link to comment Share on other sites More sharing options...
requinix Posted October 16, 2015 Share Posted October 16, 2015 Your code is a bit... messed up, with the values. Which is why you're getting something completely different than what you want to get. What is $image_x and _y for? I'm guessing that the thumbnail is supposed to be {$image_x}x{$image_y} in size? But isn't 8x8 tiny for a thumbnail? Quote Link to comment Share on other sites More sharing options...
Solution Barand Posted October 16, 2015 Solution Share Posted October 16, 2015 Is this what you are trying to achieve? <?php $x1 = 224; $y1 = 94; $x2 = 663; $y2 = 487; $w = $x2-$x1; $h = $y2-$y1; $im = imagecreatetruecolor($w, $h); $src = imagecreatefrompng('leopard.png'); imagecopyresized($im,$src,0,0,$x1,$y1,$w,$h,$w,$h); imagepng($im, 'leopard_cropped.png'); imagedestroy($im); imagedestroy($src); ?> 1 Quote Link to comment Share on other sites More sharing options...
Destramic Posted October 16, 2015 Author Share Posted October 16, 2015 Is this what you are trying to achieve? yes thank you ...seems i was no where close to what i wanted haha...i'm bit confused on your x, y positions barand...obviously mine must be wrong but how are you getting yours please? i'd like to get by JavaScript if possible thanks for your help! Quote Link to comment Share on other sites More sharing options...
Barand Posted October 17, 2015 Share Posted October 17, 2015 I got the x,y by opening the image in an image editor and hovering the mouse to see the coordinates. However, by using a grabbed image there is no guarantee that my copy is the same size as your original, hence the difference. Quote Link to comment Share on other sites More sharing options...
Barand Posted October 17, 2015 Share Posted October 17, 2015 I checked my original leopard.png image properties. I have width='1042' height='516' Quote Link to comment Share on other sites More sharing options...
benanamen Posted October 17, 2015 Share Posted October 17, 2015 (edited) I think the ingredient your missing is something like Jcrop. You just drag over the image for the coordinates. There are many, many sources for this kind of functionality. Many options for cropping the image. Simple to use. Why re-invent the wheel? http://deepliquid.com/projects/Jcrop/demos.php Edited October 17, 2015 by benanamen Quote Link to comment Share on other sites More sharing options...
Destramic Posted October 19, 2015 Author Share Posted October 19, 2015 I think the ingredient your missing is something like Jcrop. You just drag over the image for the coordinates. There are many, many sources for this kind of functionality. Many options for cropping the image. Simple to use. Why re-invent the wheel? http://deepliquid.com/projects/Jcrop/demos.php thanks but i've made my own cropper (with help from scootstah) as seen here: http://jsfiddle.net/destramic/ybq2mab5/ barand thank you for help...worked perfectly ....sorry for such a late reply also using the following worked great to get selected part of image. var selected = $('whatever'), offset = selected.position(), selected_x = offset.left, selected_y = offset.top, selected_x2 = selected.width(), selected_y2 = selected.height(); i will try and post my code to help future developers when i'm done (hopefully in the next couple of weeks) thanks guys!!!! Quote Link to comment Share on other sites More sharing options...
Destramic Posted October 21, 2015 Author Share Posted October 21, 2015 Hey guys just wanted to post the cropping function i made. which goes well with something like this: http://jsfiddle.net/...ramic/ybq2mab5/ if the image you are cropping is smaller/bigger or same size as orginal it will return crop exact for orginal image...works with x y co-ordinates too...hope it can help someone as much as it's helped me thanks for your help guys! function crop($image_source, $selected_x, $selected_y, $selected_x2, $selected_y2, $image_x = null, $image_y = null, $image_x2 = null, $image_y2 = null) { list($orginal_x2, $orginal_y2) = getimagesize($image_source); if (!is_null($image_x)) { if (is_null($image_x2) || $image_x2 === $orginal_x2) { $selected_x -= $image_x; } else if ($image_x2 > $orginal_x2) { $difference = (($image_x2 - $orginal_x2) / $image_x2 * 100); $image_difference = $image_x * ((100 - $difference) / 100); $select_difference = $selected_x * ((100 - $difference) / 100); $selected_x = ($select_difference - $image_difference); } else if ($image_x2 < $orginal_x2) { $difference = ($orginal_x2 / $image_x2); $image_difference = $image_x * $difference; $select_difference = $selected_x * $difference; $selected_x = ($select_difference - $image_difference); } } if (!is_null($image_y)) { if (is_null($image_y2) || $image_y2 === $orginal_y2) { $selected_y -= $image_y; } else if ($image_y2 > $orginal_y2) { $difference = (($image_y2 - $orginal_y2) / $image_y2 * 100); $image_difference = $image_y * ((100 - $difference) / 100); $select_difference = $selected_y * ((100 - $difference) / 100); $selected_y = ($select_difference - $image_difference); } else if ($image_y2 < $orginal_y2) { $difference = ($orginal_y2 / $image_y2); $image_difference = $image_y * $difference; $select_difference = $selected_y * $difference; $selected_y = ($select_difference - $image_difference); } } if (!is_null($image_x2)) { if ($image_x2 > $orginal_x2) { $width_difference = (($image_x2 - $orginal_x2) / $image_x2 * 100); $selected_x2 *= ((100 - $width_difference) / 100); } else if ($image_x2 < $orginal_x2) { $width_difference = (($orginal_x2 - $image_x2) / $image_x2 * 100); $selected_x2 *= (1 + $width_difference / 100); } else { $width_difference = 100 - (($image_x2 - $selected_x2) / $image_x2 * 100); $selected_x2 = $width_difference / 100 * $orginal_x2; } } if (!is_null($image_y2)) { if ($image_y2 > $orginal_y2) { $height_difference = (($image_y2 - $orginal_y2) / $image_y2 * 100); $selected_y2 *= ((100 - $height_difference) / 100); } else if ($image_y2 < $orginal_y2) { $height_difference = (($orginal_y2 - $image_y2) / $image_y2 * 100); $selected_y2 *= (1 + $height_difference / 100); } else { $height_difference = 100 - (($image_y2 - $selected_y2) / $image_y2 * 100); $selected_y2 = $height_difference / 100 * $orginal_y2; } } $image = imagecreatetruecolor($selected_x2, $selected_y2); $image_source = imagecreatefrompng($image_source); imagecopyresized($image, $image_source, 0, 0, $selected_x, $selected_y, $selected_x2, $selected_y2, $selected_x2, $selected_y2); imagepng($image, 'percentage.png'); imagedestroy($image); imagedestroy($image_source); } crop('image.png', 302, 1008, 525, 445, 23, 20, 2000, 1600); Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.