bpostlethwaite / colormap Goto Github PK
View Code? Open in Web Editor NEWoutput rgb or hex colormaps
License: MIT License
output rgb or hex colormaps
License: MIT License
Just a heads up that I've added 4 new colormaps to cmocean that you are welcome to integrate if you're interested. docs here
@bpostlethwaite I am thinking about redesigning the API so that it looks like:
var colormap = require('colormap')
var jet = colormap('jet') //or cmap(options)
var colors = jet(72) //generate number of shades
That would allow for easier to remember API, less options and higher performance.
Also I am thinking on reducing the size, as it is addressed in #13. Due to clone
dependency we include Buffer
polyfill, which adds 70kb of completely useless code here.
What do you think about such major change?
Among other improvements, it is possible to optionally enable smoothstep, for enhanced color interpolation (as it is done in glsl-colormap).
Turbo is an improvement over Jet: https://ai.googleblog.com/2019/08/turbo-improved-rainbow-colormap-for.html
Python version here: https://gist.github.com/jlmelville/be981e2f36485d8ef9616aef60fd52ab
I merely want to use this to generate a colormap with 10 divisions using the "Jet" palette.
But this isn't javascript, this is some node BS with requirements that I cannot find seperately !
I want one .js file containing what this git repo is supposed to be doing - how do I get that ?
> colormap({colormap: 'YIGnBu', nshades: 12})
[ '#081d58',
'#253494',
'#aNaNaN',
'#225ea8',
'#1d91c0',
'#aNaNaN',
'#41b6c4',
'#7fcdbb',
'#aNaNaN',
'#c7e9b4',
'#edf8d9',
'#aNaNaN' ]
The minimum number of colors should be updated or the code altered to allow fewer shades โ it is stated that the minimum for YIGnBu is 9.
Thanks.
colormap
is great but including arraytools
and clone
make the library quite large (total to ~200k not minified using webpack
. Minified along with rollup
would be smaller).
I created color-map
which create the color range same as your inner loop without dependency.
It is (1k minified, was 10k not minified using webpack
). Do you want to use it inside your library?
Originally reported in plotly/plotly.js#5457
Which "cool" is the cool?
Line 8 in cb22a04
Line 58 in cb22a04
Just an idea for colormap, inspired by cal-heatmap.
We can borrow some ideas from glsl-colormap, pretty nice collection.
Can't seem to find the dist file ? colormap.js ? guide is pretty bare.
Any help appreciated thanks.
The alpha value used the first time when generating a color map is reused when generating more maps with the same name, even if they specify different values. E.g.:
var blueRed = colormap({
colormap: "bluered",
format: "rgba",
alpha: [0, 1]
});
var blueRed2 = colormap({
colormap: "bluered",
format: "rgba",
alpha: [0, 0.5]
});
console.log(blueRed[blueRed.length - 1]); // [ 255, 0, 0, 1 ]
console.log(blueRed2[blueRed2.length - 1]); // Also [ 255, 0, 0, 1 ] but should be [ 255, 0, 0, 0.5 ]
Hello, I've been using the colormap
library in the three.js 3D renderer.
Starting with version 152, three.js applies an automatic gamma encoding on colors.
With this automatic encoding, the same scene using the viridis
color ramp renders differently:
My understanding is that now three.js applies gamma encoding (i.e converts from sRGB to linear) on the colormap colors because it expects them to be in the sRGB color space. Obviously this is not the case.
Does it mean that colors generated by colormap
are already in linear space ?
I want to add a new colormap turbo to the colormap module but I don't understand how the current colorscale was choosen/calculated and how to generate same for turbo colormap. If you could explain or direct me to some document that would be really helpful. Thanks.
Hi there, sorry for this if it is obvious or simple, i am a total beginner. How do I point this module to find the custom colorScales.js without editing the module as rebuilding loosing custom edits?
Hello,
I have been using this library for colormapping geospatial data in OpenLayers - with an option for the user to choose between any of the colormaps available.
In the reference image, there are colormaps 'YlOrRd' and 'YlGnBu' , which I had removed because using this string for retrieving a colormap had thrown an error that the colormap did not exist.
Looking at colorScale.js , it looks like these are actually stored as 'yiorrd' and 'yignbu' - is the 'l' actually supposed to be an 'i'? 'RdBu' is also capitalized in the image and lowercase in the code.
Either this is a typo on the implementation end, or a typo on the reference image. With no user reference other than the image for the names to use for colormaps, this had me confused.
Could you please either update the naming in the code or in the image? Thank you.
Certain Palettes generate duplicate values.
e.g. Temperature, jet etc.
Hi @bpostlethwaite!
There are additional sweet color maps
Iโm thinking to make a PR, so just leave notice here :)
Hey there
I just found your colormap repo here and I want to use it to display color tints depending on some data input. Not sure if I'm getting the right thing here, but I guess so.
Well, anyway, I just wanted to ask, if there is a way to use colormap without browserify. What does it actually require?
Can I also load the important stuff manually?
Thanks for your answer.
cheers
Hi, I notice the generated color in 2.3.0 is slightly different than 2.2.0.
Is this intentional?
Thanks. ๐ท
Is it possible to interpolate the color at a specific value between 0 and 1 for a colormap?
E.g. like with this package
[0, 0.25, 0.5, 0.75, 1].map(viridis)
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.