RadialTree

Radial Tree

This is a reusable dex.js radial tree based upon Mike Bostock's example.

Comments

Presently, this chart is highly configurable, but not interactive yet.

References

dex.js The main site

<!DOCTYPE html>
<head>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.theme.min.css">
    <link rel="stylesheet" href="https://dexjs.net/js/dex-jquery.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.css"/>
    <link rel="stylesheet" href="https://dexjs.net/js/dex-bootstrap.css">
    <link rel="stylesheet" href="https://dexjs.net/js/dex.css">

// Read in the csv data and convert it to dex style CSV.
  d3.csv("presidents.csv", function (error, data) {
    var presidents = new dex.csv(data);

// Create a color scheme for our chart.
    var colorScheme = d3.scaleOrdinal(['red', 'blue', 'green', 'black']);

// Create the chart, give it some personality.
    presidentRadialTree = dex.charts.d3.RadialTree({
      'parent': '#RadialTreeParent',
      'csv': presidents.include([2, 3, 1])
    }).render();
  });
</script>
</body>

https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js

https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js

https://dexjs.net/js/dex-jquery.js

https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js

https://dexjs.net/js/dex-bootstrap.js

https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js

https://dexjs.net/js/dex-libs.js

https://dexjs.net/js/dex.js