gosling-lang / gosling.js

Grammar of Scalable Linked Interactive Nucleotide Graphics
https://gosling.js.org
MIT License
159 stars 27 forks source link

Support custom quantitative colormap #303

Open sehilyi opened 3 years ago

sehilyi commented 3 years ago

Example:

color: { field: 'category', type: 'quantitative', range: ['white', 'black']}
flekschas commented 3 years ago

It'd be extra cool if we could use chroma.js to allow the user to configure the colormap rather having to provide all the colors. E.g., their tool for creating palettes is fantastic: https://gka.github.io/palettes/#/9|s|00429d,96ffea,ffffe0|ffffe0,ff005e,93003a|1|1

I am thinking the user could specify 9|s|00429d,96ffea,ffffe0|ffffe0,ff005e,93003a|1|1 (or maybe a structured object) which then gets translated using chroma.js into a list of colors.

Not sure we need to support all parameters. For instance, lightness correction and bezier interpolation could be turned on by default because there's no point not to do that from a VIZ perspective.

Maybe a structured object of this form could be nice:

{
  range: {
    size: 32,
    steps: ['#00429d', '#96ffea', '#ffffe0'],
    diverging: false, // default setting, I am only adding it as an option
  }
}