如何在draw2d的特定位置添加图形？答案

【问题标题】：How to add figure at particular location in draw2d?如何在draw2d的特定位置添加图形？
【发布时间】：2012-07-14 08:21:28
【问题描述】：

我想在连接的开始或结束位置添加标签。但是在这里我没有找到除ManhattanMidpointLocator之外的定位器。那么我该怎么做呢？如何在连接的位置放置标签？
请在下面找到我的代码，

draw2d.LabelConnection = function() {
  draw2d.Connection.call(this);
  this.sourcePort = null;
  this.targetPort = null;
  this.lineSegments = [];
  this.setColor(new draw2d.Color(0, 255, 0));
  this.setLineWidth(2);

  var label = new draw2d.Label("Message");
  label.setBackgroundColor(new draw2d.Color(230, 230, 250));
  label.setBorder(new draw2d.LineBorder(1));
  this.addFigure(label, new draw2d.Locator());
};

draw2d.LabelConnection.prototype = new draw2d.Connection();
draw2d.LabelConnection.prototype.type = "draw2d.LabelConnection";

上面的代码在 (0,0) 位置显示标签。请帮帮我。

【问题讨论】：

标签： javascript draw2d-js

【解决方案1】：

用途：

Connection.getStartPoint() 来确定连接的起点检索连接的所有段。

问候

【讨论】：

我使用了 Connection.getStartPoint() 方法，它给了我错误 locator.relocate() is not a function。请帮帮我。我尝试实现 relocate() 方法，但它似乎不起作用。

【解决方案2】：

我不确定您所说的“任何位置”是什么意思，但如果您实现自己的定位器，那就很简单了。

查看ManhattanMidpointLocator 的代码。在重定位功能中，您了解画布上连接的所有信息。从中你只需发明一个标签位置的计算。

【讨论】：

我想将此标签定位在起始位置而不是中间位置。那么我该怎么做呢？我使用了 Locator() 但它将它定位在 (0,0) 位置。请帮忙？

【解决方案3】：

现在使用 Graphiti 代替 Draw2D，但定位器的代码应如下所示（未经测试）：

draw2d.StartConnectionLocator=function(/*:draw2d.Connection*/ connection)
{
  draw2d.ConnectionLocator.call(this,connection);
};
draw2d.StartConnectionLocator.prototype.relocate=function(/*:draw2d.Figure*/ target)
{
   var conn = this.getConnection();

   var points = conn.getPoints();
   var index = Math.floor((points.getSize() -2) / 2);
   if (points.getSize() <= index+1)
      return; 

   var startPoint = points.get(0);
   var myPosition = new draw2d.Point();
   myPosition.x = startPoint.x +5;
   myPosition.y = startPoint.y +5;

   target.setPosition(myPosition.x,myPosition.y);
};

【讨论】：

正如 Andreas 建议的那样，您可以使用 connection.getStartPoint() 代替 var startPoint = points.get(0);
我使用了 connection.getStartPoint() 但它给了我错误 locator.relocate() is not a function。所以请帮我看看我应该如何调用重定位方法。在下面找到我的代码 draw2d.ContextmenuConnection = function(src, target) { draw2d.Connection.call(this); this.sourceAnchor.setOwner(src); this.targetAnchor.setOwner(目标); var label = new draw2d.Label("Message"); this.addFigure(label, this.getStartPoint()); var arrowConnector = new draw2d.ArrowConnectionDecorator(); arrowConnector.setBackgroundColor(new draw2d.Color(0, 255, 0)); };