it's great if we can make a nice layout so we can always view the protein + coding

https://github.com/jupyter-incubator/dashboards

might be good for publication or viewing

tv.show_atom_name('1-3')

Source: http://x3dna.org/images/chi_anti_syn.png

I think nglview should follow Python's pep8 (https://www.python.org/dev/peps/pep-0008/)

If anyone does not want to remember anything, just install autopep8 and do

autopep8 -a -i your_file.py

the magic will happen.

Couldn't find anything in the docs, but is there a way to switch the viewer to an orthographic mode instead of perspective?

the right menu so users can make different representation.

http://arose.github.io/ngl/?example=3pqr

FYI:

working

view.add_representation('cartoon', color='residueindex')

NOT working (there is extra space in cartoon word

view.add_representation('cartoon ', color='residueindex')

• can you confirm in your computer?
• if my statement is true, what's our solution here, either
  • I can use python to strip left and right spaces
  • you take care js side

from this issue: #4

w = NGLWidget(...)
w.representations = [
    { "type": "cartoon", "params": {
        "sele": "protein", "color": "residueindex"
    } },
    { "type": "ball+stick", "params": {
        "sele": "hetero"
    } }
]

Since user need to specify options to change representation, should we use more complete English keyword? For example: does 'sele' mean 'select' or something else?

hi,

is there anyway to add the electron density map?

wait for

nglviewer/ngl#98 (comment)

I am collecting examples about beautiful color schemes (IMO).

I am not good at colorizing stuff, so it's great if there is anyone interested in.

• from molsoft

For the notebook, static assets/resources (like JavaScript files) are installed with notebook.nbextensions.install_nbextension. When the assets are updated (often during development, for the user upon a new release) the browser still has them cached and a "forced" refresh is needed. This should happen automatically for new releases and caching should be switched off during development.

Any idea how I can do this? Thx.

currently whenever add_representation is called, the viewer is re-rendered (?) so the transition is not smooth (structure disappears and reload).

try yourself in notebook

1st cell

import pytraj as pt
import nglview as nv

t0 = pt.fetch_pdb('3pqr')
view = nv.show_pytraj(t0)

view.representations = []
view.add_representation('cartoon', color='residueindex')
view

2nd cell (cause non-smooth transition)

view.add_representation('label', '.CA', color='blue')

and remove most stuff from the README.md

@hainm what do you think?

• Update API documentation
• Update Changelog
• Add notebook examples
• Note support for pytraj, mdanalysis, mdtraj, simpletraj prominently in README
• Resolve dependency issue #17

this is required with new ipywidget version. If not, getting

Widget Javascript not detected

for example: rotate molecule, then zoom to specific region, then change the representation, update color, ...

Not sure how difficult it is, but it's good for making movie, for using notebook for presentation.

center vs center_view vs centerView. Which one is better name? else?

def center_view(zoom=True, selection='*'):
    self._remote_call('centerView', target='viewer', args=[zoom, selection])

for example

view.add_representation('cartoon', selection='not hydrogen', color='red')

alias

view.cartoon('not hydrogen', color='red')

and so on.

What do you think?
(learn from chemview and pv programs).

advantage: we can use autocompletion.

I installed nglview via conda on windows 7 and got the following error when I tried to import nglview in a jupyter notebook

symlink C:\Users\yalhadid\AppData\Roaming\jupyter\nbextensions\nglview -> C:\Anaconda3\lib\site-packages\nglview\html\static

---------------------------------------------------------------------------
OSError                                   Traceback (most recent call last)
<ipython-input-1-24944f7c2fa8> in <module>()
----> 1 import nglview

C:\Anaconda3\lib\site-packages\nglview\__init__.py in <module>()
    445     })
    446 
--> 447 install(symlink=True)

C:\Anaconda3\lib\site-packages\nglview\__init__.py in install(user, symlink)
    436     staticdir = resource_filename('nglview', os.path.join('html', 'static'))
    437     install_nbextension(staticdir, destination='nglview',
--> 438                         user=user, symlink=symlink)
    439 
    440     cm = ConfigManager()

