colorFunctions.js

import chroma from 'chroma-js'
// Built in color functions provided for your convenience.
//
// Usage example:
//
// const pattern = trianglify({
//  width: 300,
//  height: 200,
//  colorFunction: trianglify.colorFunctions.sparkle(0.2)
// })
//
// the snippet above gives you a trianglify pattern with a 20% random
// jitter applied to the x and y gradient scales

// Linear interpolation of two gradients, one for the x and one for the y
// axis. This is the default Trianglify color function.
// The bias parameter controls how prevalent the y axis is versus the x axis
export const interpolateLinear = (bias = 0.5) =>
  ({ xPercent, yPercent, xScale, yScale, opts }) =>
    chroma.mix(xScale(xPercent), yScale(yPercent), bias, opts.colorSpace)

// Give the pattern a 'sparkle' effect by introducing random noise into the
// x and y gradients, making for higher contrast between cells.
export const sparkle = (jitterFactor = 0.15) =>
  ({ xPercent, yPercent, xScale, yScale, opts, random }) => {
    const jitter = () => (random() - 0.5) * jitterFactor
    const a = xScale(xPercent + jitter())
    const b = yScale(yPercent + jitter())
    return chroma.mix(a, b, 0.5, opts.colorSpace)
  }

// This is similar to the sparkle effect, but instead of swapping colors around
// it darkens cells by a random amount. The shadowIntensity parameter controls
// how dark the darkest shadows are.
export const shadows = (shadowIntensity = 0.8) => {
  return ({ xPercent, yPercent, xScale, yScale, opts, random }) => {
    const a = xScale(xPercent)
    const b = yScale(yPercent)
    const color = chroma.mix(a, b, 0.5, opts.colorSpace)
    return color.darken(shadowIntensity * random())
  }
}