When using canvas to display pictures, the edges of pictures are blurred

[zhaogang96]

When using canvas to display pictures, the edges of pictures are blurred
It looks like this

There is my code

  Crafty.init(SCREEN_WIDTH, SCREEN_HEIGHT, document.querySelector("#game"));

  Crafty.sprite(621, 621, "img/wheel.png", {
    wheel: [0, 0]
  });

  // use canvas
  Crafty.e("2D, Canvas, wheel").attr({
    x: 0,
    y: 0,
    w: 100,
    h: 100
  });

  // use dom
  Crafty.e("2D, DOM, wheel").attr({
    x: 101,
    y: 101,
    h: 100,
    w: 100
  });
  Crafty.background("rgb(0,0,0)");

Is there any solution?

[rBok6]

Check this, I hope that helps:

http://craftyjs.com/api/Crafty-pixelart.html