{"version":"1.0","type":"rich","title":"Node-Link Diagrams vs. Adjacency Matrix","description":"This example presents a side-by-side comparison of two network visualization techniques: a node-link diagram and an adjacency matrix. The node-link diagram uses a force-directed layout, allowing users to drag nodes, zoom, and click to highlight connections, which are mirrored in the matrix. Clicking a matrix cell highlights the corresponding link in the diagram. The implementation relies on `d3.forceSimulation`, `d3-force`, and `d3.zoom` for interaction, while the matrix is rendered as SVG rects. The data is mapped from the same graph structure, with node size and color encoding group membership.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/e0b2acfd42a44f768b86bb5af8f08324?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}