Draw2d.js:通过双击将可编辑标签添加到现有连接

我想通过Draw2D创建一个流程图。我所需要的只是创建一些具有可编辑内容的框，带有可编辑标签的连接以及将图表读取/保存为JSON数组。这些东西中的大多数已经准备好了，正如你在这里看到的：

.JS：

var Element = draw2d.shape.basic.Text.extend({
    NAME: "Element",
    init: function (attr) {
        this._super(attr);
        this.installEditor(new draw2d.ui.LabelInplaceEditor());
        this.createPort("hybrid", new draw2d.layout.locator.TopLocator());
        this.createPort("hybrid", new draw2d.layout.locator.BottomLocator());
        this.createPort("hybrid", new draw2d.layout.locator.InputPortLocator());
        this.createPort("hybrid", new draw2d.layout.locator.OutputPortLocator());
    }
});
$(window).load(function () {
    var canvas =    new draw2d.Canvas("gfx_holder").installEditPolicy( new draw2d.policy.canvas.SnapToGridEditPolicy());
    var jsonDocument = $("#json").text();
    var reader = new draw2d.io.json.Reader();
    reader.unmarshal(canvas, jsonDocument);
    $("#add").click(function (e) { // Add a new rectangle
        var element = new Element({
            text:"Editable content",
            width: 200,
            radius: 3,
            bgColor: '#ffffff',
            stroke: 1,
            color: '#d7d7d7',
            padding: 7
        });
        canvas.add(element, 10, 10);
    });
    $("#save").click(function (e) { // Save flowchart
    var svg = $("#gfx_holder").html();
    var writer = new draw2d.io.json.Writer();
    writer.marshal(canvas,function(json){
        var jsonarray = JSON.stringify(json, null, 2);
        // Save jsonarray to DB
        });
    });
});

.HTML：

<button id="add">Add Element</button><button id="save">Save</button><div onselectstart="javascript:/*IE8 hack*/return false" id="gfx_holder" style="width:500px; height:500px;-webkit-tap-highlight-color: rgba(0,0,0,0);" class="ui-widget-content" ></div>
<pre id="json">[
  {
    "type": "Element",
    "id": "cd56129b-98dd-5d3d-527e-132033694c85",
    "x": 30,
    "y": 80,
    "width": 100,
    "height": 27.421875,
    "alpha": 1,
    "userData": {},
    "cssClass": "Element",
    "bgColor": "#FFFFFF",
    "color": "#D7D7D7",
    "stroke": 1,
    "radius": 3,
    "text": "First Box",
    "outlineStroke": 0,
    "outlineColor": "none",
    "fontSize": 12,
    "fontColor": "#080808",
    "fontFamily": null
  },
  {
    "type": "Element",
    "id": "2685c6bb-ce13-2af4-daa3-144839601e56",
    "x": 170,
    "y": 60,
    "width": 100,
    "height": 27.421875,
    "alpha": 1,
    "userData": {},
    "cssClass": "Element",
    "bgColor": "#FFFFFF",
    "color": "#D7D7D7",
    "stroke": 1,
    "radius": 3,
    "text": "Second Box",
    "outlineStroke": 0,
    "outlineColor": "none",
    "fontSize": 12,
    "fontColor": "#080808",
    "fontFamily": null
  },
  {
    "type": "draw2d.Connection",
    "id": "b7e92769-5d37-b859-32d4-0f41910b691b",
    "alpha": 1,
    "userData": {},
    "cssClass": "draw2d_Connection",
    "stroke": 1,
    "color": "#1B1B1B",
    "outlineStroke": 0,
    "outlineColor": "none",
    "policy": "draw2d.policy.line.LineSelectionFeedbackPolicy",
    "router": "draw2d.layout.connection.ManhattanConnectionRouter",
    "radius": 2,
    "source": {
      "node": "cd56129b-98dd-5d3d-527e-132033694c85",
      "port": "hybrid0"
    },
    "target": {
      "node": "2685c6bb-ce13-2af4-daa3-144839601e56",
      "port": "hybrid0"
    }
  }
]</pre>

JSFiddle：http://jsfiddle.net/6pbjh3s6/4/（不幸的是，它在JSFiddle上不起作用，但我不知道出了什么问题）

问题：我的问题是向任何连接添加可编辑的标签，即通过双击现有标签。

Draw2D.js API： http://draw2d.org/draw2d_touch/jsdoc_5/#!/api