almende / vis

⚠️ This project is not maintained anymore! Please go to https://github.com/visjs
7.85k stars 1.48k forks source link

Enable support for custom colorbar (color map) in graph3d #3004

Open minyang opened 7 years ago

minyang commented 7 years ago

Currently, vis.js - graph3d only supports one color scheme for color map: blue (lowest value) to red (highest value). It would be nice if various color schemes are natively supported, or -- even better -- if a custom (user-defined) color palette could be supported. For example, Matlab provides native support for a set of colormaps: https://www.mathworks.com/help/matlab/ref/colormap.html

Just in case anyone who might be interested in flipping the color bar to represent values using the opposite notation (i.e., blue being the highest value, red being the lowest value), here is a quick hack to do it (applicable to 'dot-color' or 'bar-color' style charts):

In vis.js,

  1. Around Line 10552, look for Graph3d.prototype._redrawLegend = function() {. Around Line 10590, inside for (y = ymin; y < max; y++) under if (isSizeLegend == false), change var hue = f * 240; to var hue = 240 * (1 - f);
  2. Around Line 11179, look for Graph3d.prototype._getColorsColor = function (point) {. Around Line 11187, change var hue = (1 - (point.point.value ... to var hue = 240 - (1 - (point.point.value ....

Not very clean way, but working solution for me without digging too much into the core code of visjs.

wimrijnders commented 7 years ago

I admit that I like the idea of colormaps; but I really don't see how this will be added any time soon. I suppose you could have a go at it.

For reference and inspiration: