Multi-series line chart with tooltip

Chinooks are responsible for large temperature variations in southern Alberta, Canada. The interactive multi-series line chart shows temperatures measured in two Calgary locations — Springbank and Calgary International airports — on 22 November 2017. Hovering over the visualization causes a tooltip containing temperatures in the said locations to be displayed.

This visualization was implemented with D3.js version 4.12.2 and based on Mike Bostock's Multi-series Line Chart and X-Value Mouseover blocks.

Getting started

  • Clone or download the repository.

  • Run a local web server1 so that the external data file can be loaded.

  • Interact with the visualization in your web browser.

1 If Python is installed on the computer, execute one of the following to run a web server locally on port 8000:

  • python -m SimpleHTTPServer 8000 for Python 2.x
  • python -m http.server 8000 for Python 3.x

Data sources

Government of Canada · Historical Climate Data

CBC