Noisy Pneumatic Mnemonic
    Share your code. npm Orgs help your team discover, share, and reuse code. Create a free org »

    d3-creedpublic

    d3-creed

    Force layout chart based on d3.js.

    Install

    $ npm install d3-creed

    Usage

    const creed = require('d3-creed')
     
    // create chart
    var chart = creed({
        target: '#chart'
    })
     
    chart.render({
        nodes: [...],
        links: [...]
    })

    or in browser:

    <script src="path/to/d3-creed.min.js"></script>
    <script>
        var chart = creed({
            target: '#chart'
        });
        chart.render({
            nodes: [...],
            links: [...]
        });
    </script> 

    Examples

    $ npm run example

    then access http://localhost:9000/examples/.

    Basic Example:

    Customized Example:

    API

    creed(options)

    Create a new force layout chart with given options.

    chart.render(data)

    Render the chart with given data.

    chart.clear()

    Clear the chart.

    Customization

    You could customize every step when rendering the chart.

    • customize force

      chart.force
        .charge(-100)
        .linkDistance(50)
    • customize links rendering

      chart._renderLinks = function() {
        // ...
      }
    • customize nodes rendering

      chart._renderNodes = function() {
        // ...
      }
    • customize links ticking

      chart._tickLinks = function() {
        // ...
      }
    • customize nodes ticking

      chart._tickNodes = function() {
        // ...
      }
    • customize events

      // these could be accessed before rendering
      chart.svg
      chart.defs
      chart.glink
      chart.gnode
       
      // these could be accessed after rendering
      chart.nodes
      chart.links

    License

    MIT

    install

    npm i d3-creed

    Downloadsweekly downloads

    4

    version

    1.0.0

    license

    MIT

    repository

    githubgithub

    last publish

    collaborators

    • avatar