Geek Answers Handbook

Create / Modify Images in JavaScript

Is it possible to dynamically create and edit images at a pixel from JavaScript (client-side)? Or should it be done using a system language, such as PHP?

My use case is as follows:

  • A user opens a web page and loads a locally stored image.
  • A preview image is displayed.
  • The user can change the image using a set of sliders (operations at the pixel level).
  • In the end, he can upload the image to his local hard drive.

When searching the Internet, I just found messages about using the IE filtering method, but I didn't find anything about image editing features in JavaScript.

+5
source share
7 answers

This needs to be done on the server side. One thing you can look at is to allow all editing on the client side, and then at the end, POST the final image (via AJAX) on the server so that it can return it to you as the correct MIME type and is properly packaged.

+1
source

Some browsers support the canvas: http://developer.mozilla.org/En/Drawing_Graphics_with_Canvas

+8
source

Processing.js. jQuery . , , Firefox 3 .

+2

URI ( IE 8 , !)

+1

JS, , , . JS .

0

Try Reticetter to view Allicorn images - it looks like what you are looking for.

0
source

Local manipulation of images in JavaScript should be possible - see Favicon Defender . ;-) The question is how to get the original image from the file system to your page (I don’t know of any other way than uploading the HTTP to the server first).

0
source

More articles:


All Articles