在鼠标光标的位置添加cytoscape节点 [英] Adding cytoscape node at the location of mouse cursor

问题描述

我想在画布上的单击事件上在鼠标箭头的位置添加一个cytoscape节点。

I want to add a cytoscape node at the location of mouse arrow, on a click event on the canvas.

我该怎么做？

我的方法 ：（效果不佳）

我能够在单击，但是我无法确保创建的节点的位置在我单击的位置。
使用类似这样的东西：

I am able to create a node on a click but I am not able to make sure the position of the created node is at the place where I have clicked. Using something like this:

$("#cy").click(function(event){

    pos = getMousePosition(this, event)

    cy.add([
      { group: "nodes", data: { id: "testid" }, position: pos },
    ]);
});

我无法定义 getMousePosition（）正确。我该如何定义此函数以使节点呈现在正确的位置，而与细胞景观画布的位置无关？

I have not been able to define getMousePosition() correctly. How should I define this function to get the node rendered at the right position irrespective of the location of the cytoscape canvas?

推荐答案

鼠标可以在屏幕上使用渲染的坐标。如果要在特定的渲染位置添加节点，最简单的方法是在渲染的坐标中指定新节点的位置，例如：

The mouse works with rendered coordinates on the screen. If you would like to add a node at a specific rendered position, it would be easiest to specify the new node position in rendered coordinates, e.g.:

cy.add([
  { group: "nodes", data: { id: "testid" }, renderedPosition: rpos } // , ...
]);

然后传递呈现的鼠标位置（相对于cy.js div）变得微不足道了。 http://api.jquery.com/position/

It then becomes trivial to pass the rendered mouse position (relative to the cy.js div), e.g. http://api.jquery.com/position/

这篇关于在鼠标光标的位置添加cytoscape节点的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！