react-dynamic-animated-tree

React animated tree with dynamically generated with the data

Usage no npm install needed!

<script type="module">
  import reactDynamicAnimatedTree from 'https://cdn.skypack.dev/react-dynamic-animated-tree';
</script>

README

react-dynamic-animated-tree

React animated tree with dynamically generated with the data

NPM JavaScript Style Guide Node.js CI

Install

npm install --save react-dynamic-animated-tree

Demo https://codesandbox.io/s/react-dynamic-tree-git8z

Usage

import React, { Component } from 'react'
import DynamicTree  from 'react-dynamic-animated-tree'

var data = [{
  "title": "Sri Lanka",
  "id": "1",
  "childNodes": [{
      "title": "Western Province",
      "id": "11",
      "childNodes": [{
        "title": "Colombo District",
        "id": "111",
        "childNodes": [], 
      }],
  },
  {
    "title": "Central Province",
    "id": "12",
    "childNodes": [{
      "parentNode": null,
      "childNodes": [],
      "title": "Kandy",
      "id": "121"
      }],
  }],
},
{
  "title": "India",
  "id": "2",
  "childNodes": [{
    "title": "Maharashtra",
    "id": "21",
    "childNodes": [{
      "title": "Pune",
      "id": "211",
      "childNodes": [],
    }],
  }],  
}]

class Example extends Component {
  render() {
    return <DynamicTree key="root" id="root" data={[...data]} title="Dynamic Tree" />
  }
}

License

MIT © DimuthRuwantha