@types/d3-sankey

What is @types/d3-sankey?

@types/d3-sankey provides TypeScript type definitions for the d3-sankey library, which is used to create Sankey diagrams. Sankey diagrams are a type of flow diagram in which the width of the arrows is proportional to the flow rate. This package helps developers use d3-sankey with TypeScript by providing type definitions.

What are @types/d3-sankey's main functionalities?

Creating a Sankey Diagram

This code demonstrates how to create a basic Sankey diagram using the d3-sankey library. The `sankey` function is used to generate the diagram from a graph object containing nodes and links.

const sankey = d3.sankey();
const graph = {
  nodes: [
    { name: 'A' },
    { name: 'B' },
    { name: 'C' }
  ],
  links: [
    { source: 0, target: 1, value: 10 },
    { source: 1, target: 2, value: 5 }
  ]
};
const sankeyGraph = sankey(graph);

Customizing Node Width

This code shows how to customize the width of the nodes in the Sankey diagram. The `nodeWidth` method is used to set the width of the nodes.

const sankey = d3.sankey().nodeWidth(20);
const graph = {
  nodes: [
    { name: 'A' },
    { name: 'B' },
    { name: 'C' }
  ],
  links: [
    { source: 0, target: 1, value: 10 },
    { source: 1, target: 2, value: 5 }
  ]
};
const sankeyGraph = sankey(graph);

Setting Node Padding

This code demonstrates how to set the padding between nodes in the Sankey diagram. The `nodePadding` method is used to specify the padding.

const sankey = d3.sankey().nodePadding(10);
const graph = {
  nodes: [
    { name: 'A' },
    { name: 'B' },
    { name: 'C' }
  ],
  links: [
    { source: 0, target: 1, value: 10 },
    { source: 1, target: 2, value: 5 }
  ]
};
const sankeyGraph = sankey(graph);

Other packages similar to @types/d3-sankey

d3-sankey-diagram

The d3-sankey-diagram package is another library for creating Sankey diagrams using D3.js. It offers more customization options and additional features compared to d3-sankey, such as support for circular links. It is a good alternative if you need more advanced features.

README

Installation

npm install --save @types/d3-sankey

Summary

This package contains type definitions for d3-sankey (https://github.com/d3/d3-sankey/).

Details

Files were exported from https://github.com/DefinitelyTyped/DefinitelyTyped/tree/master/types/d3-sankey.

Additional Details

• Last updated: Mon, 06 Nov 2023 22:41:05 GMT
• Dependencies: @types/d3-shape

Credits

These definitions were written by Tom Wanzek, and Alex Ford.