JSFiddle - React, Tailwind, and code Playground

by Sanal S

HTML

<script src="http://www.chartjs.org/assets/Chart.min.js"></script>
<div id="chartContainer">
    <canvas id="chart" width="200" height="200"></canvas>
</div>

JavaScript

var data = [
    {
        value: 300,
        color:"#F7464A",
        highlight: "#FF5A5E"
    },
    {
        value: 50,
        color: "#46BFBD",
        highlight: "#5AD3D1"
    },
    {
        value: 100,
        color: "#FDB45C",
        highlight: "#FFC870"
    }
]


var options = 
    {
        tooltipTemplate: "<%= value %>",
        
        onAnimationComplete: function()
        {
            this.showTooltip(this.segments, true);
        },
        
        tooltipEvents: [],
        
        showTooltips: true
    }

var context = $('#chart').get(0).getContext('2d');
var chart = new Chart(context).Pie(data, options);