在Fabric.js中控制z-index

在fabricjs中,我想创建一个场景,鼠标中的对象在z-index中上升到场景的顶部,然后一旦鼠标离开该对象,它将返回到z-index.一个不能设置object.zindex(这将是不错的).相反,我正在使用一个放置在旧位置的对象列表中的占位符对象,然后使用canvas.insertAt将旧对象放回到列表中的位置.但是这不行.

见http://jsfiddle.net/rFSEV/的状态.

var canvasS = new fabric.Canvas('canvasS',{ renderOnAddition: false,hovercursor: 'pointer',SELEction: false });
var bars = {}; //storage for bars (bar number indexed by group object)
var SELEctedBar = null; //SELEcted bar (group object)
var placeholder = new fabric.Text("XXXXX",{ fontSize: 12 });

//pass null or a bar
function SELEctBar(bar) {
    if (SELEctedBar) {
        //remove the old topmost bar and put it BACk in the right zindex
        //PROBLEM: It doesn't go BACk; it stays at the same zindex
        SELEctedBar.remove();
        canvass.insertAt(SELEctedBar,SELEctedBar.XZIndex,truE);
        SELEctedBar = null;
        }
    if (bar) {
        //put a placeholder object ("XXX" for now) in the position
        //where the bar was,and put the bar in the top position
        //so it shows topmost
        SELEctedBar = bar;
        canvass.insertAt(placeholder,truE);
        canvass.add(bar);
        canvass.renderAll();
        }
    }

canvass.on({
     'mouse:move': function(E) {
        //hook up dynamic zorder
        if (!e.target) return;
        if (bars[e.target])
            SELEctBar(e.target);
        else
            SELEctBar(null);
        },});

var objcount = canvass.getObjects().length;

//create bars
for (var i = 0; i < 20; ++i) {
    var rect = new fabric.Rect({
      left: 0,top: 0,rx: 3,ry: 3,stroke: 'red',width: 200,height: 25
    });
    rect.setGradientFill({
      x1: 0,y1: 0,x2: 0,y2: rect.height,colorStops: {
        0: '#080',1: '#fff'
      }
    });    
    var text = new fabric.Text("Bar number " + (i+1),{
        fontSize: 12
    });
    var group = new fabric.Group([ rect,text ],{
      left: i + 101,top: i * 4 + 26
    });
    group.hasControls = group.hasBorders = false;

    //our properties (not part of fabriC)
    group.XBar = rect;
    group.XZIndex = objcount++;

    canvass.add(group);
    bars[group] = i;
    }
canvass.renderAll();

canvas.moveTo(object,indeX);
object.moveTo(indeX);