Custom bullseye chart for Salesforce chart.js

Question

I would like to create a layer of overlapping circles. Something like the following http://imgur.com/VAB2jsy

I guess it would be similar to a bullseye chart. I would imagine it needs to be built with chart.js and tied to Salesforce Apex Page. The idea is that it will be embedded into the account and it will populate the Contact Details (Related List) from the account depending on the roles. It will display information for 14 roles and the layers of the circles are fixed as well.
First Innermost circle has 2 roles. 2nd has 2 roles 3rd has 2 roles 4th has 3 roles 5th has 5 roles.

If there are multiple people it should display multiple people under that role within each circle and it should dynamically adjust.

I know it can be done but don't know how to go about getting this done. Can anyone help with the chart.js or js script which will help me achieve this and how it can be embedded into an apex page?