d3 sankey chart links are not dragging - d3.js

I’m having a problem dragging the links in this Sankey chart. The nodes are dragging fine, but the links are not moving, I think I'm not selecting the links correctly. If someone could help me out, I would really appreciate it! Here’s the codesandbox -> https://codesandbox.io/s/sankey-chart-with-drop-offs-mf4zyf?file=/src/Sankey.js

Related

Adding adapter with html content for axis labels on category axis of amcharts is causing flickering on the chart

I have use case where I need custom labels on the axis, And as per amcharts we need to use adapters for that.
So when I tried using adapters(with html as key) on the category axis it is causing the chart to flicker.
Reproduction steps:
Go to the demo link
open it in either code pen or jsFiddle which is shown in
Then in the Js file add the highlighted code in grey for the adapter usage as shown in image.
Now you can see that the chart is flickering.
Please help on the issue? Thanks :)

on-load animation for nivo pie chart with react js

Does the Nivo charts library allow on-load animations for pie charts? I have only been able to get on-load animations for bar charts, but not for pie charts.
Nivo has a transition mode property which gives animation when a chart node is clicked. I need the animation to show on component load. Is there a workaround for this or has anyone managed to get this feature to work before? My pie chart is a react js storybook component.
This seems to be a difficult problem to solve. Nivo has an outstanding issue out where they made some progress, but based on the final postings the initial draw still has issues. I was able to force an initial render with a little help from window.setTimeout() but the animation ends up warping the circle, I'm guessing that is why it doesn't work by default.
I tried Victory.js and it also has the exact same issue. You can use this technique in React.js to force the initial draw.
My solution was to move to react-chartjs-2, which worked right out of the box.
https://react-chartjs-2.js.org/components/doughnut/

d3,dc.js composite brush chart tooltip not working

As I mentioned above in composite chart tool tip is not visible after redraw the graph in d3.js. Grateful for any suggestions!

combining dimple.js with d3.js

I want to add zooming functionality using d3.js in a bar chart created using dimple.js. See following link for what I did so far. http://jsbin.com/rejof/2/edit
I want to combine both zooming functionality in dimple chart. Thanks in advance.
I don't think you can easily do this, you would probably need to modify the dimple source code as I believe zooming relies on a different dom structure to the one dimple uses. You might find it easier to recreate the chart you require in raw d3, rather than modifying a dimple chart to zoom. Of course I'd love to be proven wrong.

Donut chart with partial ring around

I'm building a context menu using D3.js donut chart. Now I'd like to add a submenu when mousehovering a certain element, like this (sorry for my paint skills):
The main donut menu is already done, but I can't figure out how to add the submenu. It must be centered around the parent element (the element that has the subitems), because other menu items in the main menu might also have a submenu.
I already looked into this question: D3.js - Donut charts with multiple rings but those are full rings.
Anyone an example?
I managed to get it working! I used startAngle, endAngle, innerRadius and outerRadius.
Only the centering around the parent element isn't done yet. I just place the submenu always on top now. This is the result:
Thanks for the help everyone!

Resources