数据可视化 D3.js实现力导向图之一（实现按指定字段确定link的source和target）

     

  很早在找某些酒店数据库的时候就看到了某个24.5G的压缩数据库，一直未能想到能够很形象展现出关系的图表插件，直到看到某篇《利用D3.js实现大数据资料进行可视化分析》的帖子之后，为了能够很直观的展现出数据关系，也想用D3.js的力导向图来进行展现，但是发现D3的force directed graph不能按照自己指定的字段来确定link关系，网上搜了很久，都没有搜到遇到这个问题的资料，于是便只能自己动手修改源码实现需求了，阅读源码后发现只需要修改force.start = function() 中的第二个for循环

  for (i = 0; i < m; ++i) {
        o = links[i];
        if (typeof o.source == "number") o.source = nodes[o.source];
        if (typeof o.target == "number") o.target = nodes[o.target];
        ++o.source.weight;
        ++o.target.weight;
      }

把link指向的源和目标按照自己的需求指向特定的node即可（这里默认是按照node的index来确定）。

 最后经过反复提炼，最后把源码改成了通用性比较广的的方式，link中添加一个字段指定node中的某个字段作为关键字段，当link中未指定时，用node的第一个字段来作为关键字段。

直接将源码中的第二个for循环替换为以上代码即可。（本来是想把整个demo上传的，由于某种原因限制了，文件无法外传，只能把关键部分代码贴出）