javascript - jCanvas - setPixels()

Question

1 つのことを除いて、すべてが jCanvas でうまく機能します。setPixels () を動作させることができません。Chrome と Safari でコードを実行しても、何も起こりません。

サンプル コードを jCanvas Web サイトのサンドボックスからコピーしました (ここでは、ブラウザーを見るとすべてが機能します)。

私が間違っていたかもしれないことについて誰か提案がありますか?

<canvas id="canvas" width="520" height="520"></canvas>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.3/jquery.min.js"></script>
<script src="http://projects.calebevans.me/jcanvas/resources/jcanvas/jcanvas.js"></script>

<script type="text/javascript">

function invert() {
  $(this).setPixels({
    x: 150, y: 100,
    width: 220, height: 138,
    // loop through each pixel
    each: function(px) {
      px.r = 255 - px.r;
      px.g = 255 - px.g;
      px.b = 255 - px.b;
    }
  });
}

$('canvas').drawImage({
  source: 'images/fish.jpg',
  x: 150, y: 100,
  // Invert image color when image loads
  load: invert
});

</script>