Create magnifying glass

Not for 'how-to' coding questions but PHP theory instead, this forum is here for those of us who wish to learn about design aspects of programming with PHP.

Moderator: General Moderators

Post Reply
zenon
Forum Commoner
Posts: 42
Joined: Fri Jan 23, 2009 1:41 pm

Create magnifying glass

Post by zenon »

Good evening.

Do you know how can i create i magnifying class, in order to zoom in and out on images through php?
If you have a java script that does this work, i would very glad if some will help me.

Thank you!
User avatar
Christopher
Site Administrator
Posts: 13596
Joined: Wed Aug 25, 2004 7:54 pm
Location: New York, NY, US

Re: Create magnifying glass

Post by Christopher »

You can you plain HTML <img> to scale images. I think most places that do some fancy zooming use Flash. HTML canvas is coming soon...
(#10850)
zenon
Forum Commoner
Posts: 42
Joined: Fri Jan 23, 2009 1:41 pm

Re: Create magnifying glass

Post by zenon »

arborint wrote:You can you plain HTML <img> to scale images. I think most places that do some fancy zooming use Flash. HTML canvas is coming soon...
Thank you very much arborint!
josh
DevNet Master
Posts: 4872
Joined: Wed Feb 11, 2004 3:23 pm
Location: Palm beach, Florida

Re: Create magnifying glass

Post by josh »

Check out how we did it http://marinas.com/view/marina/2901_Mac ... son_Twp_MI ( drag and draw a box )

Flash handles UI. Sends paramaters to a PHP script which uses GD library, performs the resize and sends the jpg back to flash
zenon
Forum Commoner
Posts: 42
Joined: Fri Jan 23, 2009 1:41 pm

Re: Create magnifying glass

Post by zenon »

josh wrote:Check out how we did it http://marinas.com/view/marina/2901_Mac ... son_Twp_MI ( drag and draw a box )

Flash handles UI. Sends paramaters to a PHP script which uses GD library, performs the resize and sends the jpg back to flash
Thank you! It's really nice! Is there a way to find out it's code?
josh
DevNet Master
Posts: 4872
Joined: Wed Feb 11, 2004 3:23 pm
Location: Palm beach, Florida

Re: Create magnifying glass

Post by josh »

I cant post the whole thing but I'll be happy to answer questions, what are you interested in the PHP side of it or the flash side of it? Basically we use actionscript & the drawing API to allow the user to make a selection, which is some basic math. Then we send hte coordinates of the box to crop to to a PHP script which responds with the image. Flash sends it via the loadMovie() command which happens to accept jpegs as well as swf, so it requests a URL with crop paramaters in the URI, and the script reads these paramaters, performs the crop and outputs a jpeg of the cropped image
Bruno De Barros
Forum Commoner
Posts: 82
Joined: Mon May 12, 2008 8:41 am
Location: Ireland

Re: Create magnifying glass

Post by Bruno De Barros »

I think one of the possible solutions here would be with Javascript, you'd have a small picture, and a huge picture. The small picture would be the one where you'd put your mouse over. And wherever you had hovered, a small DIV next to your mouse would come up with the piece of the picture you were hovering on, but zoomed (not really zoomed, just because it was a huge picture then it would look like it was zoomed). I've seen this effect on clothing shops, and I've done something like that before. Unfortunately I haven't gotten any code with me, I'm sorry =/.
User avatar
kaisellgren
DevNet Resident
Posts: 1675
Joined: Sat Jan 07, 2006 5:52 am
Location: Lahti, Finland.

Re: Create magnifying glass

Post by kaisellgren »

Magnifying images on a HTML page dynamically (client side) for an img -element is ugly. The artifacts that result from this kind of scaling depends on the sampling mode to choose which pixels will be kept. I have no idea what sampling is used on mainstream web browsers, but IE must be using Nearest Neighbor. It's fast, but really ugly. Bilinear, on the other hand, is only slightly slower and looks OK on low contrast images.

I think your best shot is to use Flash or any similar technology.

If you do not need dynamic scaling (that is - two or three dimensions are OK), then you could use PHP to make two or three different images.

And the last option is the one described earlier. Let PHP do the job and send the result.
User avatar
jayshields
DevNet Resident
Posts: 1912
Joined: Mon Aug 22, 2005 12:11 pm
Location: Leeds/Manchester, England

Re: Create magnifying glass

Post by jayshields »

josh wrote:Check out how we did it http://marinas.com/view/marina/2901_Mac ... son_Twp_MI ( drag and draw a box )

Flash handles UI. Sends paramaters to a PHP script which uses GD library, performs the resize and sends the jpg back to flash
That's quite cool, but has 2 problems. It takes too long to load magnified images and when you draw really small boxes or zoom in too much you get a pixelated mess.
josh
DevNet Master
Posts: 4872
Joined: Wed Feb 11, 2004 3:23 pm
Location: Palm beach, Florida

Re: Create magnifying glass

Post by josh »

The former is subjective, the latter we are aware of ;-)
Post Reply