jCanvas imageSmoothingEnabled not working

579 views Asked by At

So I am trying to build a game with pixel art in html using jCanvas. However, when I try to disable imageSmoothing in order to leave the pixels sharp, nothing happens.

$(function() {
    $('canvas').drawImage({
        source: 'http://i.imgur.com/Y2o59.png',
        x:400, y:250,
        width: 160, height: 160,
        imageSmoothingEnabled: false,
    });
});

Edit: Added random piece of pixel art to make it easier to test.

1

There are 1 answers

0
half-potato On

Figured it out.

First of all, its imageSmoothing: false, not imageSmoothingEnabled: false. Second, you still need to enable smoothing on the context, like this:

var ctxbgd = document.getElementById('background').getContext("2d");
    ctxbgd.imageSmoothingEnabled = false;
    ctxbgd.webkitImageSmoothingEnabled = false;
    ctxbgd.mozImageSmoothingEnabled = false;

There, no smoothing.