react-molviewer
A React application for displaying molecules using JSmol.
How to run
With Yarn
- install dependencies
yarn install
- build
yarn build
Run in development mode
yarn start
default port is 8080
Demo: show the molecule
- open the browser and go to http://localhost:8080
How to use react-molviewer in your application
- import the component
import { MolViewer } from 'react-molviewer';- render the component with props
<MolViewer ... />Props
| Name | Type | Description | Required |
|---|---|---|---|
| molContent | blob | the content of the molecule | yes |
| viewType | string | the identifier type of the view, it is a string starts with 'mol', e.g. 'mol_caffeine' | yes |
| fnInit | function | is used to notify the parent component that the viewer has started loading the molecule | no |
| fnCb | function | is used to notify the parent component that the viewer has completed loading the molecule | no |
Contact Us 📧
If you have any questions or suggestions, please contact the contributors:
Thank you JSmol
JSmol: an open-source HTML5 viewer for chemical structures in 3D