JSFiddle - React, Tailwind, and code Playground

by psoares

HTML

<div id="chart" style="width: 500px; height: 500px;"></div>

JavaScript

define(['dojo/_base/declare', 
        'dojo/_base/connect', 
        'dojox/charting/Chart', 
        'dojox/charting/plot2d/Spider'], 
        function(declare, connect){
            var MySpider = declare("dojox.charting.plot2d.MySpider", [dojox.charting.plot2d.Spider], {
                
                animDuration : 1,
                               
                _createSeriesEntry: function(ts, osps, sps, f, sk, r, ro, ms, at){
                    var widget = this;
                    
                    //polygon
                    var spoly = ts.createPolyline(osps).setFill(f).setStroke(sk), scircle = [];
                    for (var j = 0; j < osps.length; j++) {
                        var point = osps[j], cr = ms;
                        var circle = ts.createCircle({cx: point.x, cy: point.y, r: cr}).setFill(f).setStroke(sk);
                        scircle.push(circle);
                    }
            
                    var anims = dojo.map(sps, function(np, j){
                    // create animation
                    var sp = osps[j],
                        anim = new dojo._Animation({
                        duration: widget.animDuration,
                        easing:      at,
                        curve:      [sp.y, np.y]
                    });
                    var spl = spoly, sc = scircle[j];
                    connect.connect(anim, "onAnimate", function(y){
                        //apply poly
                        var pshape = spl.getShape();
                        pshape.points[j].y = y;
                        spl.setShape(pshape);
                        //apply circle
                        var cshape = sc.getShape();
                        cshape.cy = y;
                        sc.setShape(cshape);
                    });
                    return anim;
                });
            
                var anims1 = dojo.map(sps, function(np, j){
                    // create animation
                    var sp...