C:\Anaconda3\lib\site-packages\notebook\nbextensions.py in install_nbextension(path, overwrite, symlink, user, prefix, nbextensions_dir, destination, verbose)
    202                 if verbose >= 1:
    203                     print("symlink %s -> %s" % (full_dest, path))
--> 204                 os.symlink(path, full_dest)
    205         elif os.path.isdir(path):
    206             path = pjoin(os.path.abspath(path), '') # end in path separator

OSError: symbolic link privilege not held

Do you know why?

• nglview

• vmd

pdb file: https://github.com/hainm/amber_things/tree/master/things/nglview/issue

• autorun some basic notebooks
• need to update new NGL features
• move LOG to different file
• probably update GIF to README (with new NGL version): its render is very pretty.
• add versions requirement in setup.py

currently nglview uses omnia channel.

Should nglview has its own channel to have more control? or just need make a PR to https://github.com/omnia-md/conda-recipes/blob/master/nglview/meta.yaml?

another thought: can bioconda accepts nglview? https://github.com/bioconda/bioconda-recipes

wait for NGL-dev

what's your workflow when modifiying ngl, then update code to nglview?

I tried to modified nglview/html/static/ngl.js but my VIM program was freezing because it does not like that many lines of codes (41K). Can you just keep the original files from ngl (https://github.com/arose/ngl/tree/master/js/ngl)

If keeping the original files degrades the performance, can you post the exact commands you used? thanks from JS noob.

MDAnalysis should not be used with python 3 yet, as the port is highly experimental at that point. I tried however, but hit an issue in nglview while using nglview.show_mdanalysis:

---------------------------------------------------------------------------
ImportError                               Traceback (most recent call last)
<ipython-input-99-ae3b559d7118> in <module>()
----> 1 v = nglview.show_mdanalysis(pi)

/home/jon/Envs/lipid3/lib/python3.4/site-packages/nglview/__init__.py in show_mdanalysis(atomgroup, **kwargs)
    118     '''
    119     structure_trajectory = MDAnalysisTrajectory(atomgroup)
--> 120     return NGLWidget(structure_trajectory, **kwargs)
    121 
    122 

/home/jon/Envs/lipid3/lib/python3.4/site-packages/nglview/__init__.py in __init__(self, structure, trajectory, representations, parameters, **kwargs)
    347         if parameters:
    348             self.parameters = parameters
--> 349         self.set_structure(structure)
    350         if trajectory:
    351             self.trajectory = trajectory

/home/jon/Envs/lipid3/lib/python3.4/site-packages/nglview/__init__.py in set_structure(self, structure)
    372     def set_structure(self, structure):
    373         self.structure = {
--> 374             "data": structure.get_structure_string(),
    375             "ext": structure.ext,
    376             "params": structure.params

/home/jon/Envs/lipid3/lib/python3.4/site-packages/nglview/__init__.py in get_structure_string(self)
    313                 "'MDAnalysisTrajectory' requires the 'MDAnalysis' package"
    314             )
--> 315         import cStringIO
    316         u = self.atomgroup.universe
    317         u.trajectory[0]

ImportError: No module named 'cStringIO'

The line numbers correspond to nglview-0.4 freshly installed with pip on python 3.4. The faulty import is now on line 386 of __init__.py.

Does IPython support binary messages between kernel and browser? Modern browsers can receive binary and save it in an ArrayBuffer. This would make sending coordinates and topology data to the browser more efficient. It is often in an binary format in the kernel and can consumed as such in the browser thus avoiding converting/parsing to/from JSON.

(I am not sure about this issue's title, might update later).

What do you think about this syntax

import nglview as nv
w= nv.NGLWidget(...)

# new syntax
w.select('protein').representation('cartoon', **kwd)
w.select('hetero').representation('ball+stick', **kwd)

or

# new syntax
w.select('protein', representation='cartoon', **kwd)
w.select('hetero', representation='ball+stick', **kwd)

which is equal to

w.representations = [
    { "type": "cartoon", "params": {
        "sele": "protein", "color": "residueindex"
    } },
    { "type": "ball+stick", "params": {
        "sele": "hetero"
    } }
]

of course, we can still massively update representation via w.representations = ...

I just visited bokeh project and they are still looking solution to send data to JS.
while waiting solution, I come up with dirty hack: trying to send all coordinates to JS side.

bokeh/bokeh#2204

• first, we dont need to sync 'coordinates' between Python and JS. too slow.
• in Python, call

view.send({'type': 'coordinatesdict', 'data': view.trajectory.get_coordinate_dict()})

• in JS, create on_msg function to receive the message.

            // get message from Python
       this.coordinatesdict = undefined;
       this.model.on( "msg:custom", function (msg) {
                    this.on_msg( msg );
       }, this);

        on_msg: function(msg){
            if ( msg.type == 'call_method' ){
                 ...
            }else if( msg.type == 'coordinatesdict'){
                this.coordinatesdict = msg.data;
                console.log ( "received coordinatesdict" );
            }
        }

if frame changed

        frameChanged: function(){
            var frame = this.model.get( "frame" );
            var coordinates = this.coordinatesdict[frame];
            var component = this.structureComponent;
            if( coordinates && component ){
                var coords = new Float32Array( coordinates );
                component.structure.updatePosition( coords );
                component.updateRepresentations( { "position": true } );
            }

        },

I have not done benchmark yet but this should be much faster than sending coordinates from Python to JS every time frame changed.

for now. (or nothing shows up with a bunch of error messages).

to get and update the current state of the viewer.

just create an issue so we can close it :))

You posed a script on gist and I also have an adaped version to link viewer to matplotlib

Consider this as a potential feature.

can you add this.

something like

import pytraj as pt
import nglview as nv

traj = pt.load(fn, tn)
view = nv.load_pytraj(traj, **kwd)
# view = nv.load_mdanalysis(traj, **kwd)
# view = nv.load_mdtraj(traj, **kwd)

and so on for other package.
Aim is to hide the step of creating PytrajTrajectory and then calling NGLWidget(...).

What's about link two widgets together (share rotation matrix?)

It would be awesome to be able to pass an MDAnalysis.Universe object into a wrapper object similar to nglview.MDTrajTrajectory, with the wrapper pulling coordinate information through that object. Haven't looked in detail at the library to see the best way to go about it, but it I imagine there could be pretty wild and wonderful ways to take advantage of MDAnalysis' feature set, including perhaps making selections using AtomGroup objects.

this is for my TODO.

aspectRatio

to

aspect_ratio

tv._add_representation('all', type='cartoon', aspect_ratio=...)

those are pretty

it's great if you (@arose) can add notebooks for them

we should do it.

chemview has very nice travis build here: https://github.com/gabrielelanaro/chemview/blob/master/.travis.yml

what do you think about create ngl organization? or anything that has fancy name.

pros:

• you (@arose) can make a PR and let travis do the install and testing rather pushing directly to arose/nglview
• Other can review your PR :D

does NGL have it yet?

IMO, pv package has very cute render: https://biasmv.github.io/pv/demo.html

not sure how hard to implement it in nglview

yeah, we should bring this feature from ngl repo.

there is nothing related to html. So what's about 'static' or 'js' or something else?

from this doc: http://arose.github.io/ngl/doc/#User_manual/Usage/Selection_language

there is no selection for atom indices?

saying I am having a series of atoms and want to make red color, how can I do the selection.

This is Amber syntax

tv._add_representation('@1,2,4,10,11', 'ball+sticks', color='red')

currently, AMBER use non-friendly atom mask syntax (but very flexible). Since we are proposing passing atom indices for nglview, we can also get the atom indices back by using nglview's selection too.

atom_indices = view.get_atom_indices(selection='charged')

place holder

In VMD, there is shortcut key (2) to change to click mode to display distance between two atoms.

nice to have