cyclical.md

<script setup> import * as d3 from "d3"; import ColorRamp from "../components/ColorRamp.vue"; </script>

Cyclical schemes

To create a cyclical continuous color scale using the Rainbow color scheme:

const color = d3.scaleSequential(d3.interpolateRainbow);

interpolateRainbow(t) {#interpolateRainbow}

Source · Given a number t in the range [0,1], returns the corresponding color from d3.interpolateWarm scale from [0.0, 0.5] followed by the d3.interpolateCool scale from [0.5, 1.0], thus implementing the cyclical less-angry rainbow color scheme.

interpolateSinebow(t) {#interpolateSinebow}

Source · Given a number t in the range [0,1], returns the corresponding color from the “sinebow” color scheme by Jim Bumgardner and Charlie Loyd.