Code Monkey home page Code Monkey logo

icn3d's Introduction

iCn3D Structure Viewer

About iCn3D

"I see in 3D" (iCn3D) Structure Viewer is not only a web-based 3D viewer, but also a structure analysis tool interactively or in the batch mode using NodeJS scripts based on the npm package icn3d. iCn3D synchronizes the display of 3D structure, 2D interaction, and 1D sequences and annotations. Users' custom display can be saved in a short URL or a PNG image. The complete package of iCn3D including Three.js and jQuery is in the directory "dist" after you get the source code with the "Code" button. You can click the file "index.html" in the "dist" directory to launch a local version of iCn3D.

  • View a 3D structure in iCn3D: Open the link https://structure.ncbi.nlm.nih.gov/icn3d, input a PDB ID, and click "Load". You can also click "File" menu to "Open File" or input other IDs.

    As mentioned in the menu "Help > Transformation Hints", you can use Left mouse button for rotation, Middle mouse wheel for zooming, and Right mouse button for translation.

    The most important point about using iCn3D is the current selection. Any operations on color, style, etc. are working on the current selection. By default, all atoms are selected. Once you select any subset, your operation will work ONLY on the subset. You can switch the selection using the toggle next to the Help menu.

  • VR and AR views in iCn3D: The Virtual Reality (VR) and Augmented Reality (AR) views are shown in this video.

    You can open a bowser in your Virtual Reality (VR) headset and view a 3D structure in iCn3D. Then click the button "Enter VR" at the bottom center of your browser to enter the VR view. You can select residues with the trigger button, open the menu with the squeeze button and click menus with the trigger, navigate with the thumbstick pressed forward/backward and press the trigger. There are menus for Select, Style, Color, and Analysis. You need to make one selection before clicking the Interaction button and make two selections before clicking the Distance button.

    The Augmented Reality (AR) view is currently only available to iCn3D views in Chrome browser using Android phones. You can view a 3D structure in iCn3D and click the button "START AR" at the bottom center to see the 3D structure in your surroundings. You can tap twice quickly on the screen to locate a minimized 3D structure in your tapped location, and pinch to scale the 3D structure.

  • Create custom 3D view: You first open a structure in "File" menu, then select a subset in "Select" menu, view only the selected subset by clicking "View Only Selection" in View menu, finally change styles or colors in "Style" and "Color" menus.

    Each operation has a corresponding command as listed at https://www.ncbi.nlm.nih.gov/Structure/icn3d/icn3d.html#commands. These commands will show up in the command/log window right beneath the 3D display. To view all previous commands, you can click "Share Link" in "File" menu. Both the original URL and the short URL can be used to display your custom view.

  • Save your work: You can save "iCn3D PNG Image" in the menu "File > Save File". Both the PNG file and an HTML file are saved. Click the HTML file to see the PNG image, which is linked to the custom display via a shorten URL. The downloaded "iCn3D PNG Image" itself can also be used as an input in the menu "File > Open File" to reproduce the custom display. You can combine these HTML files to generate your own galleries.

    The "iCn3D PNG Image" can also be stored in a web server (e.g., https://figshare.com, https://zenodo.org). The PNG image can then be loaded into iCn3D via the URL, e.g., https://www.ncbi.nlm.nih.gov/Structure/icn3d/?type=icn3dpng&url=https://api.figshare.com/v2/file/download/39125801, or https://www.ncbi.nlm.nih.gov/Structure/icn3d/?type=icn3dpng&url=https://zenodo.org/api/files/1a3325c8-0c84-4f1e-be2c-c143b08c6563/3GVU-XCxR6fSTmXHxR3o1A.png, where the URL of the PNG image is retrieved from the JSON blob at https://zenodo.org/api/records/7599970.

    You can also save "Share Link" in "File" menu to share with your colleagues. These URLs are lifelong. You can click "Replay Each Step > On" in "File" menu to learn how a custom display was generated.

    All "Share Link" URLs can show the original view using the archived version of iCn3D by clicking "Open File > Share Link in Archived Ver." in "File" menu.

  • Python scripts to batch process structures: Python scripts can be used to process 3D structures (e.g., export secondary structures, PNG images, or analysis output) in batch mode. The example scripts are at icn3dpython.

  • Node.js scripts using npm "icn3d" to batch process structures: You can download npm "icn3d" package to write Node.js scripts by calling iCn3D functions. These scripts can be used to process 3D structures (e.g., calculate interactions) in batch mode. The example scripts are at icn3dnode.

  • Annotations for AlphaFold structures: For any custom structures such as AlphaFold structures, you can show conserved domain and 3D domain annotations. For AlphaFold structures, you can also show SNP and ClinVar annotations.

  • Align AlphaFold structures: You can align AlphaFold structures or PDB structures with the menu "File > Align > Multiple Chains" or "File > Align > Protein Complexes > Two AlphaFold Structures". You can also load any structures as usual, then load your custom PDB file with the menu "File > Open File > PDB File (appendable)", then relaign these structures with the menu "File > Realign Selection > by Structure Alignment".

  • Alternate SNPs in 3D: You can alternate in 3D wild type and mutant of SNPs by clicking the menu "Analysis > Sequences & Annotations", the tab "Details", the checkbox "SNP", and mouseover on SNPs.

  • DelPhi Electrostatic Potential: You can view the DelPhi Electrostatic Potential in the menu "Analysis > DelPhi Potential".

  • Isoforms and Exons: You can view the Isoforms and Exons by clicking the button "Add Track" in the "Sequences & Annotations" window via the menu "Analysis > Sequences & Annotations".

  • Symmetry: You can show precalculated symmetry, or calculate symmetry dynamically using SymD.

  • Use iCn3D in Jupyter Notebook: You can use iCn3D in Jupyter Notebook with the widget "icn3dpy". The instructions are at pypi.org/project/icn3dpy.

  • 2D Cartoons in the chain, domain, and secondary structure levels: You can use click "Analysis > 2D Cartoon" to show 2D Cartoons in the chain, domain, and secondary structure levels.

  • Contact Map for any Selected Residues: You can click the menu "Analysis > Contact Map" to show the interactive contact map for any selected residues. You can export the map in PNG or SVG.

  • More features are listed at www.ncbi.nlm.nih.gov/Structure/icn3d/icn3d.html: binding site, interaction interface, 3D printing, transmembrane proteins, surface, EM map, electron density map from MTZ, CCP4, or DSN6, 1D sequences and 2D interactions, align two structures, align multiple chains, align a protein sequence to a structure, realign, custom tracks, force-directed graph for interactions, solvent accessible surface area, etc.

Embed iCn3D with iframe or JavaScript libraries

iCn3D can be embedded in a web page by including the URL in HTML iframe, e.g. <iframe src="https://www.ncbi.nlm.nih.gov/Structure/icn3d/?mmdbid=1tup&width=300&height=300&showcommand=0&mobilemenu=1&showtitle=0" width="320" height="320" style="border:none"></iframe>. This method always shows the most recent version of iCn3D.

To embed iCn3D with JavaScript libraries, the following libraries need to be included: jQuery, jQuery UI, Three.js, and iCn3D library. An html div tag to hold the 3D viewer is added. The iCn3D widget is initialized with the custom defined parameter "cfg": "let icn3dui = new icn3d.iCn3DUI(cfg); await icn3dui.show3DStructure();". Multiple iCn3D widgets can be embedded in a single page. Please see the source code of the example page for reference.

Users can choose to show the most recent version of iCn3D, or a locked version of iCn3D. To show the most recent version, use the library files without the version postfix as shown in the iCn3D Doc page. To show a locked version, use the library files with the version postfix as shown in the source code of iCn3D page. If the input is provided as an MMDB ID, both library files and backend cgis are versioned so that the 3D display will be stable.

Data Sources

iCn3D accepts the following IDs:

iCn3D also accepts the following file types: PDB, mmCIF, Mol2, SDF, XYZ, and iCn3D PNG. The files can be passed through a url, e.g., https://www.ncbi.nlm.nih.gov/Structure/icn3d/?type=pdb&url=https://storage.googleapis.com/membranome-assets/pdb_files/proteins/FCG2A_HUMAN.pdb, https://www.ncbi.nlm.nih.gov/Structure/icn3d/?type=mmcif&url=https://files.rcsb.org/download/1GPK.cif, or https://www.ncbi.nlm.nih.gov/Structure/icn3d/?type=icn3dpng&url=https://api.figshare.com/v2/file/download/39125801. See the help page or the Doc page for more details.

Third-party libraries used in Frontend

  • jQuery and jQuery UI: used as a general tool to write Javascript code. Some jQuery UI features are used.
  • Three.js: used to set up the 3D view.
  • Force-Directed Graph: "2D Graph (Force-Directed)" in the menu "Analysis > Interactions" is based on Force-Directed Graph.

Third-party libraries used in Backend

  • DelPhi: used to calculate electrostatic potential dynamically and is licensed from Columbia University.
  • DelPhiPKa: used to add hydrogens and partial charges to proteins and nucleotides.
  • Open Babel: used to add hydrogens to ligands.
  • Antechamber: used to add partial charges to ligands.
  • SymD: used to calculate symmetry dynamically.
  • scap/Jackal: used to predict side chain conformation dynamically.
  • TM-align: used to align two chains of 3D structures.

Tools based on

  • iview: The drawing of 3D objects is based on iview.
  • GLmol: The drawing of nucleotides cartoon is based on GLmol.
  • 3Dmol: The surface generation and labeling are based on 3Dmol.
  • NGL Viewer: The Imposter shaders are based on NGL Viewer.
  • LiteMol: The parser of EM density data from PDBe is based on LiteMol.
  • py3Dmol: The Jupyter Notebook widget "icn3dpy" is based on py3Dmol.
  • Orientations of Proteins in Membranes (OPM): The membrane data of transmembrane proteins are from OPM.
  • Membranome: For AlphaFold Structures, the membrane data of single-spanning transmembrane proteins are from Membranome.
  • Post-Translational Modification (PTM): The PTM data are from UniProt.
  • UglyMol: The electron density maps from CCP4 map or MTZ format are based on UglyMol.

Building

If you want to build your code easily, you'll need to install nodejs and npm.

Next, clone this repository, and then perform the following setup steps in your working copy of icn3d.

npm config set -g production false
npm install -g gulp
npm install
npm install [email protected]

delete package-lock.json

The first line sets the npm default as dev so that all modules will be installed. The second line installs the gulp build tool globally, making the gulp command available on the command line. The third line install all modules. The fourth line changes the version of uglify-js to an old version, which does not compress class names. The last line may be required for a fresh build to remove old package-lock.json.

You only have to perform the above steps once, to set up your working directory. From then on, to build, simply enter:

gulp

Contact

Please send all comments to [email protected].

Citing

Bioinformatics. 2020 Jan 1;36(1):131-135. doi: 10.1093/bioinformatics/btz502.

To cite iCn3D, please reference:

Wang J, Youkharibache P, Zhang D, Lanczycki CJ, Geer RC, Madej T, Phan L, Ward M, Lu S, Marchler GH, Wang Y, Bryant SH, Geer LY, Marchler-Bauer A. iCn3D, a Web-based 3D Viewer for Sharing 1D/2D/3D Representations of Biomolecular Structures. Bioinformatics. 2020 Jan 1; 36(1):131-135. (Epub 2019 June 20.) doi: 10.1093/bioinformatics/btz502. PubMed PMID: 31218344, Full Text at Oxford Academic

Wang J, Youkharibache P, Marchler-Bauer A, Lanczycki C, Zhang D, Lu S, Madej T, Marchler GH, Cheng T, Chong LC, Zhao S, Yang K, Lin J, Cheng Z, Dunn R, Malkaram SA, Tai C-H, Enoma D, Busby B, Johnson NL, Tabaro F, Song G, Ge Y. iCn3D: From Web-Based 3D Viewer to Structural Analysis Tool in Batch Mode. Front. Mol. Biosci. 2022 9:831740. (Epub 2022 Feb 17.) doi: 10.3389/fmolb.2022.831740. PubMed PMID: 35252351, Full Text at Frontiers

icn3d's People

Contributors

jiywang3 avatar klortho avatar lewisg-ncbi avatar th3linja avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

icn3d's Issues

RAINBOW coloring

does not seem to go over the full color spectrum from N>C

Also default should be by chain - right now it takes the assembly which does not really make the point

Inconsistent selection behavior Sequences & Annotations window

  1. I open 7OZV.
  2. I open the Analysis window and choose Seq & Annotations.
  3. If the Summary Tab is selected in the Sequences and Annotations window, I can select a nucleotide chain by clicking the name.
  4. If the Details Tab is selection, clicking the name of a nucleotide chain (or protein chain) doesn't do anything.

Result: Clicking the name of a chain only selects the chain when the Summary tab is selected.

But here's how I think it should behave:

Expectation: Clicking the name of a chain will select the chain when either the Summary or Details tab is selected.

Problem with representation of amino acid sequence when there is incomplete data

The structure 1IGY has a two regions where a portion of the structure is missing. That part is fine.

The problem is that the sequence that corresponds to the missing regions is not shown correctly. The last amino acid at one end is D229. I highlighted this in the attached structure image and the attached sequence image. In the sequence, D229 is shown as if it is adjacent to C235. Instead of showing the D229 next to C235 there should be something to indicate that these amino acids are missing.

Cn3D used to handle this problem by inserting lower case n's to show that part of the sequence was missing. iCn3D is ignoring the missing 6 amino acids and displaying the sequence like they're still there.

PyMol handles this problem by putting dashes in the sequence where amino acids are missing. This image is attached also.

I liked the way Cn3D did this because the letters showed that there was something located at that position. In either case, it would be good to have iCn3D show the sequence correctly by including either n's or dashes to represent the missing residues.

I think the way PyMol handles this part of the sequence display well. It's important to show where the amino acids are missing because then we would show where the data are uncertain.

D229_structure

sequence

PyMol_sequence_view

issue with state files

Hi all -
First I want to thank everyone for this great tool. I teach college organic chemistry and use this to show protein-drug interactions. I love PyMol but for teaching, this is much more very ideal for teaching purposes and something students can use at home.

I noticed an issue with "state files" not saving all the key details of the state, sort of like how a PyMol project file works. Here are three attachments
(a) a PNG that was created showing biotin-streptavidin and its key interactions
(b) the statefile that was saved after step (a)
(c) after I re-loaded the statefile, I create a new PNG. I would imagine it should be the same as (a) but it is different in color, and the key residues are not shown.

It appears that not all aspects of the "state" are being saved.
Thanks!!!! -marc anderson (SFSU Department of Chemistry)

1STP-initial

1STP_statefile.txt

1STP-later

The Rainbow coloring in iCn3D isn't behaving correctly

The Rainbow coloring style should work in the following way - the amino terminus of each protein chain (or the 5' end of each nucleic acid chain) should be red and the carboxyl terminus (or 3' end) should be violet.

When colored correctly, a structure like 1IGY will show the amino ends of all four chains in red.

Each chain needs to be colored independently because each chain is a separate molecule.

Instead it looks like the coloring is treating the four chains as part of a single concatenated molecule.

Clearing a selection reveals hidden parts of a structure

Goal: I would like students to be able to look at a double-stranded piece of DNA, colored by residue, with the protein part of the structure hidden.

Procedure:

  1. Opened structure 7OZV
  2. Selected both chains of DNA in Summary tab of the Sequences and Annotations window.
  3. Opened Color, chose Residue > Default
  4. Opened View, chose View Selection (in order to hide the protein.
  5. But the sequences in the Sequences and Annotations Details window have a yellow highlight - so opened Select and chose Clear Selection

Expectation - the yellow color will disappear and I should see the DNA without the protein in structure window.
Result: The yellow color disappears but all the objects that were hidden in step 4 reappear.

load url syntax

hello, i was able to quickly display the icn3d viewer on my own web server. however, i have not been able to load a "local" pdb file into the viewer using either the command prompt OR coding the path into the html page that initializes the viewer. yes i was able to load the pdb file using the popup menu. i believe the file type info was missing the very first time. so what should be the [???] below?

(1) use command prompt: > load url [???] // manual list only the path inside [???] no type info
(2) within a generated html: var cfg = {..., url: [???], ...};

PS: i learned that once i used the popup menu one time, the file type was "remembered". so from then on i could simply type > load url [local server path to pdb file] and it would work and type not needed. thanks much.

Custom tooltip information

Is it possible to append data to the tooltips when hovering over a residue?
image
For example, if I add custom coloring (similar to the b factor coloring), is there a built in function to display the values assigned to each residue in the tooltip?

Feature request: make carbon a different color than hydrogen

When I use the atom coloring style, carbons and hydrogens are the same color. I attached an image that shows how they appear to be the same color.

It would really help my students if they could distinguish between the carbons and the hydrogens.

I think the carbons might be a grey color, but it would help if they were a couple of shades darker than the hydrogens.

nucleotide

.

surfacing multiple objects

AN issue in surfacing superimposed molecules:
it creates a composite surface for both molecules the when you "alternate" between the two you alternate only the backbone representation, not the surfae representation.
The surface should be linked to each molecule and one could see alternatively the surface of one vcs the surfave of the other.
This feature may also be useful in "alternating" viewing surfaces of 2 molecules/chains forming an interface (or any set in generalizing the concept)

Highlights disappear when I choose View selection - but molecule is still selected

I did the following:

  1. Selected a single chain of 7ODF. Result: the chain is selected and has a yellow highlight.
  2. Changed the drawing style to Ball and Stick. Result: Each atom has a yellow highlight.
  3. Change the coloring style to Atom. Result: Each atom has a yellow highlight.
  4. Chose View Selected.

Result: Other molecules are hidden. The yellow highlight disappears from the structure window, but the sequence is still highlighted.

Problem: I think both the structure and the sequence should stay highlighted until I either toggle highlights or clear the selection.

load mmdb 7ODF | parameters &mmdbid=7ODF
set pk atom
view annotations
set annotation cdd
select chain 7ODF_A
style proteins ball and stick
color atom
show selection

Spectrum coloring

Cn3D has a Rainbow coloring style that colors chains from the 5' end to the 3' end, or the amino end to the carboxyl end with the order ROYGBIV. ( red orange yellow blue indigo violet)

I noticed today that this order is reversed when I use the Spectrum color in iCn3D. Is there a reason why the order has changed? If there isn't a good reason, can this be changed back to ROYGBIV like it was in Cn3D?

Defined set color doesn't update when changing colors

For example:
image
chain 7DDD_C is colored in white

I load the selection through defined set and perform Color > Unicolor > ... > Cyan. The 3d model does not update the first time and will only recolor the second time I pick cyan.

After that, I expect the text to change to cyan as well, but it remains the old color

image

7DDD_C is above AY.1 in white

Color legend for alphafold confidence

Hello,

Thank you very much for releasing iCn3D. I am checking the 3D protein structure predicted with alphafold2. I am evaluating the alphafold confidence color of the structure. Would you please let me know where I can find the color legend for the confidence?

With best wishes,

Timothy Ng

Distance calculation

The distance calculation function maybe it is not working correctly. After I made a selection of two residues in a different chain, I clicked on "Analysis," "Distance," and "between two sets." It opened a box, and I choose "selected" in both the first and second set. The result is always 0 angstrom of distance.

Licenses

I want to ask about the licensed software, e.g., Delphi. How did you get these licenses? If I intend to use iCn3D in my server, do I need to require permission to use them?

Simple example

Hi,

icn3d is great, nice work, but I am missing a simple example like this:

  1. load pdb from my server
  2. make a scene and
  3. visualize this pdb in a simple scene (without any other tools loaded).

Even in the simple examples provided, the scenes already inherit too many things (toolboxes).

I was thinking to load multiple proteins in one scene, display it with VR glasses, and let the users wonder around. The pdb files are already in my server and I do not want any ajax to load them from a remote server.

Best,
Dimitrios

Custom track coloring

The custom color via the UI is working great. Is there a way to do that using the js library? I am currently using:

ic.opts['color'] = 'align custom';
ic.setColorCls.setColorByOptions(ic.setColorCls.setColorByOptions(ic.opts, ic.hAtoms));

load pdb from URL - icn3d-3.2.1

Hi team,

I am interested in visualising PDB files by loading them from URL and have downloaded icn3d-3.2.1 for the same

When I open example.html (Embed Multiple iCn3D Viewers in One Page) in browser, all pdb structures are visible except the one being fetched by url.

div0 to div3 and div5 display respective pdb structures , however div4 (which uses url to fetch PDB) displays a empty black box.

Could you help me understand why loading PDB from url is not working ?
Are there any settings or configurations to be taken care of to have loading PDB from url functional ?

PDB, MMDB, Water, Interactions in iCn3D

This is a pending issue but it reveals a number of related issues on data and software.

  • We do not have water molecules in iCn3D when using MMDB
    If I switch to PDB it is OK as I can have waters BUT, if using PDB directly:

  • I lose 2D Interactions window

  • I also do not have Secondary Structure

  • "Structural Water:
    Also on 1D waters are in sequence (O.) attached to a chain (as in PDB) that is definitely a PDB issue and may not be that bad actually as it is linked to structure. It is an issue though to deal with it specifically in interactions (meaning drilling down).

It would be good to discuss some harmonization between PDB and MMDB and/or have MMDB have ALL data from PDB including water and the “alternate” but "official" secondary structure definition. The secondary structure is a broader issue than water – certainly it should be available when using PDB

Whether PDB or MMDB we need both the data and functionality to work identically.

Interactions – including water – are needed more and more as it becomes obvious with modern data that crystallographic water is part of the structure NOT ONLY inside a protein but mediating molecular interactions with ligands
As in the example used here 5IH2
https://www.ncbi.nlm.nih.gov/Structure/icn3d/full.html?showseq=1&pdbid=5ih2&buidx=1
(check the paper for the water story).

In the past we used to discard metal atoms while they are crucial in enzymes for example. Today we still discard water. I think a critical eye is needed.

Cheers!
Philippe

applyCommandCls.applyCommand() does not redraw

applyCommandCls.applyCommand() does not redraw the 3d view until the window is resized.

Example)
image

image
Commands are run using applyCommand(), but nothing visually changes. The console shows the commands

After changing the window size, the colors are updated:
image

Domains Information in iCn3D

Both Structural and CDD domain info should be available as an attribute of a domain but also within chains with multiple domains
Onegood use of that would be of course coloring, labeling ....

A place where it would be very useful would be in a table for a large system (as avalaible today as a selection table - with only chains names and # res in chain) we should/could have CDDs as a column and also structural domains [we may need to work on naming VAST domains to make it great, we may also enable nomenclaures to be added such as SCOP, maybe through a user interface - domain definitions as possibly sets that we can read in as well as save)

The info is pretty much available in MMDB pages ...

NPM Gulp does not deliver ready state ICn3D

When downloading and compiling the project from scratch, NPM Gulp does not produce a product ready for use. The following three files are afflicted or affecting the overall product in use:

  • icn3d_x.x.x.min.js (not compiled correctly - text comparison tested)
  • three_0.128.0.min.js (not compiled correctly - text comparison tested))
  • ui-bg_gloss-wave_55_5c9ccc_500x100.png (file not found)

image
image
image
image

View RNA pdb files

I have few pdb files generated for RNA using rnacomposer (http://rnacomposer.cs.put.poznan.pl/)

When I try to load these files in the viewer, 3D structure is not available

Thus, wanted to understand icn3d can visualize PDB files of proteins only ?

Following is the first of few lines of pdb file obtained through above site for input RNA sequence
MODEL 1
ATOM 1 HO5' G A 1 -0.154 -0.520 0.011 1.00 0.00 H
ATOM 2 O5' G A 1 0.395 -0.651 -0.766 1.00 0.00 O
ATOM 3 C5' G A 1 1.734 -0.303 -0.401 1.00 0.00 C
ATOM 4 H5' G A 1 1.995 0.660 -0.843 1.00 0.00 H
ATOM 5 H5'' G A 1 2.423 -1.059 -0.773 1.00 0.00 H
ATOM 6 C4' G A 1 1.874 -0.213 1.100 1.00 0.00 C
ATOM 7 H4' G A 1 2.937 -0.120 1.327 1.00 0.00 H
ATOM 8 O4' G A 1 1.077 0.908 1.575 1.00 0.00 O
ATOM 9 C1' G A 1 0.348 0.524 2.727 1.00 0.00 C
ATOM 10 H1' G A 1 0.480 1.314 3.467 1.00 0.00 H
ATOM 11 N9 G A 1 -1.067 0.463 2.376 1.00 0.00 N
ATOM 12 C4 G A 1 -2.077 -0.059 3.147 1.00 0.00 C
ATOM 13 N3 G A 1 -1.937 -0.607 4.371 1.00 0.00 N
ATOM 14 C2 G A 1 -3.090 -1.019 4.862 1.00 0.00 C
ATOM 15 N2 G A 1 -3.129 -1.581 6.073 1.00 0.00 N
ATOM 16 H21 G A 1 -2.267 -1.680 6.592 1.00 0.00 H
ATOM 17 H22 G A 1 -4.003 -1.883 6.471 1.00 0.00 H
ATOM 18 N1 G A 1 -4.289 -0.910 4.205 1.00 0.00 N
ATOM 19 H1 G A 1 -5.118 -1.258 4.659 1.00 0.00 H
ATOM 20 C6 G A 1 -4.459 -0.350 2.944 1.00 0.00 C
ATOM 21 O6 G A 1 -5.587 -0.299 2.442 1.00 0.00 O
ATOM 22 C5 G A 1 -3.227 0.103 2.403 1.00 0.00 C
ATOM 23 N7 G A 1 -2.946 0.716 1.189 1.00 0.00 N
ATOM 24 C8 G A 1 -1.657 0.910 1.218 1.00 0.00 C
ATOM 25 H8 G A 1 -1.107 1.376 0.414 1.00 0.00 H
ATOM 26 C2' G A 1 0.924 -0.809 3.199 1.00 0.00 C
ATOM 27 H2' G A 1 0.164 -1.430 3.679 1.00 0.00 H
ATOM 28 O2' G A 1 2.033 -0.551 4.040 1.00 0.00 O
ATOM 29 HO2' G A 1 2.677 -1.238 3.870 1.00 0.00 H
ATOM 30 C3' G A 1 1.362 -1.422 1.875 1.00 0.00 C

Schematics improvements

when a set of residues is selected but is disjoint, we shouls draw the chain even in non selected parts between highlighted/selected residues so that the structure shape/fold/secondary structure is still perceivable.
It is is like showing labels BUT automatically and also using that as a representation (as today) we can start showing INTERACTIONS as lines between interacting residues represented by ONLY they 1letter code

It would be great if that could work with at a minimum CA Trace but possibly also the ribbons
and schematics should be mixable with any other graphical representation.

The colors of chains and individual residues are not changing color in the sequence view

Expectation: The colors of residues in the sequence will match color in the structure.

With Cn3D and iCn3D (last year), I could select a color and see that coloring style reflected in both the structure and sequence.

First test: entire structure

  1. Structure 1NAJ (DNA)
  2. Opened the color menu.
  3. Pick charge

Result: This works correctly. Both the structure and the sequence turn red.

Second test: one chain

  1. Structure 1NAJ (DNA)
  2. Select chain A
  3. Opened the color menu.
  4. Pick charge

Result: This did not work correctly. The chain turned red in the structure but the sequence did not change color.

Third test: a single nucleotide

  1. Structure 1NAJ (DNA)
  2. Selected a single nucleotide (G16 chain B).
  3. Opened the color menu.
  4. Pick charge

Result: This did not work correctly. The nucleotide turned red in the structure but the sequence did not change color.

High usage of memory Ram and Problem with the Share link feature

Some of us from the IEDB team have been using iCn3D for a while, and we ran into a few issues that we thought might require your immediate attention. When we attempt to select individual residues multiple times, each time changing their style and color, the webpage crashes often. We used Google Chrome and Firefox, each on both Windows 10 and Ubuntu/Mac. On the windows 10 machine, when I try to select a few residues, around four residues selection and change their style and color, Google Chrome memory RAM usage goes up to 4 Gb. On Ubuntu, repeating the same steps using Google Chrome resulted in many crashes, making it impossible to continue. Using Firefox, I managed to finish the process, but the process is very slow, and the webpage freezes for a few seconds and the memory usage goes up to 5 Gb.

Another issue that we would like to raise is the 'Share link' feature. In continuing with the issue mentioned earlier, we saved the steps of selecting residues and changing their style/color into a state file. When we open a new iCn3D window and open the state file, it loads the structure in the desired representation and color. With the structure loaded, now when we click on 'Share Link', a link is created. However, when we open this link, we find that the custom representation is lost, and the structure is loaded in the original state. For example, the desired representation shows the structure as a surface. Still, on opening the link, the structure is no longer shown as a surface but as a cartoon/ribbon representation.

Bug on display selection with labels applied to another selection

This concerns label per residue, have not checked all options
(may be as designed - yet change design)

using label as opposed to Schematic
all labels of a selection appear even if another selection is displayed This does not happen with schematics
yet schematics cannot mix with other representations currently

See also the issue of colring of labels on a residue basis (unlike schematics that adopt the residue color)

Align Sequence to Structure is not working

I tried several things:

  1. Started with a FASTA sequence and single chain structure, when load is clicked I get a blank (black) viewer window.
  2. Next tried the default query (NP_001108451.1 to 1TSR_A) as a test. Same result as above - blank viewer window.
  3. Tried variants on 1. remove spaces - remove fasta header, add _A to 1AZI - no luck.
    The other alignment options - structure to structure, multiple chains - do work.

Screen Shot 2021-04-24 at 1 13 45 PM

Unable to select single nucleotide

I would like to select a single nucleotide in 7OZV from the sequence view.

  1. Opened Sequences & Annotations.
  2. Opened the Details tab.
  3. Chose the two nucleotide chains
  4. Chose View Selection in order to hide the protein.
  5. Clicked Toggle Highlights to remove the highlights.
  6. Used cursor to click the second X (X9) but when I click the chain, the whole sequence is highlighted. I can deselect a few bases by clicking and dragging but I'm not able to select a single base.

Expected behavior - I thought I should be able to click the cursor inside the sequence and select a single base. I also expected that I should be able to select additional bases by clicking and dragging.

Share Link issues

Epitope align

Hi team,

I have an epitope, and I want to match that sequence in my structure. I am using align -> sequence to align for doing that. But, it requires the chain ID. Is it possible to match the epitope into the entire structure? Because some of those structures are homodimers and homotrimers, it would be interesting to highlight the same epitope in all chains simultaneously.

Many thanks

Selection file documentation

Is there any documentation on the selection file from the menus? I would like to be able to load a file with predefined groups of residues via the api or commands. I would also like to be able to alternate between different selection.

Is that the intended use case for that feature?

Help with embedding

Hello,

First off -- what an awesome tool, thanks for making this!

Disclaimer: I'm rather new to JS.

  1. the options of %width/height doesn't seem to work; any value blows up the embedding to full width
  2. I'm struggling to customize the options for embedding a 3D view of simple molecules. For example, trying to turn off hydrogens and I can't seem to get it to work. I'll appreciate a pointer to what I'm doing wrong.
<h1>Not Aspirin</h1>
<p>Blah blah</p>
<div style="width:600px; height:300px; border:5px; border-color:#333;">
  <span>qwerty</span>
  <div id="icn3dwrap"></div>
</div>

<script type="text/javascript">
  $( document ).ready(function() {
        var options = {};
        options['surface'] = 'molecular surface';
        // setStyle(hideHydrogens);

        //Options are available at: https://www.ncbi.nlm.nih.gov/Structure/icn3d/icn3d.html#DisplayOptions
        //options['proteins'] = 'sphere';

        var cfg = {
            divid: 'icn3dwrap',
            width: '50%',
            height: '50%',
            resize: true,
            rotate: 'right',
            mobilemenu: true,
            showcommand: true,
//            showtitle: true,
        };
        cfg['cid'] = '6106';
        if(Object.keys(options).length > 0) cfg['options'] = options;

        var icn3dui = new iCn3DUI(cfg);

        //communicate with the 3D viewer with chained functions
        $.when(icn3dui.show3DStructure()).then(function() {
          icn3dui.setOption('background','white');
          // icn3dui.setOption('opacity','0.2');
          icn3dui.setStyle('hideHydrogens')
          // icn3dui.addLabel('abcdef',0,0,0,50)
             // icn3dui.setOption('color', 'cyan');
        });
  });
</script>
  </body>

Label by atom hides everything but the label

I wanted to label each atom in a nucleotide so that students could identify them.

Here's what I did:

  1. Selected a single nucleotide in 7ODF.
  2. Choose View Selection to hide everything else.
  3. Chose Nucleotide > Ball and Stick.
  4. Chose Color > Atom.
  5. Opened the Analysis menu and chose Label per Atom.

The nucleotide disappeared and I got large square labels that aren't attached to any atoms. I put the image below. This is not very useful. I should be able to see both the labels and the atoms. The labels should be on top of the atoms and should be smaller than the atoms.

Screen Shot 2021-10-18 at 3 34 17 PM

Here's what I would like to see (I didn't add the position numbers, just the letters).

labeled_atoms

Save to PNG

When I tried to save the current canvas scene using the "iCn3D PNG Image", it generates two separate files (one .HTML and one .PNG). I read in the Readme that the function works that way. Unfortunately, google chrome has some issues with saving two files simultaneously because it asks for permission to download multiple files concurrently, and some users can have a problem seeing that. Lastly, when I opened the .html file and clicked on the link available in the image, it opened a new iCn3D tab and started loading the data, but it gets stuck.

2D Interactions Representations

Suggestion: IMPORTANT
in 2D (Interactions window) we need to make use of the molecular (assembly) symmetry
to have a nice and meaningful 2D drawing that can be understood

Choosing "view selection" causes the structure to disappear

Goal: Display a single amino acid residue.

Here's what I did:

  1. Opened 1TUP.
  2. Opened the Sequences & Annotations window.
  3. Selected an amino acid in the sequence (Q100).
  4. Opened the View menu and chose View Selection.

Result: everything disappeared!

The result I expected: Everything else would disappear except the amino acid that I selected.

Additional tests:

  1. Tested the 1TUP MMDB file and the 1TUP PDB. Result: everything disappeared!

  2. Tested other chains in 1TUP and got the same result. Result: everything disappeared!

  3. Tested 1NAJ (a DNA structure) and selected a nucleotide. Result: View Selection works as expected.

  4. Tested a different structure (5F9R) Result: View Selection works as expected with the protein chain and with the nucleotide chains.

NFE - Interactions improvements

Interactions

Highlights - need to be able to select a set of interactions [with Command-click-highlight not just one at a time. Then we eventually want to name that set
[we need to have something general]

Simplified highlights - CA to CA or centered to centroid summing up the atom level contacts between 2 residues using section proportional to sum ... or something along these lines. We could estimate energies on non bonds and hbonds ... and have section proportional, although we are not minimizing structures ... that may be an issue

We need carbohydrate links as in Cn3D example N4/N168 and we may need to handle them together, not separately. Not sure how it is best to achieve this
Glycosylation is important ... so connecting carbohydrates to the right N (or O- eventually) is important - it must be in the PDB as CONNECT statement

We need highlights of H-bonds and non bonds. There are 2 types sets to envision

  • sets of residues
  • sets of [interacting] pairs
    And a relationship between the two

Also on the stats about interactions - precisely - the number of residues and residue pairs is useful in addition to the total number reported

2D representations of Secondary structures and topologies

Having selected for example 1 or 2 domains/chains one may want to drill down at the SSEs level
If showing interactions then a Schematics 3D representation can be highligted as in the sequence window but also in the 2D window as a topological representation

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.