JSFiddle - React, Tailwind, and code Playground

HTML

<div id="holder"></div>

CSS

#holder {
    height: 800px;
}

JavaScript

function drawgrowingpie() {

    var r = Raphael("holder");
    r.customAttributes.segment = function(x, y, r, a1, a2, clr, i) {
        var flag = (a2 - a1) > 180;
        a1 = (a1 % 360) * Math.PI / 180;
        a2 = (a2 % 360) * Math.PI / 180;
        clr = [".0",".12",".24",".36",".48",".60",".72",".84"];
        var props = {
            path: [["M", x, y], ["l", r * Math.cos(a1), r * Math.sin(a1)], ["A", r, r, 0, +flag, 1, x + r * Math.cos(a2), y + r * Math.sin(a2)], ["z"]]
        };
        
        if (clr) {              
            props.fill = "hsb(" + clr[i % clr.length] + ", .60, .77)";
        }                
        return props;
    };

    function animate(ms) {
        var start = 0,
            val;
        for (i = 0; i < ii; i++) {
            val = 360 / total * data[i];
            paths[i].animate({
                segment: [200, 200, 150, start, start += val, undefined, i]
            }, ms || 1500, "bounce");
            paths[i].angle = start - val / 2;
        }
    }
    var data = [100, 100, 100, 100, 100, 100, 100, 100],
        paths = r.set(),
        total, start, bg = r.circle(200, 200, 0).attr({
            stroke: "#fff",
            "stroke-width": 50
        });
    data = data.sort(function(a, b) {
        return b - a;
    });
    var names = ["blah 1","blah 2","blah 3","blah4","blah 5","blah 6","blah 7","blah 8"],
    total = 0;
    for (var i = 0, ii = data.length; i < ii; i++) {
        total += data[i];
    }
    start = 0;
    for (i = 0; i < ii; i++) {
        var val = 360 / total * data[i];
        (function(i, val) {
            paths.push(
                r.path().attr({segment: [200, 200, 1, start, start + val, val, i],stroke: "#fff"} 
                 ).click(function() {
                total += data[i];
                data[i] *= 2;
                animate();
            }).hover(function(e) {
                posx = e.offsetX;
                posy = e.offsetY;
                this.label =...