Skip to content

visualize chroma geometries using three.js and OpenGL

Notifications You must be signed in to change notification settings

youngsm/chromaCamera

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

14 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

ChromaCamera (Experimental)

This tool was built of a need to quickly visualize chroma geometries without having to use a CUDA-equipped GPU. Instead of running a full raytracing simulation to generate an image, like in how chroma.Camera is implemented, the optimized three.js library is used to render the 3D scene quickly in the browser using OpenGL. Geometries must first be converted to the .json format using the jsonGeometry class to be loaded into js.

A demo of this tool can be found on my website at https://samy.ng/chroma-cam. Click "load dichroicon" in the top right of the screen; shown will be the exact setup described in the paper Spectral Photon Sorting For Large-Scale Cherenkov and Scintillation Detectors. You can see an example of the structure of the json file in static/geo/benchtop_dichroicon.json. The json file contains a list of unique meshes, their colors, and their positions for placement in the scene.

Like in chroma, solid instancing has been implemented, so that no single triangle in a scene is unneccesarily duplicated more than once. This allows for very large scenes using copies of the same couple meshes to be rendered quickly, and relatively small json files. For example, a full neutrino detector geometry outfitted with around 60,000 PMTs and 30,000 light concentrators is rendered on my M1 MacBook Pro at around 40 fps in Microsoft Edge, and has a json file size of 7.1 MB. In chroma, this entire geometry loaded on the GPU requires around 20 GB of VRAM. In the browser, only around 80 MB of memory is used.

To ensure good performance, geometries with many large meshes are automatically simplified using the three.js library's SimplifyModifier after being uploaded. All computations are done solely on the client side, so no data is sent to any server.

Usage

To use this tool, you must first convert your chroma geometry to the json format. This can be done using the jsonGeometry class:

import json
from geometry import jsonGeometry

chroma_geo = <some chroma.Geometry or chroma.detector object>
json_geo = jsonGeometry(chroma_geo)
json_data = json_geo.as_json()
with open('chroma_geo.json', 'w') as f:
    json.dump(json_data, f)

To load the geometry into the browser, you can start up a local Flask server serving the index.html file in the templates/ directory:

$ python server.py

Then, navigate to localhost:5000 in your browser and upload chroma_geo.json. Alternatively, the exact page is being hosted on my Github pages site, https://samy.ng/chroma-cam.

About

visualize chroma geometries using three.js and OpenGL

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published