如果将路径添加到drawComponent且它们重叠,则路径将按添加顺序堆叠。我可以向每个精灵添加事件侦听器,以便在鼠标悬停时可以更改颜色和笔触宽度,但是如何将重叠的路径置于最前面呢?

这是一组更改颜色的侦听器:

listeners: {
    mouseover: function(line) {
        line.setAttributes({ stroke: "red", "stroke-width": 8}, true );
    },
    mouseout: function(line) {
        line.setAttributes({ stroke: "black", "stroke-width": 4 }, true );
    }
}

最佳答案

好的,以下方法可行,但我必须相信有更好的方法。您可以将某些东西移到前面,方法是先将其删除再添加回去。但是,将其删除会删除mouse *侦听器,因此我不得不将侦听器上移一个缺口,就像这样(这在具有drawComponent属性的组件内部(此时为“me”))。

var pathout = function(line,target,opts) {
    line.setAttributes({ stroke: "blue", "stroke-width": 2 }, true );
    line.on('mouseover',pathover, this,opts);
};
var pathover = function(line,target,opts) {
    me.drawComponent.surface.remove(line,true);
    me.drawComponent.surface.add( line ).show(true);
    line.setAttributes({ stroke: "red", "stroke-width": 4}, true );
    line.on('mouseout',pathout,this,opts);

};
this.paths[pathName] = {
    type: "path",
    path: "M" + path.join(" L"),
    stroke: next_color,
    "stroke-width": 2,
    listeners: {
        mouseover: pathover,
        mouseout: pathout,
        scope: this
    }
};

关于extjs - 如何在鼠标悬停时将Extjs 4绘图组件 Sprite 带到顶部?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/15172274/

10-13 01:07