Question

我尝试通过获取鼠标位置来单独拖动节点，因为它似乎被整个图形抓取行为所捕获。正确修改了所选节点的属性，但其他节点一起移动，即使我设置了n.x和n.y。

这是我的尝试： http://jsfiddle.net/blt909/yhk3b/

jQuery(document).ready(function(){
   var sigRoot = document.getElementById('sig');
   var sigInst = sigma.init(sigRoot).position(0, 0, 1);
   var mousePos = {};
   $(document).mousemove(function(e){
       var $div = $("#sig");
       mousePos = {
           x: e.pageX,
           y: e.pageY
       };
   });   

    function onNodeDown(evt) {
        var sigmajs = evt.target;
        var nodeId = evt.content[0];
        sigmajs.iterNodes(function(n){
            n.size = 5;
            n.color = "#0000FF";
            n.displayX = mousePos.x;
            n.displayY = mousePos.y;
            console.log(n);
       },[nodeId]);    

       sigmajs.draw(2,2,2, false);

       sigmajs.refresh();
    };

    sigInst.graphProperties({
        minNodeSize: 2,
        maxNodeSize: 5
    });

    sigInst.addNode('000',{
        label: '000',
        color: '#000000',
          x: Math.random() * 100,
          y: Math.random() * 100
    }).addNode('111',{
        label: '111',
        color: '#111111',
          x: Math.random() * 100,
          y: Math.random() * 100
    }).addNode('222',{
        label: '222',
        color: '#222222',
          x: Math.random() * 100,
          y: Math.random() * 100
    }).addEdge('111222','111','222')
      .addEdge('111000','111','000');

      sigInst.bind('downnodes',onNodeDown);

      sigInst.draw();
  })

有没有人在sigma.js上尝试过相同的技巧？

感谢您的帮助

Answer 1

新的sigma.js有一个dragNodes插件sigma.plugins.dragNodes.js，但它只适用于canvas，只需包含插件文件并传递sigma对象：

<script src="./plugins/sigma.plugins.dragNodes/sigma.plugins.dragNodes.js"></script>

let dragListener = sigma.plugins.dragNodes(sigInst, sigInst.renderers[0])

sigma.js：有没有办法单独拖动一个节点

1 个答案: