patternfly / patternfly-react

A set of React components for the PatternFly project.
https://react-staging.patternfly.org/
MIT License
768 stars 350 forks source link

Sankey diagram #10817

Open kuklas opened 1 month ago

kuklas commented 1 month ago

New feature, i dont think PF has this

Describe the feature We (Cost management) are looking for Sankey diagram. Competitors are using it in Cost world. Cloudability is using it in the True cost explorer https://technickle.medium.com/thinking-differently-about-sankey-95eae229a82d

PM requested it for the feature, and I believe its useful beyond the feature for everyone that is working with observability. Just not sure about PF and charts, do we create our own or do we use third party?

https://mermaid.js.org/syntax/sankey.html https://issues.redhat.com/browse/COST-5330

kuklas commented 1 month ago

https://nivo.rocks/sankey/

kuklas commented 1 month ago

https://github.com/orgs/patternfly/discussions/5864

tlabaj commented 1 month ago

cc @dlabrecq @andrew-ronaldson

dlabrecq commented 1 month ago

Victory does not currently support sankey. However, I recommend using Apache ECharts for this particular chart.

I'll take a look at wrapping this chart with our existing PatternFly themes. Customizing tooltips to look like PatternFly will be a challenge.

pgarciaq commented 1 month ago

I recommend NOT using Mermaid JS, which is completely broken. See https://github.com/mermaid-js/mermaid/issues/5684 and linked issues.

SankeyMatic is open source (ISC license) and worked pretty well for me https://sankeymatic.com/ https://github.com/nowthis/sankeymatic