publiclab / image-sequencer

A pure JavaScript sequential image processing system, inspired by storyboards
https://sequencer.publiclab.org
GNU General Public License v3.0
110 stars 208 forks source link

Error in default color map #332

Closed jywarren closed 5 years ago

jywarren commented 5 years ago

https://github.com/publiclab/image-sequencer/blob/cce65141d284d12fbb5c6e5331a29c72cb17eab8/src/modules/Colormap/Colormap.js#L59-L63

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

image

gitmate[bot] commented 5 years ago

GitMate.io thinks possibly related issues are https://github.com/publiclab/image-sequencer/issues/147 (replaceImage() returns error), https://github.com/publiclab/image-sequencer/issues/278 (Module not found error in demo), https://github.com/publiclab/image-sequencer/issues/281 (Skip writing defaults into toString), and https://github.com/publiclab/image-sequencer/issues/145 ("reader is not defined" error on demo).

gitmate[bot] commented 5 years ago

GitMate.io thinks possibly related issues are https://github.com/publiclab/image-sequencer/issues/147 (replaceImage() returns error), https://github.com/publiclab/image-sequencer/issues/278 (Module not found error in demo), https://github.com/publiclab/image-sequencer/issues/281 (Skip writing defaults into toString), and https://github.com/publiclab/image-sequencer/issues/145 ("reader is not defined" error on demo).

MargaretAN9 commented 5 years ago

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 commented 5 years ago

ah cool, yes we can add in the NDVI colormap, i'm not sure why it wasn't included. What does it look like? For the others, if we can figure out how to reproduce them we could add them, they look cool... I wonder if there are any programmatic descriptions of how they are generated?

On Wed, Sep 12, 2018 at 12:12 AM MargaretAN9 notifications@github.com wrote:

Questions: @jywarren https://github.com/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? [image: slide3] https://user-images.githubusercontent.com/37722313/45401735-08f0af00-b620-11e8-830e-1c1f4b7ae083.JPG

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] ]

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/publiclab/image-sequencer/issues/332#issuecomment-420505927, or mute the thread https://github.com/notifications/unsubscribe-auth/AABfJ-NnYGKh3j7ZDyhUGkr23b95gSmxks5uaImJgaJpZM4Whnar .

MargaretAN9 commented 5 years ago

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

jywarren commented 5 years ago

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

https://github.com/publiclab/image-sequencer/blob/cce65141d284d12fbb5c6e5331a29c72cb17eab8/src/modules/Colormap/Colormap.js#L14-L22

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 commented 5 years ago

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

https://github.com/publiclab/image-sequencer/blob/88364decf6a6111a0be31fd98010576d5c6f918e/src/modules/Brightness/Module.js#L23

tech4GT commented 5 years ago

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

MargaretAN9 commented 5 years ago

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 commented 5 years ago

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

MargaretAN9 commented 5 years ago

@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 commented 5 years ago

@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 commented 5 years ago

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

tech4GT commented 5 years ago

Awesome!!

MargaretAN9 commented 5 years ago

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 commented 5 years ago

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

jywarren commented 5 years ago

Ohhhh this is amazing. I'm at an event in China right now but will look as soon as I can!!!!!

On Sun, Oct 14, 2018, 12:07 AM Varun Gupta notifications@github.com wrote:

Great work @MargaretAN9 https://github.com/MargaretAN9 I'm a little busy right now but will get to this as soon as possible!! Thanks!! 😄

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/publiclab/image-sequencer/issues/332#issuecomment-429553600, or mute the thread https://github.com/notifications/unsubscribe-auth/AABfJ0nR_anP96kqwWqJrq9OQYgPNdg-ks5ukg-mgaJpZM4Whnar .

jywarren commented 5 years ago

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 commented 5 years ago

@jywarren, @tech4GT

jywarren commented 5 years ago

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

AWESOME