-
Notifications
You must be signed in to change notification settings - Fork 61
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Using ChemWidget.Viewer3D in a React/Webpack/npm or yarn environment #271
Comments
Hi @richardoptibrium, when using with import * as THREE from 'three';
import {Kekule} from 'kekule';
Kekule.externalResourceManager.register('three.js', THREE); After that, the 3D molecule should be displayed properly. |
Thank you partridgejiang, I'll try that now. |
I get the following unfortunately: Uncaught TypeError: e.getAttribute is not a function |
But that was caused by me trying to use a React reference instead of document.getElementById. |
The viewer widget can not be built on React virtual DOM, so here you have to pass concrete DOM element to let viewer = new Kekule.ChemWidget.Viewer3D(document); // the concrete document object of DOM
viewer.appendToElem(document.body); |
Hi,
I'm trying to see how possible it is to integrate the Kekule 3D viewer into a React component. I can:
and attempt to:
But I get: "Three.js not available, try to include it through the <script> tag or import the module by Kekule.externalResourceManager.register method" I have tried installing 'three' and 'react-threejs' neither with much success so far.
Can anyone offer a code sample CodePen or similar that illustrates how I can do this please? I don't want to have to add a script tag for three.js if I can help it.
My objective is just to be able to load smiles structures and view in 3d, I already tried the Kekule molecule editor so it seems to make sense to try the Kekule 3d offering too.
The text was updated successfully, but these errors were encountered: