用D3.js进行图谱展示时连接线长度随节点大小动态变化的实现方式

问题起源： 用d3.js实现前端知识图谱的展示，开始跟着视频做了一个基本功能，但是节点的大小不能调整，于是做了一个大小调整的功能，即选中一个标签，然后再选择大小，从而实现让节点根据类型的不同来变化，然后自己就尝试做了一下，基本实现了选择大小的功能，但是新的问题随之而来，发现节点变大之后连接线很短，节点变小之后，连接线上的箭头又距离节点很远，原因在于原来节点间的连线是根据节点的圆心来连接的，箭头的位置是按照一个固定的半径大小进行偏移的，然后现在的节点的半径是用户可以随意调节的大小，所以设置一个固定的偏移量自然不能随着节点半径的变化而变化了。

知道了问题所在，就来解决问题，开始一个直观的思路是，让箭头的偏移量可以跟随半径的大小而变化，因为节点的半径的改变就是用的这个思路，获取到所有节点，然后遍历每一个，判断这个节点的类型是否有对应的用户自定义量，如果有的话就用用户自定义的，没有就用默认的。但是问题是，箭头的实现方式和节点的实现方式不同，节点的实现方式是每个节点是一个独立的个体，然后用<g>包着可以遍历每一个，但是箭头是用了两个<marker>就像模具，每个路径引用这个模具，每个模具都是一模一样的。所以没有办法遍历每一个箭头，而且箭头偏移量和节点的类型之间也没有关联，即使能够遍历也无法根据节点类型来动态调节偏移量。

后来在neo4j browser的前端代码中找到了灵感，它在实现边连线的时候，是用path在目