JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://static.fusioncharts.com/code/latest/fusioncharts.js"></script>
<div id="host"></div>

JavaScript

var host = document.getElementById('host');
var root = host.createShadowRoot();
var divInsideShadowRoot = document.createElement('div');
root.appendChild(divInsideShadowRoot);

var chart = new FusionCharts({
  type: 'bar2d',
  renderAt: divInsideShadowRoot,
  dataFormat: 'json',
  dataSource: {
    "chart": {
        "caption": "Monthly revenue for last year",
        "subCaption": "Harry's SuperMart",
        "xAxisName": "Month",
        "yAxisName": "Revenues (In USD)",
        "numberPrefix": "$",
        "theme": "fint"
    },
    "data": [
        {
            "label": "Jan",
            "value": "420000"
        },
        {
            "label": "Feb",
            "value": "810000"
        },
        {
            "label": "Mar",
            "value": "720000"
        },
        {
            "label": "Apr",
            "value": "550000"
        },
        {
            "label": "May",
            "value": "910000"
        },
        {
            "label": "Jun",
            "value": "510000"
        },
        {
            "label": "Jul",
            "value": "680000"
        },
        {
            "label": "Aug",
            "value": "620000"
        },
        {
            "label": "Sep",
            "value": "610000"
        },
        {
            "label": "Oct",
            "value": "490000"
        },
        {
            "label": "Nov",
            "value": "900000"
        },
        {
            "label": "Dec",
            "value": "730000"
        }
    ]
  }
}).render();