如何用js绘制一个类似力导向图的图形？

Question

1.设计师设计了下面一个很像力导向图的图形，让在页面上实现，图中的各个圆都可以点击触发事件。

2，我目前的两个思路：
（1）简单粗暴的html+css。除了“综合分”的几个圆都好弄，用button填充背景色或背景图片就可以弄。“综合分”这个可以做几个图形，然后根据分数高低设置不同的背景图，圆与圆之间的连接线可以做一个比较大的背景图来弄，剩下的就是布局的问题了，这种做法比较麻烦的就是布局，尤其是要自适应宽度，那会很麻烦。
（2）用echarts、d3等类库的力导向图来做，目前正在研究是否能够比较好的实现。
3，问题：哪位做类似需求比较多的前端同学给个建议呗，谢谢。

Answer 1

如果每个圆的大小，位置，数量会有个性化定制，那肯定直接使用类库绘制会更好html+css会比较适合位置相对固定的情况，布局的话移动端可以做自适应，pc就只能定宽了