improve pie chart design in full css

I create pie chart in full css. ( the pie charts are used to custom leaflet markerclusters icons, before I was doing it with SVG, but firefox has very low performance to render a lots of svg at same time on the map)

I used this example to create the pies, and customized it to display a number inside the pie chart.

I created a plunkr with my code, the design can be highly improved. I’m not very friendly with CSS so I don’t find a way to center the text inside the pie chart and create a circle around it without using left/top and padding. Centering the text didn’t work.

 Do you have any advice to improve the design or to customize it ?


Source: css3

Leave a Reply