
H3Stogram Help & Info

What is this?
H3stogram is an interactive 3D depiction of an image's color distribution (histogram) in the RGB space. It is developed in javascript/HTML5 on the Threejs framework, which wraps on the WebGL api. For more information see the article in DoF ideas
Contact
If you are interested in H3stogram as a user, photographer or developer, you can get in touch with me through DoFideas and GitHub
Play with it!
- Pick an image from the bottom fringe. This will load it into the canvas on the top left corner, and from there into the cube in the center of the screen
- Navigate the 3D histogram
- Left button + drag --> Circle around
- Mouse wheel --> Dolly
- Right button + drag --> Travelling
- Play with the visualization parameters on the controls right column (Visualization folder)
- Select brick (cube) or bubble elements
- Select solid or wireframe elements
- Show only the predominant colors by increasing the Threshold value
- Choose the opacity and size of the elements
- Change the resolution of the 3d histogram (Histogram folder)
- Bits Per Channel: 4 is the default. Try 5 while it does not get very sluggish
- Bytes Per Point: 2 is the default and recommended value (feel free to experiment)
- Navigate to highlighted viewpoints (Viewpoint folder)
- Color Lights --> Color wheel view, from the white corner of the RGB cube
- Color Shadows --> Color wheel view, from the black corner of the RGB cube
- BW Cold --> View of the cube's black-white long diagonal, from the cold colors edge (blue-cyan)
- BW Warm --> View of the cube's black-white long diagonal, from the warm colors edge (red-yellow)
- Rest --> Frontal view
Upcoming...
- Highlight the clicked pixel's color in the h3stogram
- Contrast, saturation and other transformations in real time
- Upload custom image
- Capture webcam
- LAB color space
- More user ideas