Nibcode Solutions Blog

Every Wednesday Nibcode Solutions will bring you a new Linear Algebra problem, which answer will be published on Tuesdays following week. Problems will cover the most important Linear Algebra topics, ranging from simple problems to some a little more complex, but all of them aimed to provide examples for you to understand the primary concepts and problem solving methods of Linear Algebra.

This problem of the week involves multiplication of matrices, which is considered the most important matrix operation, and although is not quite as straightforward as addition, the method is not difficult to grasp.

In this post, the last one of the series, we'll show an implementation in JavaScript of all the theory we have seen in the previous three posts. We also explain how you can use the HMTL5 canvas object to make your own implementation of the concepts of image processing.

The JavaScript image editor presented in the post, allows you to apply filters and make transformations to any image you choose. Besides, when moving the mouse cursor over the image, you can see, under the image, the 5x5 matrix of pixels surrounding the pixel at the cursor position.

In digital image processing, there is a group of transformations which receive the coordinates of a pixel as input, and return the new coordinates where the pixel should be placed; so that, when computing these transformations for all the pixels of an image, a new image is obtained.

Here, we are going to focus on one kind of these transformations, the affine transformations, which preserve collinearity (points and straight lines, planes, etc.). Affine transformations map points into new points by applying a linear combination of translation, rotation, scaling and skewing operations.

In the previous post we explained how an image can be represented as a matrix of pixels, where each pixel is expressed as a three-dimensional vector, composed by the amount of red, green and blue of the color. In this post, we are going to give some examples about the use of linear algebra in the digital image processing.

One kind of image processing are the filters. Among the most used there are: adjustment of brightness, contrast and colors, grayscale conversion, color inversion (negative), gamma correction, blur and noise reduction.

When most of us think about Linear Algebra, the first idea that comes out from our mind is a system of linear equations that needs to be solved, or its graphical variant, a Cartesian plane with two lines, in order to solve the problem of finding the intersection point; but what probably most of people don't know is that tools like Photoshop or libraries like OpenGL or DirectX make an extensive use of linear algebra for most of their functionalities.

It this series of posts we will discuss some basic concepts of the application of Linear Algebra in Image Processing. In the first post we will focus on its applications and how an image can be represented as a matrix, in the second and third one we will explore matrix operations on an image, and in the last one we will show some practical examples in JavaScript.