javascript - 在 Graphiti 中,如何将编辑器放在附加到图形的标签上

标签 javascript

我试图创建一个可编辑标签,如示例connection_labeledit_inplace 中的标签。

我遇到的问题是我想将标签附加到自定义 VectorFigure 以代替连接。执行此操作时,标签只是图形的一部分,并且不要启动编辑器。

ivr.shape.menu.MenuItem = graphiti.VectorFigure.extend({

NAME:"ivr.shape.menu.MenuItem",

MyOutputPortLocator : graphiti.layout.locator.Locator.extend({
    init: function(parent)
    {
        this._super(parent);
    },
    relocate:function(index, figure){
        var w = figure.getParent().getWidth();
        var h = figure.getParent().getHeight();

        figure.setPosition(w, h/2);
    }
}),

/**
 * @constructor
 * Creates a new figure element which are not assigned to any canvas.
 *
 */
init: function( width, height) {
    this._super();
    this.setBackgroundColor( new graphiti.util.Color(200,200,200));
    this.setColor(new graphiti.util.Color(50,50,50));

    // set some good defaults
    //
    if(typeof width === "undefined"){
        this.setDimension(100, 15);
    }
    else{
        this.setDimension(width, height);
    }

    // add port
    var outputLocator = new this.MyOutputPortLocator(this);
    this.createPort("output",outputLocator);

    this.label = new graphiti.shape.basic.Label("I'm a Label");
    this.label.setColor("#0d0d0d");
    this.label.setFontColor("#0d0d0d");
    this.addFigure(this.label, new graphiti.layout.locator.LeftLocator(this));

    this.label.installEditor(new graphiti.ui.LabelInplaceEditor());
},


repaint : function(attributes)
{
    if(this.repaintBlocked===true || this.shape===null){
        return;
    }

    if (typeof attributes === "undefined") {
        attributes = {};
    }

    var box = this.getBoundingBox();
    var center = box.getCenter();
    var path = ["M",box.x,",",box.y];
    path.push("l", box.w-10, ",0");
    path.push("l10,", box.h/2);
    path.push("l-10,", box.h/2);
    path.push("L",box.x,",", box.getBottomLeft().y);
    path.push("Z");
    var strPath = path.join("");
    attributes.path = strPath;

    this._super(attributes);
},


/**
 * @method
 * Called by the framework. Don't call them manually.
 *
 * @private
 **/
createShapeElement:function()
{
    // create dummy line
    return this.canvas.paper.path("M0 0L1 1");
}

});

在这个例子中,我将标签放在图的左侧,但显然我将制作一个定位器,将标签放在图上(以防万一它改变了某些内容)

对我来说,问题来自于“graphiti.Canvas.getBestFigure()”的工作方式。该函数仅检查直接附加到“graphity.Canvas”的元素。此外,该函数缺少一些递归来在子级上传播事件。

最佳答案

Graphiti 提供了一个 CenterLocator。 像 dblClick 这样的所有事件都可以被图形捕获。

...您使用的是最新版本吗?

关于javascript - 在 Graphiti 中,如何将编辑器放在附加到图形的标签上,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11494297/

相关文章:

javascript - 使用 jQuery 在悬停时创建边框?

javascript - 为什么 jquery 和 if 语句不能一起工作?

php - 这类问题的解决方案是什么?

javascript - java中的加载效果

javascript - 使用正则表达式仅通过 h1 标签拆分带有 html 的字符串

javascript - Tampermonkey 脚本仅在第一个新节点上工作

javascript - 使用 Phaser 在世界中随机放置平台

javascript - 当用户输入输入值时,如何使用 jquery 或 javascript 将 int 转换为 double

javascript - 调用全局变量

javascript - 如何使用否定前瞻(NOT lookbehind)来匹配在特定位置不包含给定子字符串的字符串?