New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Adding volume visualization #4
Comments
It was quite straightforward indeed, so I just added it. Let me know if you have further suggestions or PRs :) |
That's really cool. I can confirm it works on my end as well. However, I think there are some things which are not ideal at the moment.
I'm no expert on different volume formats, but it seems to be part of the examples so allowing it to be set would be very desirable.
quarto-molstar/_extensions/molstar/molstar.lua Lines 170 to 174 in 7192d5d
The purpose of this is to give the possibility for example for positive and negative values. You can use this to display orbitals like this. I'm not sure how that could be done in your current input format, but it would be great to have it. molstar.Viewer.create(app, {layoutIsExpanded: false, layoutShowControls: false}).then(viewer => {
viewer.loadStructureFromUrl("./traj.xyz", "xyz")
viewer.loadVolumeFromUrl(
{url: './mo_15.cube',
format: 'cube',
isBinary: false},
[{type: "absolute",
alpha: 0.75,
value: 0.04,
color: 0xFF0000,
},
{type: "absolute",
alpha: 0.75,
value: -0.04,
color: 0x0000FF,
}
]
)
}); |
I suppose have to think about passing additional arguments to the shortcode in general. At the moment the different shortcodes take either one or two positional arguments and the keyword arguments are assumed to be molstar options for the viewer creation. But we need some way of passing arguments to the respective loading functions as well. Maybe as a keyword followed by a json string? Do you have some thoughts on a sensible interface? |
Ideally we keep it simple for a basic use case, but extensible enough for this. Though at some point you would be better off just writing the html div and a js script tag yourself, so we don't want to be more convoluted than that. |
Json string sounds reasonable and I think it's quite similar as to how Google's Fire implements dictionary parsing from the command line. Another option would be to have a delimiter token, for example As you say, in the end you can also use Observable JS to create your own visualization like I did in the blog post, but supporting most functionality in |
I actually found that there is a function exposed in
app.ts
for displaying surfaces. I used the following code and was able to get something. TheloadVolumeFromUrl
could probably be adapted in the same way as you do for the other ones.Resolution is not great, but it seems to work, and the visualization can be adjusted later in the viewer
Archive.zip
The text was updated successfully, but these errors were encountered: