匿名用户2021年12月16日
30阅读
开发技术JavaScript
所属分类Web应用开发、Web框架
授权协议View license

作品详情

iCn3DStructureViewerGallerywithliveexamples,TutorialAboutiCn3D

"Iseein3D"(iCn3D)StructureViewerisnotonlyaweb-based3Dviewer,butalsoastructureanalysistoolinteractivelyorinthebatchmodeusingNodeJSscriptsbasedonthenpmpackageicn3d.iCn3Dsynchronizesthedisplayof3Dstructure,2Dinteraction,and1Dsequencesandannotations.Users'customdisplaycanbesavedinashortURLoraPNGimage.CompletepackageofiCn3DincludingThree.jsandjQuerycanbedownloadedfromhttps://www.ncbi.nlm.nih.gov/Structure/icn3d/icn3d-3.4.7.zip.The"DownloadZIP"linkinthispagedoesnotincludethird-partylibraries.

Viewa3DstructureiniCn3D:Openthelinkhttps://www.ncbi.nlm.nih.gov/Structure/icn3d/full.html,inputaPDBID,andclick"Load".Youcanalsoclick"File"menuto"OpenFile"orinputotherIDs.

Asmentionedinthemenu"Help>TransformationHints",youcanuseLeftmousebuttonforrotation,Middlemousewheelforzooming,andRightmousebuttonfortranslation.

ThemostimportantpointaboutusingiCn3Disthecurrentselection.Anyoperationsoncolor,style,etc.areworkingonthecurrentselection.Bydefault,allatomsareselected.Onceyouselectanysubset,youroperationwillworkONLYonthesubset.YoucanswitchtheselectionusingthetogglenexttotheHelpmenu.

Createcustom3Dview:Youfirstopenastructurein"File"menu,thenselectasubsetin"Select"menu,viewonlytheselectedsubsetbyclicking"ViewOnlySelection"inViewmenu,finallychangestylesorcolorsin"Style"and"Color"menus.

Eachoperationhasacorrespondingcommandaslistedathttps://www.ncbi.nlm.nih.gov/Structure/icn3d/icn3d.html#commands.Thesecommandswillshowupinthecommand/logwindowrightbeneaththe3Ddisplay.Toviewallpreviouscommands,youcanclick"ShareLink"in"File"menu.BoththeoriginalURLandtheshortURLcanbeusedtodisplayyourcustomview.

Saveyourwork:Youcansave"iCn3DPNGImage"inthemenu"File>SaveFiles".BoththePNGfileandanHTMLfilearesaved.ClicktheHTMLfiletoseethePNGimage,whichislinkedtothecustomdisplayviaashortenURL.Thedownloaded"iCn3DPNGImage"itselfcanalsobeusedasaninputinthemenu"File>OpenFile"toreproducethecustomdisplay.YoucancombinetheseHTMLfilestogenerateyourowngalleries.

Youcanalsosave"ShareLink"in"File"menutosharewithyourcolleagues.TheseURLsarelifelong.Youcanclick"ReplayEachStep>On"in"File"menutolearnhowacustomdisplaywasgenerated.

All"ShareLink"URLscanshowtheoriginalviewusingthearchivedversionofiCn3Dbyclicking"OpenFile>ShareLinkinArchivedVer."in"File"menu.

Node.jsscriptsusingnpm"icn3d":Youcandownloadnpm"icn3d"packagetowriteNode.jsscriptsbycallingiCn3Dfunctions.Thesescriptscanbeusedtoprocess3Dstructures(e.g.,calculateinteractions)inbatchmode.Theexamplescriptsareaticn3dnode.

AlternateSNPsin3D:Youcanalternatein3DwildtypeandmutantofSNPsbyclickingthemenu"Analysis>Sequences&Annotations",thetab"Details",thecheckbox"SNP",andmouseoveronSNPs.

DelPhiElectrostaticPotential:YoucanviewtheDelPhiElectrostaticPotentialinthemenu"Analysis>DelPhiPotential".

Symmetry:Youcanshowprecalculatedsymmetry,orcalculatesymmetrydynamicallyusingSymD.

UseiCn3DinJupyterNotebook:YoucanuseiCn3DinJupyterNotebookwiththewidget"icn3dpy".Theinstructionsareatpypi.org/project/icn3dpy.

2DCartoonsinthechain,domain,andsecondarystructurelevels:Youcanuseclick"Analysis>2DCartoon"toshow2DCartoonsinthechain,domain,andsecondarystructurelevels.

ContactMapforanySelectedResidues:Youcanclickthemenu"Analysis>ContactMap"toshowtheinteractivecontactmapforanyselectedresidues.YoucanexportthemapinPNGorSVG.

Morefeaturesarelistedatwww.ncbi.nlm.nih.gov/Structure/icn3d/icn3d.html:bindingsite,interactioninterface,3Dprinting,transmembraneproteins,surface,EMmap,electrondensitymap,1Dsequencesand2Dinteractions,aligntwostructures,alignmultiplechains,alignaproteinsequencetoastructure,realign,customtracks,force-directedgraphforinteractions,solventaccessiblesurfacearea,etc.

EmbediCn3DwithiframeorJavaScriptlibraries

iCn3DcanbeembeddedinawebpagebyincludingtheURLinHTMLiframe,e.g.<iframesrc="https://www.ncbi.nlm.nih.gov/Structure/icn3d/full.html?mmdbid=1tup&width=300&height=300&showcommand=0&mobilemenu=1&showtitle=0"width="320"height="320"style="border:none"></iframe>.ThismethodalwaysshowsthemostrecentversionofiCn3D.

ToembediCn3DwithJavaScriptlibraries,thefollowinglibrariesneedtobeincluded:jQuery,jQueryUI,Three.js,andiCn3Dlibrary.Anhtmldivtagtoholdthe3Dviewerisadded.TheiCn3Dwidgetisinitializedwiththecustomdefinedparameter"cfg":"varicn3dui=newicn3d.iCn3DUI(cfg);icn3dui.show3DStructure();".MultipleiCn3Dwidgetscanbeembeddedinasinglepage.Pleaseseethesourcecodeoftheexamplepageforreference.

UserscanchoosetoshowthemostrecentversionofiCn3D,oralockedversionofiCn3D.Toshowthemostrecentversion,usethelibraryfileswithouttheversionpostfixasshownintheiCn3DDocpage.Toshowalockedversion,usethelibraryfileswiththeversionpostfixasshowninthesourcecodeofiCn3Dpage.IftheinputisprovidedasanMMDBID,bothlibraryfilesandbackendcgisareversionedsothatthe3Ddisplaywillbestable.

DataSources

iCn3DacceptsthefollowingIDs:

mmdbid:NCBIMMDBID,e.g.,https://www.ncbi.nlm.nih.gov/Structure/icn3d/full.html?mmdbid=1tup&showanno=1&show2d=1&showsets=1mmtfid:MMTFID,e.g.,https://www.ncbi.nlm.nih.gov/Structure/icn3d/full.html?mmtfid=1tup&show2d=1&showsets=1pdbid:PDBID,e.g.,https://www.ncbi.nlm.nih.gov/Structure/icn3d/full.html?pdbid=1tup&showanno=1&showsets=1afid:AlphaFoldUniProtID,e.g.,https://www.ncbi.nlm.nih.gov/Structure/icn3d/full.html?afid=A0A061AD48&showanno=1&showsets=1opmid:OrientationsofProteinsinMembranes(OPM)PDBID,e.g.,https://www.ncbi.nlm.nih.gov/Structure/icn3d/full.html?opmid=6jxr&show2d=1&showsets=1mmcifid:mmCIFID,e.g.,https://www.ncbi.nlm.nih.gov/Structure/icn3d/full.html?mmcifid=1tup&show2d=1&showsets=1gi:NCBIproteinginumber,https://www.ncbi.nlm.nih.gov/Structure/icn3d/full.html?gi=1310960&show2d=1&showsets=1uniprotid:UniProtID,https://www.ncbi.nlm.nih.gov/Structure/icn3d/full.html?uniprotid=P0DTC2cid:PubChemCompoundID,e.g.,https://www.ncbi.nlm.nih.gov/Structure/icn3d/full.html?cid=2244aligntwostructures:twoPDBIDsorMMDBIDsforstructurealignment,e.g.,https://www.ncbi.nlm.nih.gov/Structure/icn3d/full.html?align=1hho,4n7n&showalignseq=1&show2d=1&showsets=1alignmultiplechains:anymultiplechainsforstructurealignment,e.g.,https://www.ncbi.nlm.nih.gov/Structure/icn3d/full.html?chainalign=1HHO_A,4N7N_A&showalignseq=1&show2d=1&showsets=1blast_rep_idandquery_id:NCBIproteinaccessionsofaproteinsequenceandachainofa3Dstructureforsequence-structurealignment,e.g.,[https://www.ncbi.nlm.nih.gov/Structure/icn3d/full.html?from=icn3d&blast_rep_id=1TSR_A&query_id=NP_001108451.1&command=viewannotations;setannotationcdd;setannotationsite;setviewdetailedview;selectchain1TSR_A;showselection](https://www.ncbi.nlm.nih.gov/Structure/icn3d/full.html?from=icn3d&blast_rep_id=1TSR_A&query_id=NP_001108451.1&command=viewannotations;setannotationcdd;setannotationsite;setviewdetailedview;selectchain1TSR_A;showselection)

