color_choices = [
{name: 'redbluepurple', label: "Red, blue, and purple", scheme: rbpSchemeId},
{name: 'redonly', label: "Red only", scheme: roSchemeId}
]
PDB_ID = "7C8D"
sites = Array(100).fill(0).map((d, i) => i % 4)
colors = {
return {
'redbluepurple': [0xDDDDDD, 0xFF0000, 0x0000FF, 0xFF00FF],
'redonly': [0xDDDDDD, 0xFF0000, 0xDD0000, 0x990000]
}
}
viewport.style.height = "400px"
roSchemeId = {
return NGL.ColormakerRegistry.addScheme(function (params) {
this.atomColor = function (atom) {
return colors['redonly'][sites[atom.resno]]
}
})
}
rbpSchemeId = {
return NGL.ColormakerRegistry.addScheme(function (params) {
this.atomColor = function (atom) {
return colors['redbluepurple'][sites[atom.resno]]
}
})
}
set_color = {
str.setColor(colorchoice.scheme);
str.update({color: true});
}
NGL = require("https://cdn.rawgit.com/arose/ngl/v2.0.0-dev.37/dist/ngl.js")
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.
