Skip to content

punker76/chart-color-generator

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

3 Commits
 
 
 
 
 
 
 
 

Repository files navigation

chart-color-generator

This repository shows you how to automatically generate chart colors with Chart.js and D3 Scale Chromatic. We specifically use D3 Scale Chromatic's interpolate color functions.

Tutorial

We've written a detailed tutorial that walks you through the color generating functions and chart creation. Read it on the 🌟 CodeNebula blog: Automatically Generate Chart Colors with Chart.js & D3's Color Scales.

Instructions

  1. (Optional) Open index.html in your code editor
  2. (Optional) Feel free to change the "Example Data" parameters listed on lines 76 - 101 (change line 95 if you'd like to test another D3 interpolate color scale)
  3. Navigate to your browser and open index.html to see the generated chart

Some Example Combinations

Various chart color combinations

Releases

No releases published

Packages

No packages published

Languages

  • HTML 71.2%
  • JavaScript 19.7%
  • CSS 9.1%