iCn3Dalsoacceptsthefollowingfiletypes:PDB,mmCIF,Mol2,SDF,XYZ,andiCn3DPNG.Thefilescanbepassedthroughaurl,e.g.,https://www.ncbi.nlm.nih.gov/Structure/icn3d/full.html?type=pdb&url=https://files.rcsb.org/view/1gpk.pdborhttps://www.ncbi.nlm.nih.gov/Structure/icn3d/full.html?type=icn3dpng&url=https://www.ncbi.nlm.nih.gov/Structure/icn3d/pdb/3GVU.png.SeethehelppageortheDocpageformoredetails.

Third-partylibrariesusedjQueryandjQueryUI:usedasageneraltooltowriteJavascriptcode.SomejQueryUIfeaturesareused.Three.js:usedtosetupthe3Dview.D3.js:usedtodrawforce-directedgraph.DelPhi:usedtocalculateelectrostaticpotentialdynamicallyandislicensedfromColumbiaUniversity.DelPhiPKa:usedtoaddhydrogensandpartialchargestoproteinsandnucleotides.OpenBabel:usedtoaddhydrogenstoligands.Antechamber:usedtoaddpartialchargestoligands.SymD:usedtocalculatesymmetrydynamically.scap/Jackal:usedtopredictsidechainconformationdynamically.Toolsbasedoniview:Thedrawingof3Dobjectsisbasedoniview.GLmol:ThedrawingofnucleotidescartoonisbasedonGLmol.3Dmol:Thesurfacegenerationandlabelingarebasedon3Dmol.NGLViewer:TheImpostershadersarebasedonNGLViewer.LiteMol:TheparserofEMdensitydatafromPDBeisbasedonLiteMol.OrientationsofProteinsinMembranes(OPM):ThemembranedataoftransmembraneproteinsarefromOPM.Force-DirectedGraph:"2DGraph(Force-Directed)"inthemenu"Analysis>H-Bonds&Interactions"isbasedonForce-DirectedGraph.py3Dmol:TheJupyterNotebookwidget"icn3dpy"isbasedonpy3Dmol.Building

Ifyouwanttobuildyourcodeeasily,you'llneedtoinstallnodejsandnpm.

Next,clonethisrepository,andthenperformthefollowingsetupstepsinyourworkingcopyoficn3d.

npminstall-ggulpnpminstall

Thefirstlineinstallsthegulpbuildtoolglobally,makingthegulpcommandavailableonthecommandline.Thenexttwolinesinstallsallofthedependencesforthisproject.

Youonlyhavetoperformtheabovestepsonce,tosetupyourworkingdirectory.Fromthenon,tobuild,simplyenter:

gulpContact

Pleasesendallcommentstowangjiy@ncbi.nlm.nih.gov.

Citing

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

TociteiCn3D,pleasereference:

WangJ,YoukharibacheP,ZhangD,LanczyckiCJ,GeerRC,MadejT,PhanL,WardM,LuS,MarchlerGH,WangY,BryantSH,GeerLY,Marchler-BauerA.iCn3D,aWeb-based3DViewerforSharing1D/2D/3DRepresentationsofBiomolecularStructures.Bioinformatics.2020Jan1;36(1):131-135.(Epub2019June20.)doi:10.1093/bioinformatics/btz502.PubMedPMID:31218344,FullTextatOxfordAcademic

声明:本文仅代表作者观点,不代表本站立场。如果侵犯到您的合法权益,请联系我们删除侵权资源!如果遇到资源链接失效,请您通过评论或工单的方式通知管理员。未经允许,不得转载,本站所有资源文章禁止商业使用运营!
下载安装【程序员客栈】APP
实时对接需求、及时收发消息、丰富的开放项目需求、随时随地查看项目状态

评论