Home › Forums › Programming › Adding a color picker
- This topic has 6 replies, 2 voices, and was last updated 4 years, 5 months ago by cameronm125.
-
AuthorPosts
-
2020-06-25 at 10:12 pm #29292cameronm125Participant
Whenever I add code into my project.js file the app won’t open and neither will puzzles. I’ve tried some color pickers I found online as well as giving this one a whirl (https://cdn.soft8soft.com/demo/examples/index.html#webgl_materials_nodes), but its the same result every time. I’d like to have something that resembles Blender’s RGB node to change the color of selected objects. I’m not the best with code so help is greatly appreciated.
2020-06-26 at 4:33 am #29293GLiFTeKCustomerUse a color ramp node with 4 points in it’s spectrum being 1st RGB (RED) 1.0.O 2nd (GREEN) 0.1.0 3rd (BLUE) 0.0.1. 4th (RED) 1.0.0.
Put the 2 reds at each end.
The green at .33 the blue at .66.Plug a value node into the Fac of the color ramp. Name it color in both fields.
Use that color value to cycle through colors in your material.
Use creative inputs linked to the value node for user color change input.Ie: drag object changes variable.
material color value changes from variable. (Variable can be processed)
Visit the GLIFTEK Verge3D Plugins Store!
GLIFTEK.com for Plugin Documentation & LIVE DEMOS!
LIKE The GLIFTEK Facebook Page for updates!
Join the Verge 3D Discord Server!
plz share Discord link & on your signature!2020-06-26 at 2:22 pm #29314cameronm125ParticipantCould you elaborate more on the UI side of this? I currently have a scooter configurator type setup just FYI.
Dragging seems to just change it to the specified value in puzzles. I tried setting the factor on the color ramp to increase by .1 every time you click on an object but it doesn’t seem that practical and it doesn’t loop back around (ends on red). Fine-tuning hue and saturation will be important for the end result. Is there a way to link an xy value to the dragging action?2020-06-26 at 4:46 pm #29316cameronm125ParticipantThe “basic/standard” example here is basically exactly what I need. A color picker and a few sliders: https://cdn.soft8soft.com/demo/examples/index.html#webgl_materials_nodes
I’m having trouble implementing it though, I’ve never worked with code before.
2020-06-27 at 10:02 am #29322GLiFTeKCustomerYou can use logic and numbers greater/less than puzzles (or nodes) to tell the value to return to 0 if the user brings it over 1.0.
To have the xyz values change you attach the value variable to the get position of your slider and put a constraint (in blender or puzzles ) on the axis you don’t want moved.
You can also make a handle parented to a rotating empty that goes in a continuous circle to change values.I’ll post an example when I have time.
I saw someone post an os native color picker here once. Can’t find it though.
The controls in your example see three.js controls. I haven’t played with those yet.
As far as I know they’re built in and aren’t attached to any specific variables automatically.
Visit the GLIFTEK Verge3D Plugins Store!
GLIFTEK.com for Plugin Documentation & LIVE DEMOS!
LIKE The GLIFTEK Facebook Page for updates!
Join the Verge 3D Discord Server!
plz share Discord link & on your signature!2020-06-27 at 3:43 pm #29327GLiFTeKCustomerhey i put up a color levels interface project over in the tutorials section of the forum…
GlifTek Examples: “Color Levels: COLOR RAMP”enjoy!
Visit the GLIFTEK Verge3D Plugins Store!
GLIFTEK.com for Plugin Documentation & LIVE DEMOS!
LIKE The GLIFTEK Facebook Page for updates!
Join the Verge 3D Discord Server!
plz share Discord link & on your signature!2020-06-29 at 1:19 pm #29374cameronm125ParticipantGlifTek this is perfect. Thank you!
-
AuthorPosts
- You must be logged in to reply to this topic.