Code for the blog post for Heart Internet about creating D3 charts with TDD
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.

Heart Internet - D3 with TDD Blog Post

This repository contains the code for the blog post

Heat Map Chart


Visit the blog post to see this in action

The different steps of the tutorial are:

  1. Setup
  2. Basic Chart
  3. Axes
  4. Styles and Animations
  5. Configuration and Accessors
  6. Using Real Data


  1. Clone the repository
  2. Run yarn && yarn start or npm install && npm run start to build the code and start the development server
  3. Visit the default url http://localhost:1234/


To modify and extend this code, you can follow the installation instructions, and instead of running start:

  1. Open a new terminal and run yarn run dev or npm run dev to build and watch changes in the code
  2. Open another terminal and run yarn run serve or npm run serve to start the development server
  3. In a different terminal, run yarn test or npm test to run the tests
  4. Visit the default url http://localhost:1234/


Licensed under the Apache License, Version 2.0 (the “License”); you may not use this file except in compliance with the License. You may obtain a copy of the License at

Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an “AS IS” BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.

Read more in the license document