06 Creating tooltips in D3

The ability to use tooltips is the transcendent moment for online data visualisation. Everything prior to this could be visualised on paper. For a tooltip, you must spark up the machines. THERE ARE TWO TYPOS IN THE CODE: line 10: const plot_height = height - margin.top - margin.bottom; line 24: const plot = canvas.append('g').attr("transform", `translate(${margin.left}, ${margin.top})`); These don't actually matter until later in the series, but still. Embarrassing. _Chapters_ 00:00 Creating the tooltip 02:35 Creating the tooltipText() function 06:15 Positioning the tooltip 07:15 styling the tooltip with CSS 11:00 Improving the tooltip text 14:00 Adding transition times to the tooltip *Links* An open letter to Mike Bostock: https://anthony-munnelly.com/blog/open_letter_mike_bostock/ D3 download: https://d3js.org/getting-started About the Iris Dataset: https://en.wikipedia.org/wiki/Iris_flower_data_set Github link: https://github.com/amunnelly/d3-tutorial/tree/main/code/06