Atom property visualisation

[angerossi]

Allow the atom-type properties to be displayed in the structure viewer using the RWB and Sinebow color maps supported by 3dmol.

UI changes:

• two dropdown menus have been added in the structure viewer options, allowing the use to select the atom property to be displayed and the color map to be used.

Future improvements:

• A color bar would be the next post important improvement, although this is not an easy task.
• Some databases (such as the zeolites example) contain a sparse atom property list. It would be preferable to then color all the atoms with undefined properties uniformly (such as all grey) so that only the atoms with defined properties are colored with the selected color map. The current implementation will display the atoms with undefined properties using jmol style element coloring (chemiscope default). A warning is displayed when a property containing undefined values is selected.

Other notes:

• the Azaphenacenes example contains an atom property "numbers", however no environments are defined in the database. This results in the property being listed in the atom property coloring dropdown, but attempting to display this property on the atoms will not do anything. No errors occur, however maybe removing this property from the example database might be a good idea, since I don't imagine that there is much use for atom properties in the current chemiscope if there are no associated environments?

[angerossi]

I wonder why the tests/lints failed? I was sure to run both prettier and npm test before making the PR

[ceriottm]

Thanks. This looks like the core functionality is really there. Before we can merge though I think there are several points we need to address:

• I think it'd be good to have a separate section in the option dialog, something like "atom coloring", which is only active if the dataset contains numerical atom-level data. it should also contain similar options as for the color map in the map widget, specifying range and linear/log scale
• one way I can think we could have a color map is to draw a 3D shape, perhaps aligned with the z axis and centered close to where the axes centers are. we could only indicate (with 3dmol text) the upper and lower extremes. this is important because then people can use it to make a 2D color scale by picking the colors from a snapshot. there could be a switch to show/hide

[Luthaf]

I wonder why the tests/lints failed? I was sure to run both prettier and npm test before making the PR

This is unrelated to your code, it was an issue with npm I fixed on master. You should be able to rebase & get the fix.

[rosecers]

Will this just affect the info bar or the coloring of the atoms as well? latter might be nice if it's not in here.

[Luthaf]

This is coloring the atoms with atomic properties, and doing nothing with the info panel.

[ceriottm]

Just a note that this fixes #118

[ceriottm]

I tried to merge the shape work, but it looks like this branched off main quite some time ago, so it's not entirely trivial. Would be good to rebase before doing any more work, as it won't get easier to bring the branches in sync.

[ceriottm]

I will close this PR that has apparently been superseded by #303 . If there is a reason to keep it open we can always re-open it.