Skip to content
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

Color the 3D structure by a property #303

Merged
merged 15 commits into from
Oct 26, 2023
Merged

Conversation

MaximeScope
Copy link
Contributor

@MaximeScope MaximeScope commented Oct 16, 2023

It should finally be possible to merge the coloring of the 3d structure with master.

There is an additional option to color the background atoms by property
=> (Environments -> more options -> color: prop, style: ball and stick)


EDIT:

Fixes #118

@MaximeScope
Copy link
Contributor Author

I should note that I've implemented a color_function that includes a check for undefined values (such as when taking the square root of a negative value of the selected property). In such cases, the atom is assigned a gray color.

@ceriottm
Copy link
Contributor

I think you should start by adding a minimal example to the python/examples folder. I tested it on the chemical shielding dataset and my impression is that it doesn't really work but it's hard to make a reproducible example with this much data.
I have it loaded with these parameters
image
and I'm looking at structure 276, atoms 75 and 78. They have a CS_total of 24 and 26 (quite close on a range between 15 and 30) but they end up colored in bright red and bright blue as if they were pretty much extreme.

@ceriottm
Copy link
Contributor

Another observation is that IMO we REALLY need to provide a rudimentary color scale, otherwise it's very hard to read the figures. I read a bit and it seems the best way to do this would be to add an HTML entity outside the widget, a bit like the floating buttons in the top-right cornier.

@Luthaf
Copy link
Contributor

Luthaf commented Oct 20, 2023

I read a bit and it seems the best way to do this would be to add an HTML entity outside the widget, a bit like the floating buttons in the top-right cornier.

The idea was to us a custom label, for which we can set the background to an arbitrary HTML canvas, for which doing a gradient would be fairly easy.

But let's make sure the core of the functionality works first, merge it and then work on the color bar in a separate PR to reduce the size of the individual PRs.

src/structure/viewer.ts Outdated Show resolved Hide resolved
src/structure/viewer.ts Outdated Show resolved Hide resolved
src/structure/viewer.ts Outdated Show resolved Hide resolved
src/structure/grid.ts Outdated Show resolved Hide resolved
The coloring is now dependent of the selected structure.
Added a support of missing properties. Atoms with missing property value are colored in dark gray when the property is selected.
@MaximeScope
Copy link
Contributor Author

I think you should start by adding a minimal example to the python/examples folder. I tested it on the chemical shielding dataset and my impression is that it doesn't really work but it's hard to make a reproducible example with this much data. I have it loaded with these parameters image and I'm looking at structure 276, atoms 75 and 78. They have a CS_total of 24 and 26 (quite close on a range between 15 and 30) but they end up colored in bright red and bright blue as if they were pretty much extreme.

I have addressed the issue, and the code should now work correctly. Initially, the code was selecting the first atoms independently from the structure. With the help of the environnements, the visualizers should now accurately assign colors based on the correct atoms property value.

@ceriottm
Copy link
Contributor

OK I have added an example that generates a simple color-coded figure. I have also renamed the RWB color scheme because it's blue first. I think one important thing is we can do to make it possible to have a reference for the colors is to make sure we have color schemes that match the plotly one. BWR is very similar to seismic (and this I have used in the example) but it'd be nice to have exactly the same schemes - at least viridis and magma for instance.
Looks like you just need to sample the plotly/matplotlib palettes and hardcode say 16 intermediate points. Could you do this?

@ceriottm
Copy link
Contributor

Just commenting that this Fixes #118 for good

src/structure/grid.ts Outdated Show resolved Hide resolved
src/structure/grid.ts Outdated Show resolved Hide resolved
src/structure/options.ts Outdated Show resolved Hide resolved
src/structure/options.ts Outdated Show resolved Hide resolved
src/structure/viewer.ts Outdated Show resolved Hide resolved
src/structure/viewer.ts Outdated Show resolved Hide resolved
@Luthaf
Copy link
Contributor

Luthaf commented Oct 23, 2023

Just commenting that this Fixes #118 for good

This kind of comment needs to be in the first message of the PR for github to automatically close the issue

Comment on lines 21 to 48
for a in frames:
a.arrays["polarizability"] = np.array(
[
(axx + ayy + azz) / 3
for (axx, ayy, azz) in zip(
a.arrays["axx"], a.arrays["ayy"], a.arrays["azz"]
)
]
)

# one possible measure of anisotropy...
a.arrays["alpha_eigenvalues"] = np.array(
[
np.linalg.eigvalsh([[axx, axy, axz], [axy, ayy, ayz], [axz, ayz, azz]])
for (axx, ayy, azz, axy, axz, ayz) in zip(
a.arrays["axx"],
a.arrays["ayy"],
a.arrays["azz"],
a.arrays["axy"],
a.arrays["axz"],
a.arrays["ayz"],
)
]
)

a.arrays["anisotropy"] = (
a.arrays["alpha_eigenvalues"][:, 2] - a.arrays["alpha_eigenvalues"][:, 0]
)
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Do we really need this in the "atomic coloring" example?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't know what you mean by that.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

well, I thought it was better to avoid adding new data files, but we need scalar properties to display.
I'll add a comment so it's clear it's not like one needs to do this in order to use the coloring.

src/structure/options.ts Outdated Show resolved Hide resolved
Copy link
Contributor

@Luthaf Luthaf left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Should be good to go once CI passes

@Luthaf Luthaf merged commit b2b2e18 into lab-cosmo:master Oct 26, 2023
9 checks passed
@Luthaf
Copy link
Contributor

Luthaf commented Oct 26, 2023

merged! 🎉 Thanks @MaximeScope and @angerossi for your work implementing this!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Feature request: allow to visualize tensorial properties on structures
3 participants