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

Support customization of the Feature Info Panel for each data layer in Cesium #1797

Closed
robyngit opened this issue May 19, 2021 · 3 comments
Closed
Assignees
Labels
cesium enhancement pdg Permafrost Discovery Gateway
Milestone

Comments

@robyngit
Copy link
Member

In Cesium, clicking on a data entity (e.g. on a LEO Network marker) shows an "info box" containing the description property or attribute table of that entity. Make the information shown in that info box configurable (e.g. for the LEO Network data, we show the date, an image, a link, logo, etc, but this is currently hard-coded in the app.)

@robyngit robyngit added enhancement pdg Permafrost Discovery Gateway cesium labels May 19, 2021
robyngit added a commit that referenced this issue Sep 29, 2021
Reorganization of the CesiumWidget:
- Move functions that create and update Cesium assets (e.g. imagery, terrain, 3Dtiles) from the CesiumWidget view to individual "Map Asset" models
- Replace the Layer and Terrain model with a more generic MapAsset model.
- Similarly, replace Layers and Terrains collections with a MapAssets collection that can be used in either case.

New features:
- Enable clicking on individual features in a 3D tileset lay to view more details
- Add support for configuring the colours to use for 3D tilesets - colors can be set conditionally in the Cesium config based on feature properties. Only categorical color palettes are enabled at so far.
- Add support for configuring 'vector filters' in the Cesium config. These filters conditionally show or hide features of a 3D tileset based on properties of the features.

Relates to #1770, #1798, #1789, #1790, #1791, #1780, #1778, #1797
@robyngit robyngit changed the title Support customization of the InfoBox for each data layer in Cesium Support customization of the Feature Info Panel for each data layer in Cesium Nov 29, 2021
@robyngit
Copy link
Member Author

This is how the default Feature Info Panel looks now:

Screen Shot 2021-11-29 at 12 44 42

@robyngit robyngit self-assigned this Dec 10, 2021
robyngit added a commit that referenced this issue Dec 10, 2021
- Allow configuration of a feature template in a Map Asset model
- Add a 'table' (default) and 'story' feature template
- Allow configuration custom properties in a Map Asset model (dates and strings)
- Tweak the text shown for the title and button in FeatureInfoView
- Add Day.JS library for formatting dates

Relates to #1797
@robyngit
Copy link
Member Author

Completed in the feature-cesium-portals branch, which includes the addition of a "story" template:

Which properties are used in the each part of the template are configured in a featureTemplate property:

/**
* A feature template configures the format and content of information displayed
* in the Feature Info panel ({@link FeatureInfoView}). The Feature Info panel is
* displayed in a map when a user clicks on a vector feature in a map.
* @typedef {Object} FeatureTemplate
* @name MapConfig#FeatureTemplate
* @since 2.x.x
* @property {'story'|'table'} [template='table'] The name/ID of the template to
* use. This must match the name of one of the templates available in
* {@link FeatureInfoView#contentTemplates}.
* @property {string} [label] Sets which of the feature properties to use as the
* title for the FeatureInfoView. The string must exactly match the key for a
* property that exists in the feature.
* @property {MapConfig#StoryTemplateOptions} [options] A list of key-value pairs
* that map the template variable to a property/attribute of the the feature. Keys
* are the template variable names and values are the names of properties in the
* feature. Template variable names are specific to each template. Currently only
* the 'story' template allows variables. These are specified in the
* {@link FeatureInfoView#contentTemplates}.
* @example
* // Use the "story" template, which shows a secondary title, image, description,
* // and link.
* {
* "template": "story",
* "label": "title",
* "options": {
* "subtitle": "formattedDate",
* "description": "summary",
* "thumbnail": "imageSrc",
* "url": "newsLink",
* "urlText": "newsTitle",
* }
* }
* @example
* // Use the default template (a table), but use the "forestName" attribute for
* // the FeatureInfo panel label
* {
* "label": "forestName"
* }
*/

The content of a FeatureInfoView is rendered within an iframe.

@mbjones
Copy link
Member

mbjones commented Dec 11, 2021

Nice, @robyngit ! 🎉

@robyngit robyngit added this to the 2.19.0 milestone Dec 15, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
cesium enhancement pdg Permafrost Discovery Gateway
Projects
None yet
Development

No branches or pull requests

2 participants