Flourish colors

Add settings and logic to easily add custom colors to your template

Install

npm install @flourish/colors

Basic usage

The settings.yml file should be imported into your template’s template.yml file, like this:

  - Colours
  - property: color
    import: "@flourish/colors"

Import the package like import createColors from "@flourish/colors"

var colors = createColors(state.color) creates a new object colors.

You only need to pass in a state to get the color function working.

Methods

colors.getColor(value) finds the correct color for value. Will just return the fallback value unless the updateColorScale method has been called at some point.

colors.fallback([value]) returns the current fallback value if value is undefined or (usually) sets it to value if it is defined and returns the colors object. The value "default" (re)sets the fallback to be the default value of null. The fallback value is returned whenever the getColor method cannot interpret the value passed into it (for example if that value is non-numeric when in sequential or diverging mode).

colors.updateColorScale(domain) updates the color scale based on the domain array.