从零开始画自己的DAG作业依赖图(二)--分层布局算法

概述

当我们把设计稿和技术选型定下来之后，接下来就要开始着手画这个依赖图了。依赖图的组成最简单的就是节点Node 和节点之间的连线。这一节我们要处理的就是节点位置信息的处理。为了确定节点的位置信息，首先要给节点分层，分层的信息取决于节点之间的依赖关系。

问题分析

当前我们默认图是从上到下布局方式，节点分层，最容易想到的就是拓扑排序，通过BFS 宽度优先遍历，计算每个节点的步长。

自顶向下BFS

如上图，我们如果是普通的BFS，我们会发现D 节点应该是第二层，实际上D应该是第三层，所以，实际上每个节点应该取最大的步长，实现如下

function calcLayer(nodes){
    var queue = [];
    var maxLayer = 1;
    var nodesT =  nodes;
        //  入度为0 的点放入队列
    for (var i = 0; i < nodesT.length; i++) {
        if (nodesT[i].inputNode.length === 0) {
            nodesT[i].layer = 1;
            queue.push(nodesT[i]);
        }
    }
    while(queue.length > 0){
        var tNode = queue.shift();
        if (tNode.outputNode