@arcgis/core
Version:
ArcGIS Maps SDK for JavaScript: A complete 2D and 3D mapping and data visualization API
112 lines (110 loc) • 6.62 kB
TypeScript
import type ElementExpressionInfo from "../ElementExpressionInfo.js";
import type BaseContent from "./Content.js";
import type { ElementExpressionInfoProperties } from "../ElementExpressionInfo.js";
import type { ContentProperties as BaseContentProperties } from "./Content.js";
export interface ExpressionContentProperties extends BaseContentProperties {
/**
* Contains the Arcade expression used to create a popup content element. See the
* [ElementExpressionInfo](https://developers.arcgis.com/javascript/latest/references/core/popup/ElementExpressionInfo/) documentation for details and examples for how to create
* these expressions.
*/
expressionInfo?: ElementExpressionInfoProperties;
}
/**
* An ExpressionContent element allows you to define a popup content element with an [Arcade](https://developers.arcgis.com/javascript/latest/arcade/) expression.
* The expression must evaluate to a dictionary representing a
* [TextContent](https://developers.arcgis.com/javascript/latest/references/core/popup/content/TextContent/),
* [FieldsContent](https://developers.arcgis.com/javascript/latest/references/core/popup/content/FieldsContent/), or a
* [MediaContent](https://developers.arcgis.com/javascript/latest/references/core/popup/content/MediaContent/) popup element as
* defined in the [Popup Element web map specification](https://developers.arcgis.com/web-map-specification/objects/popupElement/).
*
* Expressions defining popup content typically use the `attributes` property of an element to reference
* values calculated within the expression in a table or a chart.
*
* > This content element is designed for advanced scenarios where content in charts, tables, or rich text elements is based on
* logical conditions. For example, if data in one or more fields is empty, you can use this element to dynamically create a table consisting
* only of fields containing valid data values. You can also use this element to create charts or other content types consisting of aggregated data values. This can be especially useful in [cluster popups](https://developers.arcgis.com/javascript/latest/references/core/layers/support/FeatureReductionCluster/#popupTemplate).
*
* @since 4.22
* @see [PopupTemplate](https://developers.arcgis.com/javascript/latest/references/core/PopupTemplate/)
* @see [ElementExpressionInfo](https://developers.arcgis.com/javascript/latest/references/core/popup/ElementExpressionInfo/)
* @see [Popup Element Web Map Specification](https://developers.arcgis.com/web-map-specification/objects/popupElement/)
* @see [Popup Element Profile](https://developers.arcgis.com/javascript/latest/arcade/#popup-element)
* @see [Arcade Profiles: Popup Element Specification](https://developers.arcgis.com/arcade/profiles/popup-element/)
* @see [Sample - Create popup charts from Arcade expressions](https://developers.arcgis.com/javascript/latest/sample-code/popuptemplate-arcade-expression-content/)
* @see [Sample - Popup charts for point clusters](https://developers.arcgis.com/javascript/latest/sample-code/featurereduction-cluster-popup-chart/)
* @example
* // Creates an column chart where each category/value
* // is an aggregate of two or more fields
* layer.popupTemplate = {
* title: "Educational Attainment",
* content: [{
* type: "expression",
* expressionInfo: {
* expression: `
* // Create a dictionary of attributes representing the values
* // to display in the chart
* var attributes = {
* "No School": $feature.no_school + $feature.some_primary,
* "Primary": $feature.primary_complete + $feature.some_secondary,
* "Secondary": $feature.secondary_complete + $feature.some_highSchool,
* "High School": $feature.highSchool_diploma + $feature.highSchool_ged + $feature.some_college,
* "College/University": $feature.associates + $feature.bachelors + $feature.masters + $feature.doctorate + $feature.professional;
* };
*
* var fields = [];
*
* // Create an array representing the attribute names (or keys)
* for (var k in attributes){
* Push(fields, k);
* }
*
* // Returns a dictionary providing the information
* // required by the popup to render a column chart
* return {
* type: "media",
* attributes: attributes,
* title: "Educational attainment",
* mediaInfos: [{
* type: "columnchart",
* value: {
* // The list of attribute names (keys) to include in the chart
* fields: fields
* }
* }]
* };
* `,
* title: "Educational Attainment"
* }
* }]
* };
*/
export default class ExpressionContent extends BaseContent {
constructor(properties?: ExpressionContentProperties);
/**
* Contains the Arcade expression used to create a popup content element. See the
* [ElementExpressionInfo](https://developers.arcgis.com/javascript/latest/references/core/popup/ElementExpressionInfo/) documentation for details and examples for how to create
* these expressions.
*/
get expressionInfo(): ElementExpressionInfo;
set expressionInfo(value: ElementExpressionInfoProperties);
/**
* The type of popup element displayed. This value is always `expression`.
*
* @see [TextContent](https://developers.arcgis.com/javascript/latest/references/core/popup/content/TextContent/)
* @see [FieldsContent](https://developers.arcgis.com/javascript/latest/references/core/popup/content/FieldsContent/)
* @see [MediaContent](https://developers.arcgis.com/javascript/latest/references/core/popup/content/MediaContent/)
* @see [AttachmentsContent](https://developers.arcgis.com/javascript/latest/references/core/popup/content/AttachmentsContent/)
* @see [CustomContent](https://developers.arcgis.com/javascript/latest/references/core/popup/content/CustomContent/)
* @see [ExpressionContent](https://developers.arcgis.com/javascript/latest/references/core/popup/content/ExpressionContent/)
* @see [RelationshipContent](https://developers.arcgis.com/javascript/latest/references/core/popup/content/RelationshipContent/)
* @see [UtilityNetworkAssociationsContent](https://developers.arcgis.com/javascript/latest/references/core/popup/content/UtilityNetworkAssociationsContent/)
*/
get type(): "expression";
/**
* Creates a deep clone of the ExpressionContent instance.
*
* @returns A deep clone of the ExpressionContent instance.
*/
clone(): ExpressionContent;
}