D3 Tutorial on Electronic Health Records
This is a short tutorial that shows how to load and visualize electronic health records with d3.
Please check out the
branch to get an initial version of the project to follow along.
You can navigate through the commits of the project to get a commented step-by-step breakdown:
- initial version
- setting up the SVG
- drawing events
- position horizontally
- color events
- position vertically
- order vertical positions
- show horizontal axis
- add zooming and panning
- pop events on hover
- show labels on hover
master branch contains the final result.
index.html opens the visualization in your browser.
An online version of the final stage can be found here.