Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Error in default color map #332

Closed
jywarren opened this issue Sep 10, 2018 · 20 comments · Fixed by #475
Closed

Error in default color map #332

jywarren opened this issue Sep 10, 2018 · 20 comments · Fixed by #475
Assignees
Labels

Comments

@jywarren
Copy link
Member

jywarren commented Sep 10, 2018

default: colormap([
[0, [0, 0, 255], [0, 255, 0] ],
[0.25, [0, 255, 0], [255, 255, 0] ],
[0.50, [0, 255, 255], [255, 255, 0] ],
[0.75, [255, 255, 0], [255, 0, 0] ]

via @MargaretAN9 shows an error in the default color bar, which has 2 "yellow" regions. We'd love help fixing this!

image

@jywarren jywarren added the bug label Sep 10, 2018
@gitmate
Copy link

gitmate bot commented Sep 10, 2018

GitMate.io thinks possibly related issues are #147 (replaceImage() returns error), #278 (Module not found error in demo), #281 (Skip writing defaults into toString), and #145 ("reader is not defined" error on demo).

1 similar comment
@gitmate
Copy link

gitmate bot commented Sep 10, 2018

GitMate.io thinks possibly related issues are #147 (replaceImage() returns error), #278 (Module not found error in demo), #281 (Skip writing defaults into toString), and #145 ("reader is not defined" error on demo).

@MargaretAN9
Copy link

Questions: @jywarren
1)I have downloaded several colorbars form public lab (https://publiclab.org/wiki/ndvi-gradients) and other sites. Are you looking for something like ‘physics’ for default?
slide3

2)There are 5 colormaps in image sequencer but only 4 are posted (default, stretched, greyscale and fastie). Missing is NDVI listed below. Do you have a picture of the NDVI colormap and why is it not on the image sequencer drop down menu?

ndvi:      colormap([

  | [0,     [0,   0,   255], [38,  195, 195] ],
  | [0.5,   [0,   150, 0],   [255, 255, 0]   ],
  | [0.75,  [255, 255, 0],   [255, 50,  50]  ]

@jywarren
Copy link
Member Author

jywarren commented Sep 12, 2018 via email

@MargaretAN9
Copy link

-OK so they are all good except for the old default,

  • I think the default colormap problem may be just that the colors values are misplaced.
  • Its going to take me time to figure out how to test colormaps direct from the image sequencer code but I will try

@jywarren
Copy link
Member Author

Awesome! So, you can supply a unique colormap as an array parameter to the colormap module:

module.exports = function Colormap(value, options) {
options.colormap = options.colormap || colormaps.default;
// if a lookup table is provided as an array:
if(typeof(options.colormap) == "object")
colormapFunction = colormap(options.colormap);
// if a stored colormap is named with a string like "fastie":
else if(colormaps.hasOwnProperty(options.colormap))
colormapFunction = colormaps[options.colormap];
else colormapFunction = colormaps.default;

I bet we could offer the ability to input a string that would be used as a gradient, using the info.json file's inputs:

https://github.com/publiclab/image-sequencer/blob/master/CONTRIBUTING.md#info-file

@jywarren
Copy link
Member Author

Adding a string input like colormap to the info.json should expose it internally as options.colormap, as here with options.brightness:

var val = (options.brightness)/100.0

@tech4GT
Copy link
Member

tech4GT commented Sep 25, 2018

@jywarren @MargaretAN9 Are you guys still working on this issue?

@MargaretAN9
Copy link

MargaretAN9 commented Sep 26, 2018

Yes, but I haven’t had time to sort out all the issues.
@jywarren, @tech4GT

1)Problem: Existing ‘default’ colormap has two yellows (255,255,0)
default: colormap([
[0, [0, 0, 255], [0, 255, 0] ],
[0.25, [0, 255, 0], [255, 255, 0] ],
[0.50, [0, 255, 255], [255, 255, 0] ],
[0.75, [255, 255, 0], [255, 0, 0] ]

Solution: Remove first yellow and replace with blue/green (0,255,255)? This eliminates the double yellow and permits blue/green blend in center.

default: colormap([
[0, [0, 0, 255], [0, 255, 0] ],
[0.25, [0, 255, 0], [0,255,255] ],
[0.50, [0, 255, 255], [255, 255, 0] ],
[0.75, [255, 255, 0], [255, 0, 0] ]

2)Problem : Add ’ NDVI’ colormap. This seems to be a new menu edition but I have not been able to display what it would look like:
| [0, [0, 0, 255], [38, 195, 195] ],
| [0.5, [0, 150, 0], [255, 255, 0] ],
| [0.75, [255, 255, 0], [255, 50, 50] ]

It seems to be :
0 to .5 --- blue to light blue

.5 to .75---light green to yellow

.75 to 1 yellow to dark red

3)Problem: Add new colormaps .
-Haven’t figured out how to make a reverse look up table/function from the 'new' colormaps posted above.
4) Problem: Some sort of guide which would tell users which colormap to use for different applications.

@tech4GT
Copy link
Member

tech4GT commented Sep 26, 2018

@MargaretAN9 should I go ahead and implement these changes in code or would you like to do it? Thanks for all the help!

@MargaretAN9
Copy link

@jywarren, @tech4GT

Yes, that would solve the current 'default' glitch problem as well as add the NDVI colormap option. This should make image sequencer consistent with infragram (https://infragram.org/sandbox/)

Note I am still not exactly sure if I have the right 'default' function so we may have to adjust again.

@tech4GT
Copy link
Member

tech4GT commented Sep 27, 2018

@MargaretAN9 I tried your function and this is the result I am getting. Please have a look.
screen shot 2018-09-27 at 12 40 30 pm

@MargaretAN9
Copy link

-Thanks for this, but I was wrong, it solves one problem and creates another . It isn't good since green is repeated.

  • Today, I was able to get image sequencer working on raspberry pi so hopefully I will be able to test some new functions.
    @jywarren, @tech4GT

@tech4GT
Copy link
Member

tech4GT commented Sep 28, 2018

Awesome!!

@MargaretAN9
Copy link

I have finished encoding new colormaps for image sequencer. This should fix the double color default problem described above and add more options.

-Updated colorbars for image sequencer are pictured below:
slide1

-Changes made:
1)Replaced old ‘default’ with new default that is blue to red continuous. ( You can select another colormap for the default setting. ) I picked blue to red since I assume most expect a full color colormap
2) added new colormaps: bluwhtgrngis,brwto grn,blutoredjet,16 colors

-Software: Colormap software changes have been made to colormap.js . Note I have only made modifications to colormap.js and have not added new colormap names to the ‘Name of the colormap’ drop down menu. File is located here : https://github.com/MargaretAN9/Image-sequencer/blob/master/Colormap.js

-Names are based on color descriptions. Feel free to change.

-Sometype of colorbar menu/description needs to added so everyone knows what type of colorbar they can use. My first attempt at this is here: https://github.com/MargaretAN9/Image-sequencer/blob/master/image%20sequence%20colormaps%20v7.pptx

-Colorbars were tested/generated using image sequencer “gradient colormap”

-I can create new colormaps but figured it was best to see how these work first.

-Hopefully, @tech4GT can check all this and @jywarren can load the colormap.js file.

@tech4GT
Copy link
Member

tech4GT commented Oct 13, 2018

Great work @MargaretAN9 I'm a little busy right now but will get to this as soon as possible!! Thanks!! 😄

@jywarren
Copy link
Member Author

jywarren commented Oct 13, 2018 via email

@jywarren
Copy link
Member Author

OK, this is super. @MargaretAN9 have you opened a pull request yet? I think we could essentially do this in 2 smaller parts - the back-end code in one, where you have to specify based on just submitting a string. We currently display the names of colormaps here:

image

However, I think we ought to begin displaying the actual gradients in the HTML UI. I'm not sure, but I don't think this can be done in a <select> menu the way we currently have set up. Maybe we could use something like this: https://github.com/websemantics/Image-Select or if there's a simpler but still compact solution in Bootstrap (https://getbootstrap.com/docs/3.3/) we could consider that. But let's do this kind of more complex interface in a separate PR, so we can merge this part sooner (esp. with the gradient fix!) Sound good?

(could you post a screenshot of your PPT in a comment? I'm having trouble viewing it, thanks!)

@MargaretAN9
Copy link

@jywarren, @tech4GT

@jywarren
Copy link
Member Author

Ah! I missed this because it was opened against jywarren, but should be publiclab... moving to #475

AWESOME

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants