search

nteract / semiotic

A data visualization framework combining React & D3
https://semioticv1.nteract.io/
Other
2.43k stars 133 forks source link

Show arrows on solid sankey edges #640

Closed emeeks closed 2 years ago

emeeks commented 2 years ago

The circular sankey layout isn't great at sizing to fit the existing space and this corrects it by adjusting the sankey edges and nodes in the zoom phase in network frame. But it adjusts the datapoints themselves and d3-circular-sankey has already calculated the edge d values for SVG path elements.

The edges drawn by d3-sankey-circular are meant to be paths where stroke-width encodes the flow, which has its strengths and weaknesses. The edges in Semiotic are areas. The main problem is that you can't get arrows drawn over areas (because the arrow code is based on the line which for stroke-encoding is the middle of the path but for area encoding it's the perimeter) so this adds an option to networkSettings called showArrows and draws arrows on top of the paths if it's set to true.

Screen Shot 2022-08-21 at 12 57 51 PM
vercel[bot] commented 2 years ago

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Updated
semiotic ✅ Ready (Inspect) Visit Preview Aug 23, 2022 at 2:44AM (UTC)