JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/c3/0.4.10/c3.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/c3/0.4.10/c3.min.js"></script>
<div id="chart"></div>

JavaScript

var chart = c3.generate({
    padding: {
        top: 10,
        right: 0,
        bottom: 10,
        left: 0,
    },
    data: {
        columns: [
            ['d1', 30],
            ['d2', 120], ],
        type: 'pie',
        labels: true,
names:{
d1: 'some name here',d2:'another name'}
    }
    //But these legend values or not showing 

});