biasmv / pv Goto Github PK
View Code? Open in Web Editor NEWWebGL protein viewer
Home Page: https://pv.readthedocs.org
License: MIT License
WebGL protein viewer
Home Page: https://pv.readthedocs.org
License: MIT License
When initialising a new viewer, option fog is ignored. I always need to set pv_viewer.options('fog', false); after intialising.
pv_viewer = pv.Viewer(document.getElementById('pv'), {
width: 300, height: 300, antialias: true, quality : 'medium', fog:false
});
I checkout and compile latest master branch, but AutoSlab is not defined :(
Insertion codes are currently ignored which leave gaps in the PDB.
1fiz is an example of a PDB with insertion codes at ~ residue 126 (among others).
You can see the problem when PV renders it here:
http://aquaria.ws/P29293/1fiz/A?viewer=webgl
You can also see here PV integrated with Aquaria! Sure beats Java3D for startup time and general Java woes.
Do not enable manual anti-aliasing when we are running on a high-density display.
The line-based render modes are quite dark. Implement a shader for line-based render styles which ignore the normal.
Zooming speed should follow an exponential function. The closer to the center the camera is positioned, the slower should the zooming happen. Also, it should not be possible to position the camera in front of center, e.g. the center point must always be visible on the screen.
Currently, CA files are not visible.
The within selection code is rather slow an is unusable for large structures. Use a spatial partitioning to speed it up.
Without much coding is there a way to load custom pdbs from local files?
It looks like bond objects only include two atoms and a mid point, and that it is not currently possible to render double, triple or aromatic bonds.
Could bond order please be added to bonds, with appropriate rendering options?
Per subject, the fog density as well as near and far offsets should be adjustable
Many places use _ as a prefix for private functions/methods. JavaScript optimizers/minifiers have to leave these identifiers as is (at least UglifyJS does). By moving these _ private methods to module functions, the names can be mangled and the minified file should get smaller.
Unfortunately, this can't be applied everywhere, for example when polymorphic behavior is required but it should buy us some space.
Currently, auto-slabbing does not work as intended when the object is off-center and it get's cut when the camera is rotated. That's super annoying and should be fixed.
Most of the render code uses buffer pools to manage typed arrays. The code also provides a fallback path for non-pooled allocation. That's bad as it requires manually checking for the presence of buffer pools:
if (pool) {
var array = pool.request(size);
} else {
var array = new Float32Array(size);
}
Instead, two types of allocators should be provided, one which just news the typed arrays, and another which uses a pool of buffers. The code simplifies to:
var array = allocator.request(size)
Should be vertArrays[i]
automatically adjust the near and far clipping plane based on the visible geometry
Hi Marco,
I'm the developer of Chemplore and I just discovered pv. I must say it's a very impressive work. Is there an email that I can reach you at?
Reza
When outline mode is enabled, the structure is rendered in black on the iPad. this is due to problems with the z-buffer. When disabling outline mode, everything works as expected. I've tried to play around with gl.depthRange() to work around the problem. Unfortunately this degrades visual fidelity on non iPad devices.
the strand smoothing schemes tried so far are all suboptimal and lead to strange artifacts. come up with a better smoothing scheme.
per subject, implement the balls and sticks render mode. It does not need to be possible to display whole structures using balls and sticks, but at least it should be possible to show a few selected residues.
What is the best way to get the current colour of a residue ? I want to do this for selection, by highlighting the selected residue, then reverting to the original colour when the user selects something else. I need to get the original colour which is tricky.
I initially had this working by looking up the residue colour in the current colour scheme, but this doesn't handle custom renders that don't all occur in the 1 colour scheme (e.g. if there has been a custom render of residues by using the ResidueView or ChainView).
From what I can see, to find the colour for a given residue:
Is this the easiest way? A helper method here would be good I think.
Allow hex color values for all coloring commands
Implement pixel-accurate picking of objects, e..g to center the camera on the clicked object.
Allow the OpenGL canvas to be resized. Viewport and the projection matrix aspect ratio have to be updated accordingly.
The viewer class is getting quite big and is taking take of multiple aspects. The different aspects should be split into separate classes which the viewer is then using.
creating the vec3 instances has a non-zero cost during PDB parsing. Benchmarking has revealed that it would be faster to create an ArrayBuffer and create FloatArrayViews to the buffer afterwards.
The PDB parsing can already be started while the file is being downloaded which should make things faster.
Adjust the camera position and orientation such that a selection of atoms(or possibly even a selection of MeshGeom/LineGeom triangles) fill the screen optimally.
switch the rendering of the sphere render style to spherical billboards to massively save the number of triangles used.
objects ids for color picking should be reusable. When an object is no longer used, the id be released and should become available or other objects.
The main difficulty is to come up with an efficient scheme for object ID reuse
WebGL restricts index buffers to uint16 type. That's not enough to render large molecules. Implement a workaround, which automatically splits the geometry into multiple render buffers.
Tubes are currently open at the end. They should be capped.
Add a transparency value to control the opacity/transparency of MeshGeoms/LineGeoms
When coloring a specific chain of a protein structure( go.select({cname: 'A'}) ) it turn the whole structure into the given color. Coloring the whole structure green and than e.g chain B with yellow, chain A remains green and the rest is yellow.
Untill now, I did not managed to find the solution. I've tracked back the functions and probably the error originates in the last section of recolor function.
Two letter names are not found, you need a space before the name:
select({'rname':' DC'}) requires a space before the DC
implement a special shader to quickly highlight parts of the structure without having to recalculate any geometry/change color information.
Implement an operation to color structures by arbitrary float properties, either at the chain, residue or atom level.
The introduction of IndexedVertexArray made CompositeGeom more or less obsolete. Remove it
I've begin to implement the touch event handling to make the viewer usable for touch screen equipped devides. By now, it's not a purified code, but some features works on touch events as well. But it's a little messy.
rotate : one finger swipe
center : one finger double tap (not implemented)
translate : two finger swipe
rotate by Z: two finger rotate
zoom : pinch (not implemented)
scene.js is getting quite big. There are a few redundancies here and there. Most notably there is some functionality in LineGeom and MeshGeom that could be moved to BaseGeom.
These redundancies should be removed and the file then possibly be split into multiple files, one for LineGeom, BaseGeom, MeshGeom, Label etc.
Ball and stick looks similar to lines, however it is easy to pick items when rendered with lines and it is difficult to pick an object in Ball and stick mode.
Is this related to the 'lineWidth' setting found in lines ?
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.