mxgraph中通过mouseMove鼠标拖动图形移动后 如何获取移动后图形的坐标 并更新图形坐标
时间: 2023-09-11 15:11:05 浏览: 235
要获取移动后图形的坐标并更新图形的位置,你可以使用 `mxGraph` 的 `mxGraphModel` 来实现。
首先,你需要为图形添加一个监听器来捕获移动事件。可以使用 `mxGraph.addListener` 方法来添加监听器。下面是一个示例代码:
```javascript
// 监听 MOVE_CELLS 事件
graph.addListener(mxEvent.MOVE_CELLS, function(sender, evt){
var cells = evt.getProperty('cells'); // 获取被移动的细胞
var dx = evt.getProperty('dx'); // 获取 X 轴的位移量
var dy = evt.getProperty('dy'); // 获取 Y 轴的位移量
// 对于每个被移动的细胞,更新位置
for(var i = 0; i < cells.length; i++){
var cell = cells[i];
var geo = graph.getModel().getGeometry(cell);
if(geo != null){
geo.x += dx;
geo.y += dy;
// 更新细胞的位置
graph.getModel().setGeometry(cell, geo);
// 刷新图形
graph.refresh(cell);
}
}
});
```
上述代码中,我们通过监听 `MOVE_CELLS` 事件来获取被移动的细胞和位移量。然后,我们可以使用 `mxGraph.getModel().getGeometry(cell)` 方法获取细胞的几何信息,并通过位移量更新细胞的位置。最后,调用 `graph.refresh(cell)` 方法来刷新图形以显示新的位置。
请注意,上述示例中的 `graph` 是一个 `mxGraph` 实例,你需要根据你的具体情况来替换该变量名。另外,还可以根据你的需求进行额外的处理,例如更新其他相关元素的位置等。
阅读全文