如何将常规画布功能与KineticJS混合使用？

Question

在某些部分，我只想绘制一个图像或矩形而不需要创建复杂对象的开销。

我试试

var stage = new Kinetic.Stage({
    container: 'container',
    width: 400, 
    height: 400});
var layer = new Kinetic.Layer();
var ctx;
layer.add(new Kinetic.Shape({x:0,y:0,drawFunc:function(context){ctx=context;}}));
stage.add(layer);
ctx.fillStyle = "#FF0000";
ctx.fillRect(0,0,100,100);

但我得到TypeError：ctx.fillRect不是函数

这是小提琴http://jsfiddle.net/qHVsu/

Answer 1

您可以从图层中获取基础上下文：

var ctx = layer.canvas.context._context;
ctx.fillStyle = "#FF0000";
ctx.fillRect(0,0,100,100);

JSFiddle