修复d3-Cola JS中节点的位置

时间:2015-11-18 08:03:52

标签: javascript html d3.js nvd3.js

enter image description here

我是Cola JS的新手。我有一些节点指向中心节点(上游),一些节点指向中心节点(节点)。

附件是布局的屏幕截图。

我希望修复中心节点上方的上游节点和中心节点下方的下游节点。

var lineFunction = d3.svg.line()
                .x(function (d) { return d.x; })
                .y(function (d) { return d.y; })
                .interpolate("linear");

            d3cola.start(10, 30, 100).on("tick", function () {
                node.each(function (d) { d.innerBounds = d.bounds.inflate(-margin); })
                    .attr("x", function (d) { return d.innerBounds.x; })
                    .attr("y", function (d) { return d.innerBounds.y; })
                    .attr("width", function (d) { return d.innerBounds.width(); })
                    .attr("height", function (d) { return d.innerBounds.height(); });

                link.attr("d", function (d) {
                    var route = cola.vpsc.makeEdgeBetween(d.source.innerBounds, d.target.innerBounds, 5);
                    return lineFunction([route.sourceIntersection, route.arrowStart]);
                });
                if (isIE()) link.each(function (d) { this.parentNode.insertBefore(this, this) });

                label
                    .attr("x", function (d) { return d.x })
                    .attr("y", function (d) { return d.y + (margin + pad) / 2 });

            });

以下是json数据

{
"edges": [
    { "source": "Relative Measurement", "target": "Pride", "type": "likes" },
    { "source": "Relative Measurement", "target": "Efficiency", "type": "likes" },
    { "source": "Relative Measurement", "target": "Business", "type": "likes" },
    { "source": "Relative Measurement", "target": "Certainty", "type": "likes" },
    { "source": "Relative Measurement", "target": "Business", "type": "likes" },
    { "source": "Relative Measurement", "target": "Business", "type": "likes" },
    { "source": "Relative Measurement", "target": "Computing", "type": "likes" },
    { "source": "Relative Measurement", "target": "Diversity", "type": "likes" },
    { "source": "Relative Measurement", "target": "Judgement", "type": "likes" },
    { "source": "Relative Measurement", "target": "Efficiency", "type": "likes" },
    { "source": "Relative Measurement", "target": "Judgement", "type": "likes" },
    { "source": "Relative Measurement", "target": "Business", "type": "likes" },
    { "source": "Relative Measurement", "target": "Certainty", "type": "dislikes" },
    { "source": "Relative Measurement", "target": "Resiliency", "type": "dislikes" },
    { "source": "Relative Measurement", "target": "Certainty", "type": "dislikes" },
    { "source": "Relative Measurement", "target": "Social", "type": "dislikes" },
    { "source": "Relative Measurement", "target": "Resiliency", "type": "dislikes" },
    { "source": "Knowing", "target": "Relative Measurement", "type": "dislikes" },
    { "source": "Structure", "target": "Relative Measurement", "type": "dislikes" },
    { "source": "Resiliancy", "target": "Relative Measurement", "type": "dislikes" },
    { "source": "Relative Measurement", "target": "Judgement", "type": "dislikes" }
]
}

提前致谢。

0 个答案:

没有答案