Class: AnalyticsMetric

A web component for embedding a Tableau Next metric.

AnalyticsMetric

  • AnalyticsComponent

new AnalyticsMetric(props): AnalyticsMetric

The constructor for the AnalyticsMetric.

• props: MetricProps

The properties for the AnalyticsMetric component.

AnalyticsMetric

In multi org scenarios, always specify the orgUrl parameter when creating components:

The orgUrl parameter must be a Lightning URL (e.g., https://yourorg.lightning.force.com), not the my.salesforce.com domain URL.

AnalyticsComponent.constructor

parentIdOrElement: string | HTMLElement

This ID of the container or the container where the analytics component is embedded.

AnalyticsComponent.parentIdOrElement

get borderRadius(): string

The border radius for the component, in CSS units. Acceptable string formats include:

  • Pixel values (e.g., "5px")
  • Percentages (e.g., "50%")
  • Relative units (e.g., "1em", "0.5rem")
  • Other valid CSS border-radius values (e.g., "10px 5px", "50% / 10%")

If an invalid or empty value is provided, default border-radius is applied.

set borderRadius(val): void

• val: string

string

  • Returns the border radius value as a CSS string.

get componentType(): string

Returns the component type: 'metric'.

string

AnalyticsComponent.componentType

get filters(): UnifiedFilterJson[]

The filters for the component.

set filters(val): void

• val: UnifiedFilterJson[]

UnifiedFilterJson[]

  • Returns a list of filters for the component.

AnalyticsComponent.filters

get height(): string

The height for the component, in CSS units. Acceptable string formats include:

  • Pixel values (e.g., "800px")
  • Percentages (e.g., "100%")
  • Relative units (e.g., "2rem", "1.5em")
  • Other valid CSS height values.

If an invalid value is provided, the value defaults to 100%.

set height(val): void

• val: string

string

  • Returns the height of the component.

AnalyticsComponent.height

get idOrApiName(): string

The ID or API name used to identify the Tableau Next component.

set idOrApiName(val): void

• val: string

string

  • Returns the ID or API name of the component to embed.

AnalyticsComponent.idOrApiName

get layout(): MetricLayoutAttributes

Returns the metric layout.

set layout(val): void

Set the layout attributes for the metric.

• val: MetricLayoutAttributes

The layout attributes for the metric.

MetricLayoutAttributes

  • The metric layout, if defined.

get orgUrl(): undefined | string

The org URL for the component.

In multi-org scenarios, this property identifies which org the component belongs to. Returns a Lightning URL (e.g., https://yourorg.lightning.force.com).

set orgUrl(val): void

• val: string

undefined | string

The org URL, or undefined if not set.

AnalyticsComponent.orgUrl

set range(val): void

Sets the time range to display for the metric data. This controls the period of time for the rendered metric values.

• val: FilterCondition

The time range for the metric.

get width(): string

The width for the component, in CSS units. Acceptable string formats include:

  • Pixel values (e.g., "800px")
  • Percentages (e.g., "100%")
  • Relative units (e.g., "2rem", "1.5em")
  • Other valid CSS width values.

If an invalid value is provided, the value defaults to 100%.

set width(val): void

• val: string

string

  • Returns the width of the component.

AnalyticsComponent.width

applyFilters(filters): Promise<void>

Apply the specified filters to the component.

If the filter format is invalid, an ERROR event is thrown and the filter application fails. Please ensure that all filters are correctly formatted and have correct values for the required properties.

• filters: UnifiedFilterJson[]

A list of filters.

Promise<void>

  • A promise that resolves when the filters are applied.

AnalyticsComponent.applyFilters

applyLayout(layout): Promise<void>

Applies a metric layout to the component asynchronously. Use this to show or hide specific parts of the metric.

• layout: MetricLayoutAttributes

The metric layout to apply.

Promise<void>

  • A promise that resolves when the layout has been applied.

applyTimeRange(timeRange): Promise<void>

Apply the specified time range to the metric component.

If the time range filter format is invalid, an ERROR event is thrown and the time range filter application fails. Please ensure the filter is correctly formatted and has correct values for the required properties.

• timeRange: FilterCondition

A MetricTimeRange object representing the time range to apply. Must include a valid operator, and optionally a values array depending on the operator.

Promise<void>

  • A promise that resolves when the time range has been applied.

clearFilters(): Promise<void>

Clears the current list of filters for the component.

Promise<void>

A promise that resolves when the filters are removed.

AnalyticsComponent.clearFilters

clearTimeRange(): Promise<void>

Clears the current time range for the component.

Promise<void>

A promise that resolves when the time range is removed.

export(filename?, filetype?): Promise<void>

Triggers an event requesting an export of the component in the required format.

• filename?: string

The name of the file to export, excluding the file extension. If not provided, the componentName is used.

• filetype?: ExportFileType = ExportFileType.PNG

The format of export. If not provided, defaults to PNG. Supported types: PNG.

Promise<void>

A promise that resolves when the export operation is complete.

Throws an error if the export operation isn't supported.

AnalyticsComponent.export

getFields(dataSources?): Promise<Map<string, Field[]>>

Returns a map of fields associated with the component.

• dataSources?: DataSource[]

A list of data sources to retrieve the fields from. This isn't required for visualizations and metrics. If omitted for dashboards, fields for all available data sources are returned.

Promise<Map<string, Field[]>>

  • A promise that resolves to a map where each key is a string data source API name

and value is an array of Field objects.

AnalyticsComponent.getFields

getFilterFieldValues(fieldApiName, fieldObjectName?, searchTerm?): Promise<any>

Retrieves the values for a specified field.

• fieldApiName: string

Required. The API name of the field to retrieve the values for.

• fieldObjectName?: string

The object name of the field. The fieldObjectName parameter is only required if the specified field has an associated object name. User can know whether field has an associated object name or not in the response of getFields().

• searchTerm?: string

Optional. A search term to filter the field values.

Promise<any>

A promise that resolves with the field values. The exact structure depends on the event handler.

AnalyticsComponent.getFilterFieldValues

getFilters(): Promise<UnifiedFilterJson[]>

Returns the list of filters applied to the component.

Promise<UnifiedFilterJson[]>

A promise that resolves to a list of FilterInfo objects.

AnalyticsComponent.getFilters

getInteractionDetails(): Promise<InteractionDetails>

Returns a comprehensive map containing all available data sources, fields, and filter fields for the component. This method provides a complete overview of the component.

Note: The dataSources array is only available for DashboardComponent

Promise<InteractionDetails>

A promise that resolves to an InteractionDetails object containing:

  • dataSources: Array of available data sources
  • fields: Map where each key is a string data source API name and value is an array of Field objects
  • filterFields: Map where each key is a string data source API name and value is an array of filterable Field objects

AnalyticsComponent.getInteractionDetails

getLayout(): Promise<MetricLayoutAttributes>

Returns the layout of the component asynchronously.

Promise<MetricLayoutAttributes>

  • A promise that resolves with the MetricLayoutAttributes object.

getTimeRange(): Promise<FilterCondition>

Returns the time range applied to the component.

Promise<FilterCondition>

A promise that resolves to time range applied to the component.

reload(): Promise<void>

Reloads the component to retrieve the latest data from the server.

Promise<void>

  • A promise that resolves when reload is complete.

AnalyticsComponent.reload

render(): Promise<string>

Renders the component by appending it to the specified parent element.

Promise<string>

A promise that resolves when the component is loaded successfully, or rejects with an error message if the loading fails.

AnalyticsComponent.render