JSFiddle - React, Tailwind, and code Playground

HTML

<div id="windBarbArrow">
    
</div>

JavaScript

$(function () {

    var WindBarbArrowHandler = {
        
        WindArrow: function (speed, direction, container, arrowWidth) {
        'use strict';
        var index = 0,
            i;

        this.speed = speed;
        this.direction = direction;
        this.trigDirection = direction + 90;
        this.scale = arrowWidth / 8;

        this.ten = 0;
        this.five = 0;
        this.fifty = 0;


        // Create the canvas
        $(container).append(
                                $('<svg></svg>')
                                    .attr({ height: 2 * arrowWidth, width: 2 * arrowWidth })
                           );
        $("svg", container).append('<defs></defs>');
        $("defs", container).append($('<clipPath></clipPath>').attr('id', 'clip'));
        $("clipPath", container).append($('<rect></rect>')
                                        .attr({ height: 2 * arrowWidth, width: 2 * arrowWidth }));

        // Draw the widget area    
        $("svg", container).append($('<g></g>').attr('class', 'wind-arrow'));

        this.widget = $("svg", container);

        if (this.speed > 0) {
            // Prepare the path
            this.path = "";
            if (this.speed <= 7) {
                // Draw a single line
                this.longBar();
                index = 1;
            } else {
                this.shortBar();
            }

            // Find the number of lines in function of the speed
            this.five = Math.floor(this.speed / 5);
            if (this.speed % 5 >= 3) {
                this.five += 1;
            }

            // Add triangles (5 * 10)
            this.fifty = Math.floor(this.five / 10);
            this.five -= this.fifty * 10;
            // Add tenLines (5 * 2)
            this.ten = Math.floor(this.five / 2);
            this.five -= this.ten * 2;

            // Draw first the triangles
            for (i = 0; i < this.fifty; i++) {
                this.addFifty(index + 2 * i);
            }
  ...