No se puede agregar capa a lienzo usando jcanvas

Question

Estoy usando jcanvas para pintar en un HTML canvas elemento. Primero inicializo la tabla Ax * X, con cada celda sosteniendo un lienzo:

function init(size) {
            // Adding the board table to the body
            $("#content").append("<table class=\"board\">");

            for(i=0; i<size; i++) {
                $(".board").append("<tr>")
                for(j=0; j<size ; j++) {
                    $(".board tr:last-child").append("<td class=\"square\">");
                }
            }
            // Setting size to match width or height, whichever i smallest
            var h = $("#content").height();
            var w = $("#content").width();
            var rez = (w > h) ? h : w;
            var cSize = rez / size;
            $(".board td").append("<canvas width="+cSize+" height="+cSize+" />");
            $(".board").css("width",rez);
            $(".board").css("height",rez);

            // Drawing icons on the board
            var c = $("canvas");
            var icns = new Array(11);
            for(i=0; i<11; i++)
                icns[i] = "svg/"+ params["hvor"] +"/"+ (i+1) +".svg";

            for(i=0; i<c.length; i++) {
                var rand = Math.floor(Math.random()*(icns.length-1));
                var icn = icns[rand];
                icns.splice($.inArray(icns[rand], icns), 1);
                $(c[i]).drawImage({
                    source: icn,
                    height: cSize,
                    fromCenter: false
                });
            }
        }

Esto funciona bien y las imágenes se dibujan en el lienzo. Luego trato de agregar una capa con una nueva forma (debe eliminarse más tarde, por eso estoy usando una capa).

$('td').click(function(){
    var h = $(this).height() -2;
var o = h / 3.5;
var t = h / 10;

$(this).children("canvas").addLayer({
    method: "drawLine",
    strokeStyle: "#5cfe15",
    strokeWidth: t,
    x1: o, y1: o*2,
    x2: h/2, y2: h-o,
    x3: o*3, y3: o-t
});
});

Ahí es cuando recibo el error Uncaught TypeError: Object [object Object] has no method 'addLayer'. Si solo uso drawLine() en vez de addLayer() En realidad, dibuja la línea, por lo que el objeto es claramente un lienzo.

¿Que me estoy perdiendo aqui?

Answer 1

Asegúrese de usar JCanvas v5.0, ya que introdujo el método addLayer () para las colecciones jQuery (es decir, $ .fn).

-Caleb