DETAILS ON THE FOREGROUND

focussing in jpeg & png / focussing in canvas

Joost v@n Meeteren


Koppelpoort, Amersfoort - examples 1

JPEG - original photos

Koppelpoort, Amersfoort - JPEG - original image Amoeneburg, Germany - JPEG - original image


Koppelpoort, Amersfoort - example 2

Canvas - filtered photo with focussing

Your browser does not support the HTML5 canvas tag.


Amoeneburg, Germany - example 3

Canvas - filtered photo with focussing

Your browser does not support the HTML5 canvas tag.


Editing photos. There are two methods available to edit digital images. Photo editor programs can be used for this purpose. The results can be exported to a new image file. The second method is using HTML Canvas.

The advantages of HTML Canvas. Adding a focussing element (a circle for example) to a detail in the image can be executed with one source photo (in JPEG and PNG) by using a Canvas filter (a javascript code). Canvas nr. 1 represents a photo with a colored circle surrounding a part of the building. Number 2 contains two circles surrounding the two airplanes. But nr. 1-2 are produced by one JPEG source file.

Conclusion. Using Canvas on a website is a very good choice. You avoid placing multiple images on the server, including the original photo and the edited versions of it. And secondly, you can easily adjust the filters without compromising the quality of the original JPEG or PNG.


Compare. See also CROPPED IMAGES and BLACK & WHITE IMAGES and ROTATED IMAGES and MIRRORED IMAGES and HORIZONTALLY MIRRORED IMAGES and FILTERED IMAGES and TEXT ON IMAGES.


WebDevelopment and WebDesign 2002-2019 © Joost van Meeteren
Web Developer/Designer/Photographer
Last update Tuesday, May 21, 2019 at 09:03