Now that we know how to draw images and videos, let's try accessing the image data to see what kind of properties we can play with.
Note
WARNING: This recipe must run on a web server due to security constraints with the getImageData()
method.
Before we get started working with image data, it's important that we cover canvas security and the RGBA color space.
So why is canvas security important with respect to accessing image data? Simply put, in order to access image data, we need to use the getImateData()
method of the canvas context which will throw a SECURITY_ERR
exception if we try accessing image data from an image residing on a non-web server file system, or if we try accessing image data from an image on a different domain. In other words, if you're going to try out these demos for yourself, they won't work if your files reside on your local file system. You'll need to run the rest of the recipes in this chapter on a web server.
Next, since pixel manipulation...