UNPKG

speck-renderer

Version:

Browser-based WebGL molecule renderer with the goal of producing figures that are as attractive as they are practical.

49 lines (32 loc) 2.17 kB
<p align="center"> <img src="https://raw.githubusercontent.com/wwwtyro/speck/gh-pages/static/screenshots/demo-2.png"> </p> #### Ambient Occlusion Ambient occlusion provides much more information about molecule structure than simple direct lighting. It's incredibly useful for large and small molecule viewing alike. Easily Speck's most important feature. <p align="center"> <img src="https://raw.githubusercontent.com/wwwtyro/speck/gh-pages/static/screenshots/demo-9.png"> </p> #### Pixel-perfect atoms and bonds Speck renders atoms and bonds not with polygons, but with imposters. This means you can zoom in as close as you like and surfaces remain smooth, not faceted. <p align="center"> <img src="https://raw.githubusercontent.com/wwwtyro/speck/gh-pages/static/screenshots/demo-0.png"> </p> #### Depth-aware outlines Speck can render atom outlines that are depth-aware. Instead of making your molecule appear to be a collection of flat circles, depth-aware outlines provide cues to the viewer that convey information about the molecular structure. <p align="center"> <img src="https://raw.githubusercontent.com/wwwtyro/speck/gh-pages/static/screenshots/demo-5.png"> </p> #### Depth of field Render a more attractive figure while simultaneously drawing your viewer's eye to a region you want to highlight. <p align="center"> <img src="https://raw.githubusercontent.com/wwwtyro/speck/gh-pages/static/screenshots/demo-1.png"> </p> #### Mix and match rendering options Speck goes to great lengths to decouple rendering options, so that you have the flexibility to present your data in the most clear and attractive way. <p align="center"> <img src="https://raw.githubusercontent.com/wwwtyro/speck/gh-pages/static/screenshots/demo-3.png"> <img src="https://raw.githubusercontent.com/wwwtyro/speck/gh-pages/static/screenshots/demo-6.png"> <img src="https://raw.githubusercontent.com/wwwtyro/speck/gh-pages/static/screenshots/demo-4.png"> <img src="https://raw.githubusercontent.com/wwwtyro/speck/gh-pages/static/screenshots/demo-7.png"> <img src="https://raw.githubusercontent.com/wwwtyro/speck/gh-pages/static/screenshots/demo-8.png"> </p>