Javascript Salesforce chart.js的自定义bullseye图表

我想创建一个重叠的圆圈层。类似于下面的内容

我想这会类似于一张斗牛图。我认为它需要使用chart.js构建，并与Salesforce Apex页面绑定。其想法是，它将嵌入到帐户中，并根据角色从帐户中填充联系人详细信息（相关列表）。它将显示14个角色的信息，圆圈的层也是固定的。
第一个最里面的圆圈有两个角色。 第二个角色有两个 第三个角色有两个 第四个角色有三个 第五个角色有5个

如果有多人，则应在每个圈中显示该角色下的多人，并应动态调整

我知道这是可以做到的，但不知道如何去做这件事。有谁能帮助我使用chart.js或js脚本来实现这一点，以及如何将其嵌入到apex页面中？

类似的内容您可以提供更详细的数据结构，以便了解您到底想要什么。