Skip to main content
100%

Multi-links in tooltips using v6

✓ Published0🌍 Public
Dd3noob
Last edited Sep 14, 2020
Created on Sep 14, 2020

This example shows a time-series line graph of stock closing prices, with each data point rendered as a circle that displays a persistent tooltip on mouseover. Each tooltip contains the date, the closing value, and a hyperlink to a related D3 block, making the linked resources directly accessible from the visualization. The implementation uses D3 v6 with SVG rendering and animation. It parses dates with `d3.timeParse`, scales the data with `d3.scaleTime` and `d3.scaleLinear`, and draws the line with `d3.line`. Circles trigger tooltip transitions that open the embedded URLs in new tabs.

AI-generated description

This is a simple graph demonstrating the addition of persistant tooltips with different hyperlinks in a graph.

This graph is part of the code samples for the update to the book D3 Tips and Tricks to version 6 of d3.js.

mit Licensed

Similar vizzes