Search code examples
paperjs

How scale raster without image smoothing


With paperjs, how can a raster be scaled with image smoothing disabled? I need to scale pixel art.

Something akin to canvas.imageSmoothingEnabled = false (canvas) or image-rendering: pixelated (CSS).


Solution

  • In Paper.js version 0.11.8, raster.smoothing was added exactly for this purpose.
    You have to set it to false if you don't want the image to be blured when scaled up.

    var raster = new Raster({
        source: 'http://assets.paperjs.org/images/marilyn.jpg',
        smoothing: false
    });
    
    raster.position = view.center;
    raster.scale(10);