Published
Edited
Mar 17, 2021
2 forks
Insert cell
Insert cell
Insert cell
Insert cell
stage = {
let s = new NGL.Stage( "viewport" ,{ backgroundColor: "white" })
return s
};
Insert cell
structure = {
let str;
stage.removeAllComponents();
var stringBlob = new Blob( [ pdbText ], { type: 'text/plain'} );
stage.loadFile(stringBlob, { ext: "pdb" }).then(d => {
d.addRepresentation("cartoon", { color: schemeId, sele: ':A'})
d.addRepresentation("cartoon", { color: 'pink', sele: ':1'})
d.addRepresentation("cartoon", { color: 'yellow', sele: ':0'})
//stage.autoView();
stage.setSpin(false);
stage.viewerControls.orient([33.10845502688973, -96.70430634627243, 36.38799229926336, 0, 74.80874857885536, -3.9211565879922197, -78.48728757468861, 0, 71.2703303314295, 49.039579003609255, 65.48006070056756, 0, 36.04553492421735, -5.422908834280937, -3.53506857225846, 1])
str = d;
})
return str;
}
Insert cell
schemeId = {
return NGL.ColormakerRegistry.addScheme(function (params) {
this.atomColor = function (atom) {
if(dpp4Annotation[atom.resno]){
return 0x0000FF; // blue
}
return 0xADD8E6 // light blue
}
})
}
Insert cell
pdbText = FileAttachment("Galaxy29-[QHD43416.txt.sp_P27487_DPP4_HUMAN.txt.pdb].pdb").text()
Insert cell
dpp4Annotation = _.object(_.pluck(dpp4Sites, 'MSAIndex1'), dpp4Sites)
Insert cell
NGL = require("https://cdn.rawgit.com/arose/ngl/v2.0.0-dev.37/dist/ngl.js")
Insert cell
stage.viewerControls.getOrientation()
Insert cell
import {Table} from "@observablehq/inputs"
Insert cell
dpp4Sites = FileAttachment("dpp4Sites.csv").csv({typed: true})
Insert cell
_ = require("underscore")
Insert cell

Purpose-built for displays of data

Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
Learn more