D3 Location
This example demonstrates a network diagram of interconnected nodes, where users can drag circles to reposition them and observe the linked lines update in real time. The visualization uses React for state management with a `useReducer` hook, while `d3-drag` handles the interactive dragging behavior and D3's `select` and `range` APIs render the SVG elements. Links are drawn as thick black lines connecting sequential nodes, and circles are semi-transparent with hover effects. The code initializes positions from a small dataset and dispatches drag events to update the visualization's state.