@logilab/colorscale

User interface to display a color scale for scientific visualization

Usage no npm install needed!

<script type="module">
  import logilabColorscale from 'https://cdn.skypack.dev/@logilab/colorscale';
</script>

README

====================================== A simple color scale React component

Colorscale is an open source reactjs_ component that uses the chromajs_ library to generate a pretty color scale, suitable as a legend for scientific plots or maps.

By default, it will display a 10-step multi-hued (yellow, red, black) color scale with legend values between 1 and 0.

It is customizable using title, min, max, nsteps, which are self-explanatory, or directly with ticks (the csv of all tick values).

Example usage::

var colorScale = require('./colorscale').colorScale;

var cs = colorScale(document.getElementById('color-scale'), {title: 'Temperature (°C)', min: 0., max: 100, nsteps: 10, reverse: true});

console.log(cs.getColor(74)); // prints "#f9b200"

.. _chromajs: http://gka.github.io/chroma.js/ .. _reactjs: http://facebook.github.io/react/