Skip to main content
100%

d3 mouseover multi-line chart

✓ Published0🌍 Public
Aaniston
Last edited May 8, 2018
Created on May 8, 2018

This interactive multi-line chart displays temperature readings for New York, San Francisco, and Austin over a two-week period. The visualization uses D3 v3 to render an SVG with smooth basis-interpolated lines, a time-scaled x-axis, and a linear y-axis showing temperature in Fahrenheit. Each city has a distinct color from the category10 scale, with a legend and end-of-line labels. The code includes a mouse-over effect that draws a vertical tracking line, using the d3.svg.line and d3.time.scale APIs to follow the cursor across the plotted data.

AI-generated description

An interactive multi-line chart.

Note, I borrowed a bit of code from Duopixel's excellent code sample here.

Built with blockbuilder.org

forked from <a href='http://bl.ocks.org/larsenmtl/'>larsenmtl</a>'s block: <a href='http://bl.ocks.org/larsenmtl/e3b8b7c2ca4787f77d78f58d41c3da91'>d3 mouseover multi-line chart</a>

mit Licensed

Similar vizzes