添加加入节点D3.js的路径

时间:2013-12-05 17:59:14

标签: javascript jquery d3.js

我试图在鼠标向下和鼠标向上两个节点之间添加路径我得到两个节点但是当我尝试添加链接(路径)时我无法绘制它

  var addPath = function(){
        var obj = {};
        obj.source = source;
        obj.target = target;

        NodePanData.connections.push(obj);
        source = undefined;
        target = undefined;
    }

 var inputs = gStates.selectAll('.extraCircle')
            .data(function(d){
            if(d.inputList){
                var r = radius+15;
                var a = getStartingPoint(d.inputList.length,true);
                for(t in d.inputList){
                    d.inputList[t].x = r*Math.sin(a);
                    d.inputList[t].y = r*Math.cos(a);
                    a = a + 0.45;
                }
                return d.inputList;
            }
            return [];
        }).enter()
            .append("g")
            .attr({
                "transform": function (d) {
                    return "translate(" + [d.x, d.y] + ")";
                },
                'class': 'extraCircle'
            }).on("mousedown", function (d) {
                isLinkDraw =true;
                target = d;
                console.log("mousedoun"+ d.id)
            }) .on("mouseup", function (d) {
                    isLinkDraw =false;
                    target = d;
                    addPath();

                    console.log("mouseUp"+ d.id);
                });




    var output = gStates.selectAll('.outPuts')
        .data(function(d){
            if(d.outputList){
                var r = radius+15;
                var a = getStartingPoint(d.outputList.length,false);
                for(t in d.outputList){
                    d.outputList[t].x = r*Math.sin(a);
                    d.outputList[t].y = r*Math.cos(a);
                    a = a + 0.45;
                }
                return d.outputList;
            }
            return [];
        }).enter()
        .append("g")
        .attr({
            "transform": function (d) {
                return "translate(" + [d.x, d.y] + ")";
            },
            'class': 'outPuts'
        }).on("mousedown", function (d) {
            isLinkDraw =true;
            source = d;
            console.log("mousedoun")
        }) .on("mouseup", function (d) {
            isLinkDraw =false;
            source = d;
            addPath();
            console.log("mouseUp")
        });

这是我的fiddle

0 个答案:

没有答案