3dmol / 3Dmol.js

WebGL accelerated JavaScript molecular graphics library
https://3dmol.org/
Other
794 stars 194 forks source link

[Question] how to use the clickable interaction #737

Closed Kvieta1990 closed 10 months ago

Kvieta1990 commented 10 months ago

I am trying to learn how to enable the clickable interactivity to get the molecular information. For example, if I click on an atom, I want to show the label. Also, if I click on a bond, I want to show the bond length. I suppose we do have such capabilities but it seems that I could not find a good starting point to learn how-to. Could you please help provide a minimal example about this? Thank you!

BTW, I was using Python flask together with the 3Dmol.js for the implementation, i.e., I pass the pdb information from Python flask to 3dmol for visualization.

dkoes commented 10 months ago

There is an example of drawing a label in the documentation for setClickable: https://3dmol.org/doc/GLViewer.html#setClickable Bonds aren't click targets, just atoms, but example code for measuring and displaying distances can be found here: https://github.com/3dmol/3Dmol.js/issues/707

Kvieta1990 commented 10 months ago

that is really helpful! thank you!