JSFiddle - React, Tailwind, and code Playground

by FusionCharts

HTML

<script src="https://cdn.fusioncharts.com/fusioncharts/latest/fusioncharts.js"></script>
<script src="https://cdn.fusioncharts.com/fusioncharts/latest/themes/fusioncharts.theme.fusion.js"></script>
<div id="chart-container">
  FusionCharts will render here</div>

JavaScript

FusionCharts.ready(function() {
  var chordChart = new FusionCharts({
    type: "chord",
    renderAt: "chart-container",
    id: "chord-chart",
    width: "100%",
    height: "500",
    dataFormat: "json",
    dataSource: {
      "chart": {
        "caption": "Different countries Gross Export",
        "subcaption": "in 2017",
        "nodeLabelPosition": "outside",
        "showLegend": 0,
        "theme": "fusion",
        "mode": "post",
        "nodeSpacing": "15"
      },
      "nodes": [{
          "label": "India"
        },
        {
          "label": "Canada"
        },
        {
          "label": "USA"
        },
        {
          "label": "China"
        },
        {
          "label": "UK"
        },
        {
          "label": "UAE"
        }
      ],
      "links": [{
          "from": "India",
          "to": "Canada",
          "value": 3040000000
        },
        {
          "from": "India",
          "to": "USA",
          "value": 46500000000
        },
        {
          "from": "India",
          "to": "China",
          "value": 12700000000
        },
        {
          "from": "India",
          "to": "UK",
          "value": 8860000000
        },
        {
          "from": "India",
          "to": "UAE",
          "value": 27500000000
        },
        {
          "from": "Canada",
          "to": "India",
          "value": 24490000000
        },
        {
          "from": "Canada",
          "to": "USA",
          "value": 310000000000
        },
        {
          "from": "Canada",
          "to": "China",
          "value": 18300000000
        },
        {
          "from": "Canada",
          "to": "UK",
          "value": 9320000000
        },
        {
          "from": "Canada",
          "to": "UAE",
          "value": 1830000000
        },
        {
          "from": "USA",
          "to": "India",
          "value": 24100000000
        },
        {
          "from": "USA",
          "to": "Canada",
         ...