Prototype of using a reusable single value donut chart
to create a single chart:
const donut = d3.eesur.singleValueDonut()
.width(200)
.height(200)
d3.select('#vis')
.datum({
subject: 'Showing x',
value : 75
})
.call(donut)
the example use a loop to render multiple charts using the reusable component. The component takes the following api options:
singleValueDonut()
.height(200) // number
.width(200) // number or null, then will default to dom container
.innnerRadius(45) // number
.outerRadius(90) // number
.colors(['#f43530', '#eee']) // array of two hex values