填空和连线问题代码如何写呢？

把这个图片实现，不仅方框里可以填写数字，还要实现连线，不要是简单的用图片表示，当方框增加或者位置变化时，连线位置也会变化，如何不把代码写死，每个图片都会有不同位置的填空框和连线的意思。

使用样式，取得两个框的中心坐标，计算距离，追加一个div，设置高度为距离高度，设置该div中心位置为两个框中间位置，用 transform rorate旋转，旋转角度为两个框之间的角度，这个需要js支持

我是小白，正在学习中，还请各位大神指教。

canvas

用echarts 做，可以实现随意拖动，连线改变。