This node resizes an image to a user-selected width and height in pixels. If the keep aspect input is set to true, an output image with the same aspect ratio as the input image is created that fits within the selected width and height.

The filter input slot selects which resampling filter is used:

  • Filter = 0: Triangle (default)
  • Filter = 1: Box
  • Filter = 2: Cubic
  • Filter = 3: Lanczos3
  • Filter = 4: Mipmap (fast)
  • Filter = 4: Linear (fast)
  • Filter = 4: Nearest (fast)

The selection of the resampling filter can change the result quite significantly. To make an informed choice, the following text gives some basic information on how image resizing works.

During image resizing the task is to transfer sample information from the sampling grid of the input image to the grid of the output image. When upsampling, one can think of this process as if first an analog continuous signal is reconstructed from the digital values and the signal is then re-sampled with the new finer raster. To generate the analog function, an analog lowpass reconstruction filter is applied and different reconstruction filters lead to different results.

When downsampling, an additional problem arises because the reconstructed continuous signal may contain high frequencies that cannot be captured by the coarser raster (see Nyquist–Shannon sampling theorem). Therefore, a (stronger) low-pass filter needs to be applied to avoid aliasing (also known as "Jaggies"). Consequently, though the same type of low-pass filter can be used for upsampling and downsampling, its cut-off frequency must be always adapted to the coarser sampling grid: for upsamping, this is the input raster; for downsamping, this is the output raster. This is illustrated in the figure below. Though an image has a 2D raster, we are discussing only the 1D case in the following because x- and y-directions can be handled successively (e.g. first resize in x-direction, then in in y-direction).


In theory, an ideal low-pass filter is created by a convolution with a normalized sinc function:

$\mbox{sinc}(x) = \frac{\sin(\pi x)}{\pi x}$

However, a sinc function has an infinite support window, which means that all pixel of the input image must be weighted together to generate a single pixel of the output image. This would be best, but extremely slow.


Because an ideal low-pass is impractically slow, different approaches exist to reduce the support window of the sinc function. A popular choice is the Lanczos window because it generates a good compromising between blurring and ringing. The GSN Composer uses a Lanczos window that covers 3 lobes. The exact filtering function is

$f(x) = \begin{cases} 1.0 &\,\,:\,\, & x = 0.0 \\ \frac{a\sin(\pi x) \sin(\frac{\pi}{a} x)}{\pi^2\,x^2} &\,\,:\,\, &|x| < a \quad \mbox{and} \quad x \ne 0.0 \\ 0.0 &\,\,:\,\, & |x| > a \\ \end{cases}$
with $a=3.0$. A window size of 3 lobes means that the Lanczos window covers three pixel to each side in the input image when upsampling. However, when downsampling, the filter window is typically covering much more pixels because the window size depends on the output resolution. From all provided reconstruction filters the Lanczos3 filter is closest to an ideal low-pass, and, thus, it typically gives the best results. However, because of the comparably large filter size and the trigonometric functions in the filter function, it is also the slowest of the provided choices.


The cubic filter function that is used in the GSN Composer is given by:
$f(x) = \begin{cases} 1.5\,|x|^3 - 2.5\,|x|^2 + 1.0 &\,\,:\,\, & |x| \le 1.0 \\ -0.5\,|x|^3 + 2.5\,|x|^2 - 4.0 \,|x| + 2.0 &\,\,:\,\, & 1.0 < |x| < 2.0 \\ 0.0 &\,\,:\,\, & |x| \ge 2.0 \\ \end{cases}$

This cubic function closely approximates a windowed sinc function with 2 lobes. Compared to Lanczos3, this means that two pixels instead three input pixels are evaluated when upsampling. Furthermore, no trigonometric functions needs to be evaluated, which further reduces the computational effort. If you need a good quality result, and speed is important, this filtering function should be a good choice.


The triangle filter function is given by:
$f(x) = \begin{cases} 1.0 - |x| &\,\,:\,\, & |x| < 1.0 \\ 0.0 &\,\,:\,\, & |x| \ge 1.0 \\ \end{cases}$

It has a support window of 1.0 and is therefore much faster than the Cubic or Lanczos3 option. For upsampling, the result is the same as the linear interpolation between the two neighboring pixels in x- and y-direction. For downsampling, the triangle filter can span much more than two pixels, which is the main difference to the Linear option (see below). The triangle filter is not a very good low-pass. Its frequency response has a very flat roll-off and therefore the downsampling results will look a bit less sharp compared to the Cubic of Lanczos3 filter. An advantage is the that the filter does not introduce any ringing.


The box filter function is given by:
$f(x) = \begin{cases} 1.0 &\,\,:\,\, & |x| < 0.5 \\ 0.0 &\,\,:\,\, & |x| \ge 0.0 \\ \end{cases}$

It has a support window of 0.5 and is therefore again faster than that Triangle, Cubic, or Lanczos3 option. As can be seen in the figure above, the box filter averages together all the image values that fall within the pixel footprint when downscaling. This is why this type of filter function is often reverted to as "area" filter in other image processing applications. When upscaling, there will be always only a single input pixel in the support window. Thus, the result is the same as nearest neighbor interpolation. The box filter is not a very good low-pass. Its frequency response has a bad stop-band characteristic and aliasing is likely to occur when downsampling. This is not in every case a negative property because a bit of aliasing can increase the perceived sharpness. Nevertheless, its speed is probably the best argument for this filter.

Mipmap, Linear, Nearest (fast)

The mipmap, linear, and nearest option delegate the task of image resizing to the WebGL implementation, which means that these operations are typically directly supported by the graphics hardware and are the fastest of all options.

The "Nearest" option performs nearest neighbor interpolation by simply copying the pixel values from the closest input pixel location. This is a good option when upscaling pixel art because no smoothing is introduced. When upscaling, the results are the same as for the box filter. When downscaling by more than 50%, very strong aliasing will occur and the box filter is the better choice.

The "Linear" option refers to bilinear interpolation using the two closest pixels in x- and y-direction. When upscaling, the results are the same as for the triangle filter. When downscaling by more than 50%, very strong aliasing will occur and the triangle filter is the better choice.

The "Mipmap" option is the only approach directly supported by the WebGL implementation that allows downscaling by more than 50%. This is achieved by building a resolution pyramid of the input image where every pyramid level is computed by downscaling the above level by a factor of two. To this end, most OpenGL implementations are using a simple box filter that averages two pixels in x- and y-direction, respectively, as recommended by OpenGL. Then the output pixel value is determined by a lookup in the pyramid level with the correct resolution to cover the output pixel's area in the input image. Unfortunately, WebGL currently supports mipmaps only for input images with a width and height that is a power of 2 (e.g., 256, 512, 1024, etc.). Otherwise, nearest neighbor interpolation is executed. If the target resolution is also a power of 2 and the aspect is remained, the results are acceptable. Otherwise, the results are often overly smooth.