npm - @arcgis/charts-components - Versions diffs - 5.2.0-next.75 → 5.2.0-next.76 - Mend

@arcgis/charts-components 5.2.0-next.75 → 5.2.0-next.76

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (4) hide show

package/dist/docs/docs.json CHANGED Viewed

	@@ -1 +1 @@
1	- {"deprecation":"docs.json is deprecated and will be removed in a future release. Use api.json instead","timestamp":"2026-08-17T04:38:35","compiler":{"name":"@arcgis/lumina-compiler","version":"5.2.0-next.75","typescriptVersion":"6.0.3"},"components":[{"filePath":"src/components/chart/chart.tsx","tag":"arcgis-chart","overview":"","readme":"","usage":{},"docs":"The ArcGIS Chart component renders a chart by setting a [model](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#model) object that defines the chart's configuration and data.\n\nYou can render a chart either by:\n- Setting [layerItemId](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#layerItemId) and [chartIndex](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#chartIndex) to load a saved chart from a layer item.\n- Create a new chart by using the [`createModel()`](/references/charts-components/model/shared/setup-utils/#createModel) function to create a chart model and set it to the [model](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#model) property.\n\n> [!IMPORTANT]\n>\n> See the [Introduction to charts](https://developers.arcgis.com/javascript/latest/charts-components-intro/) guide for detailed examples on how to render a chart using the above patterns.\n\nThere are 10 supported chart types, each with its own model properties and methods. Refer to the [chart types documentation](https://developers.arcgis.com/javascript/latest/charts/chart-types/) for more information on each chart type.\n\n##### See also:\n- [Tutorial: Display a chart](https://developers.arcgis.com/javascript/latest/tutorials/display-a-chart/)\n- [Tutorial: Chart and map interactions](https://developers.arcgis.com/javascript/latest/tutorials/chart-and-map-interactions/)\n\n> [!WARNING]\n> When the chart is rendering while its container is not yet fully sized, a console error about the chart's attribute height may appear. This is a known issue and should not affect the functionality of the chart.","docsTags":[{"name":"since","text":"4.32"},{"name":"superclass","text":"{\"name\":\"HTMLElement\",\"package\":\"global:\",\"viewUrl\":\"https://developer.mozilla.org/docs/Web/API/HTMLElement\"}"}],"encapsulation":"shadow","dependents":[],"dependencies":[],"dependencyGraph":{},"props":[{"name":"actionMode","type":"ActionModes \| undefined","complexType":{"original":"ActionModes \| undefined","resolved":"ActionModes \| undefined","references":{"ActionModes":{"location":"local","path":"utils/cursor/interfaces","id":"notImplemented"}}},"mutable":true,"attr":"action-mode","reflectToAttr":false,"docs":"Specifies how user interactions on the chart are handled.\n\n- `monoSelection`: Select one data item at a time. Each new selection replaces the previous selection.\n- `multiSelection`: Select multiple data items. Each new selection is added to the existing selection.\n- `multiSelectionWithCtrlKey`: Select multiple data items only while holding Ctrl (or Cmd on macOS). Without the key, selection behaves like `monoSelection`.\n- `zoom`: Zoom into an area of the chart.\n- `none`: Disable interaction-driven selection and zoom actions.\n\nNote: Not applicable to gauges.","docsTags":[],"values":[{"type":"string","value":"none"},{"type":"string","value":"monoSelection"},{"type":"string","value":"multiSelection"},{"type":"string","value":"multiSelectionWithCtrlKey"},{"type":"string","value":"zoom"}],"optional":true,"required":false},{"name":"allowUsingObjectIdStat","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"allow-using-object-id-stat","reflectToAttr":false,"docs":"When `true`, object ID can be used as a numeric field for aggregated charts (for example, `sum` of `objectId`).","docsTags":[],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"animationEnabled","type":"boolean \| undefined","complexType":{"original":"boolean \| undefined","resolved":"boolean \| undefined","references":{}},"mutable":true,"attr":"animation-enabled","reflectToAttr":false,"docs":"When `true`, elements such as data items, axes, and legends will animate when the chart is first rendered or when the chart's configuration is updated.\n\n<video\n src=\"https://developers.arcgis.com/javascript/latest/assets/references/components/chart/animationEnabled.webm\"\n aria-label=\"animationEnabled\"\n width=\"720\"\n autoPlay\n loop\n muted\n playsInline\n/>","docsTags":[{"name":"since","text":"5.1"}],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"aria","type":"DOMContainerAria \| undefined","complexType":{"original":"DOMContainerAria \| undefined","resolved":"DOMContainerAria \| undefined","references":{"DOMContainerAria":{"location":"import","path":"@arcgis/core/views/DOMContainer.js","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"The ARIA attributes for the chart component. Provides accessibility information to assistive technologies such as screen readers. Supports the following properties: [\\`label\\`](https://developer.mozilla.org/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-label), [\\`description\\`](https://developer.mozilla.org/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-description), [\\`describedByElements\\`](https://developer.mozilla.org/docs/Web/API/Element/ariaDescribedByElements), and [\\`labelledByElements\\`](https://developer.mozilla.org/docs/Web/API/Element/ariaLabelledByElements).","docsTags":[{"name":"example","text":"```ts\nchartElement.aria = {\n label: \"Custom chart label\",\n description: \"Custom chart description\",\n};\n```"},{"name":"see","text":"[ARIA attributes](https://developers.arcgis.com/javascript/latest/accessibility/#aria-attributes)"},{"name":"since","text":"5.0"}],"values":[],"optional":true,"required":false},{"name":"autoDestroyDisabled","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"auto-destroy-disabled","reflectToAttr":false,"docs":"When `true`, the component is not destroyed automatically when it is disconnected from the document, which is useful when moving or temporarily hiding it.\n\n> [!CAUTION]\n>\n> Call the [destroy()](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#destroy) method when you are done to prevent memory leaks.","docsTags":[{"name":"since","text":"5.0"}],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"autoDisposeChart","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"auto-dispose-chart","reflectToAttr":false,"docs":"Auto disposes the chart when a new one is created in the same container.","docsTags":[],"default":"false","deprecation":"since 5.0. Use [autoDestroyDisabled](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#autoDestroyDisabled) instead.","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"autoInverseDataLabelTextColor","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"auto-inverse-data-label-text-color","reflectToAttr":false,"docs":"When `true`, the data label text color is automatically adjusted for readability based on its background, switching to either the chart background color or white when the contrast is too low.\n\n\| With `autoInverseDataLabelTextColor` \| Without `autoInverseDataLabelTextColor` \|\n\| -------- \| -------- \|\n\| ![autoInverseDataLabelTextColor true](https://developers.arcgis.com/javascript/latest/assets/references/components/chart/autoInverseDataLabelTextColorTrue.avif) \| ![autoInverseDataLabelTextColor false](https://developers.arcgis.com/javascript/latest/assets/references/components/chart/autoInverseDataLabelTextColorFalse.avif) \|\n\nNote: Applicable to heat charts only.","docsTags":[{"name":"since","text":"4.34"}],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"calciteThemingCSSVariables","type":"CalciteThemeCSSVariables","complexType":{"original":"CalciteThemeCSSVariables","resolved":"CalciteThemeCSSVariables","references":{"CalciteThemeCSSVariables":{"location":"local","path":"utils/components/themes","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Specifies the Calcite CSS variables to use when applying a Calcite theme.\n\nBy default the following variables are used:\n- background: `--calcite-color-foreground-1`\n- text: `--calcite-color-text-1`\n- line: `--calcite-color-border-1`\n- secondary line: `--calcite-color-text-3`\n- spinner: `--calcite-color-brand-hover`\n\nThe chart colors are overridden by those associated to those CSS variables, but only if they have not been customized beforehand.","docsTags":[{"name":"see","text":"[Charts theming with Calcite CSS variables](https://developers.arcgis.com/javascript/latest/charts/features-and-capabilities/styling-and-theming/#theming-with-css-variables)"},{"name":"see","text":"[Components theming with Calcite](https://developers.arcgis.com/javascript/latest/building-your-ui/#styling-and-theming-with-calcite)"},{"name":"since","text":"5.1"}],"values":[],"optional":true,"required":false},{"name":"chartIndex","type":"number \| undefined","complexType":{"original":"number \| undefined","resolved":"number \| undefined","references":{}},"mutable":true,"attr":"chart-index","reflectToAttr":false,"docs":"The index of the chart to be rendered from the layer. Must be used in conjunction with the `layerItemId` or `layer` property.\n\nIf a `layer` or `layerItemId` is set without `chartIndex`, the first chart in the layer will be rendered.\n\nIf the `chartIndex` is out of bounds, the first chart in the layer will be rendered and a warning event will be emitted.","docsTags":[{"name":"example","text":"```html\n<arcgis-chart layer-item-id=\"8871626e970a4f3e9d6113ec63a92f2f\" chart-index=\"2\"></arcgis-chart>\n```"}],"values":[{"type":"number"}],"optional":true,"required":false},{"name":"chartLimits","type":"ChartElementLimit \| undefined","complexType":{"original":"ChartElementLimit \| undefined","resolved":"ChartElementLimit \| undefined","references":{"ChartElementLimit":{"location":"local","path":"utils/defaults/interfaces","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Customize the maximum number of data items allowed on the chart.\n\nThe chart's behavior once that limit is reached can be adjusted through the `behaviorAfterLimit` nested property, to either reject the creation\nor update of the chart, or render the elements up to the given limits.\n\nNote: Not applicable to gauges.","docsTags":[{"name":"example","text":"```ts\nchartElement.chartLimits = {\n behaviorAfterLimit: LimitBehavior.RenderUpToTheLimit,\n maxCategoryCountTotal: 15,\n};\n```"}],"values":[],"optional":true,"required":false},{"name":"chartWillRender","type":"PreRenderCallback \| undefined","complexType":{"original":"PreRenderCallback \| undefined","resolved":"PreRenderCallback \| undefined","references":{"PreRenderCallback":{"location":"local","path":"chart-rendering/common/interfaces","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Lifecycle function executed after the data has been processed and before the chart renders.\nCan be used to alter the model from information extracted from the data.\n\nNote: Applicable to gauges and pie charts only.","docsTags":[],"values":[],"optional":true,"required":false},{"name":"configurationEnabled","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"configuration-enabled","reflectToAttr":false,"docs":"Whether to use features uniquely designed for a chart currently being configured by a user via the UI.\nWhen `true` and if the [arcgis-charts-action-bar](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-charts-action-bar/) is slotted in the chart component,\nthe action bar will expose an \"Edit chart\" action, surface relevant error states, and show a helpful in-container placeholder about the chart’s purpose.","docsTags":[{"name":"since","text":"5.1"}],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"cursorRange","type":"CursorRange \| undefined","complexType":{"original":"CursorRange \| undefined","resolved":"CursorRange \| undefined","references":{"CursorRange":{"location":"local","path":"utils/cursor/interfaces","id":"notImplemented"}}},"mutable":true,"attr":"cursor-range","reflectToAttr":false,"docs":"Defines how the cursor selection rectangle is constrained when [actionMode](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#actionMode) is `zoom`, `multiSelection`, or `multiSelectionWithCtrlKey`.\n\n- `multi-axes`: Allows drawing a free rectangle across both axes.\n- `x-axis`: Constrains the rectangle to the x-axis direction.\n- `y-axis`: Constrains the rectangle to the y-axis direction.\n- `undefined`: Uses the default behavior for the current chart type and action mode.\n\nNote: Not applicable to gauges.","docsTags":[],"values":[{"type":"string","value":"multi-axes"},{"type":"string","value":"x-axis"},{"type":"string","value":"y-axis"}],"optional":true,"required":false},{"name":"dataLabelFormatter","type":"ChartOptions[\"dataLabelFormatter\"] \| undefined","complexType":{"original":"ChartOptions[\"dataLabelFormatter\"] \| undefined","resolved":"ChartOptions[\"dataLabelFormatter\"] \| undefined","references":{"ChartOptions":{"location":"local","path":"chart-rendering/common/interfaces","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Callback function used to format the data labels. If the returned string contains HTML tags they will be interpreted as such.","docsTags":[{"name":"example","text":"```ts\n// Render custom data labels with the stat value and percentage formatted to 2 decimal places.\nchartElement.dataLabelFormatter = (statValue, percent) => {\n return `\n <div>\n Total listings: <strong>${statValue}</strong><br>\n Percentage: <strong>${Number(percent).toFixed(2)}%</strong>\n </div>\n `;\n};\n```\n<img\n src=\"https://developers.arcgis.com/javascript/latest/assets/references/components/chart/dataLabelFormatter.avif\"\n alt=\"dataLabelFormatter true\"\n style=\"max-width: 700px; width: 100%; height: auto;\"\n/>\n\nNote: Not applicable to gauges and radar charts."}],"values":[],"optional":true,"required":false},{"name":"disableInteractions","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"disable-interactions","reflectToAttr":false,"docs":"Disables all interactions on the chart.","docsTags":[],"default":"false","deprecation":"since 5.1. Use [interactionsDisabled](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#interactionsDisabled) instead.","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"disableTogglingLegendItems","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"disable-toggling-legend-items","reflectToAttr":false,"docs":"Disables the toggling of series from the legend items.\n\nNote: Only applicable to multi-series charts.","docsTags":[],"default":"false","deprecation":"since 5.1. Use [togglingLegendItemsDisabled](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#togglingLegendItemsDisabled) instead.","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"enableBetaFeatures","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"enable-beta-features","reflectToAttr":false,"docs":"Whether to enable the beta features from the chart component.","docsTags":[{"name":"internal"}],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"enableConfiguration","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"enable-configuration","reflectToAttr":false,"docs":"Whether to use features uniquely designed for a chart currently being configured by a user via the UI.\nWhen true, the slotted charts action bar will expose an Edit chart action, surfaces relevant error states,\nand can show a helpful in-container placeholder about the chart’s purpose.","docsTags":[],"default":"false","deprecation":"since 5.1. Use [configurationEnabled](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#configurationEnabled) instead.","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"enableResponsiveFeatures","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"enable-responsive-features","reflectToAttr":false,"docs":"Enables the responsive features.","docsTags":[],"default":"false","deprecation":"since 5.1. Won't be replaced.","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"errorPolicy","type":"ErrorPolicy","complexType":{"original":"ErrorPolicy","resolved":"ErrorPolicy","references":{"ErrorPolicy":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"error-policy","reflectToAttr":false,"docs":"When set to `ignore`, the chart fails silently without displaying an error or hiding the chart.\nBy default, it is set to `throw`, which displays an error alert and hides the chart when it can't be created or updated.","docsTags":[],"default":"\"throw\"","values":[{"type":"string","value":"throw"},{"type":"string","value":"ignore"}],"optional":true,"required":false},{"name":"featureIndex","type":"number \| undefined","complexType":{"original":"number \| undefined","resolved":"number \| undefined","references":{}},"mutable":true,"attr":"feature-index","reflectToAttr":false,"docs":"The index of the feature to render when using a feature based gauge.\n\nNote: Applicable to gauges only.","docsTags":[],"deprecation":"since 5.0. Use charts model's [featureIndex](https://developers.arcgis.com/javascript/latest/references/charts-components/model/gauge-model/gauge-model/#featureIndex) prop instead.","values":[{"type":"number"}],"optional":true,"required":false},{"name":"filterByExtent","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"filter-by-extent","reflectToAttr":false,"docs":"When `true`, all chart elements are filtered based on the view extent.","docsTags":[],"default":"false","deprecation":"since 5.1. Use [filterByViewExtent](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#filterByViewExtent) instead.","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"filterBySelection","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"filter-by-selection","reflectToAttr":false,"docs":"When `true`, the chart uses the current selection as a data filter and renders only selected elements instead of rendering the full dataset with selection styling.\nAxis bounds, time binning intervals will be computed based on the selected elements only.\n\nNote: Not applicable to gauges or charts configured with imagery layers.","docsTags":[],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"filterByViewExtent","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"filter-by-view-extent","reflectToAttr":false,"docs":"When `true`, chart queries are constrained to the current map view extent. The chart refreshes as the view extent changes, and the axis bounds or other derived values are recalculated from the view extent data.","docsTags":[],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"gaugeInnerLabelFormatter","type":"GaugeInnerLabelFormatCallback \| undefined","complexType":{"original":"GaugeInnerLabelFormatCallback \| undefined","resolved":"GaugeInnerLabelFormatCallback \| undefined","references":{"GaugeInnerLabelFormatCallback":{"location":"local","path":"chart-rendering/common/interfaces","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Callback function used to format the gauge inner label. If the returned string contains HTML tags they will be interpreted as such.","docsTags":[{"name":"example","text":"```ts\n// Render a centered custom gauge label with the value formatted to 2 decimal places.\nchartElement.gaugeInnerLabelFormatter = (value) => {\n return `<div style=\"text-align: center;\"><u>Custom gauge inner label: </u><br /><b>${Number(value).toFixed(2)}</b></div>`;\n};\n```\n\n<img\n src=\"https://developers.arcgis.com/javascript/latest/assets/references/components/chart/gaugeInnerLabelFormatter.avif\"\n alt=\"gaugeInnerLabelFormatter\"\n style=\"max-width: 700px; width: 100%; height: auto;\"\n/>\n\nNote: Applicable to gauges only."}],"values":[],"optional":true,"required":false},{"name":"guideTooltipFormatter","type":"GuideTooltipFormatCallback \| undefined","complexType":{"original":"GuideTooltipFormatCallback \| undefined","resolved":"GuideTooltipFormatCallback \| undefined","references":{"GuideTooltipFormatCallback":{"location":"local","path":"chart-rendering/common/interfaces","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Callback function used to format the axes guides tooltip. If the returned string contains HTML tags they will be interpreted as such.","docsTags":[{"name":"example","text":"```ts\n// Render a custom tooltip with the guide's start and end values.\nchartElement.guideTooltipFormatter = (props) => {\n return `\n <u>Custom guide tooltip</u><br />\n Range: <b>${props.start} - ${props.end}</b>\n `;\n};\n```\n\n<img\n src=\"https://developers.arcgis.com/javascript/latest/assets/references/components/chart/guideTooltipFormatter.avif\"\n alt=\"guideTooltipFormatter\"\n style=\"max-width: 700px; width: 100%; height: auto;\"\n/>\n\nNote: Not applicable to pie charts."}],"values":[],"optional":true,"required":false},{"name":"hideEmptySeries","type":"boolean \| undefined","complexType":{"original":"boolean \| undefined","resolved":"boolean \| undefined","references":{}},"mutable":true,"attr":"hide-empty-series","reflectToAttr":false,"docs":"When `true`, the empty series are completely hidden from the chart and the legend.\nFor example, a series may become empty after applying a data filter, filter by attribute or geometry (as when using the filter by view extent).\n\nNote: Not applicable to gauges.","docsTags":[],"default":"false","deprecation":"since 5.1. Use [showEmptySeries](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#showEmptySeries) instead.","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"hideLicenseWatermark","type":"boolean \| undefined","complexType":{"original":"boolean \| undefined","resolved":"boolean \| undefined","references":{}},"mutable":true,"attr":"hide-license-watermark","reflectToAttr":false,"docs":"Hides the license watermark.","docsTags":[],"default":"false","deprecation":"since 5.1. Use [showLicenseWatermark](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#showLicenseWatermark) instead.","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"hideLoaderAnimation","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"hide-loader-animation","reflectToAttr":false,"docs":"When `true`, the loader animation is hidden when the chart is being created or updated. By default, it is shown at chart creation and each update (if it takes more than 300ms).\n\| When `hideLoaderAnimation` is `true` \| When `hideLoaderAnimation` is `false` \|\n\| -------- \| -------- \|\n\| <video src=\"https://developers.arcgis.com/javascript/latest/assets/references/components/chart/hideLoaderAnimationTrue.webm\" aria-label=\"animationEnabled\" width=\"720\" autoPlay loop muted playsInline/> \| <video src=\"https://developers.arcgis.com/javascript/latest/assets/references/components/chart/hideLoaderAnimationFalse.webm\" aria-label=\"animationEnabled\" width=\"720\" autoPlay loop muted playsInline/>","docsTags":[],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"hideUIMessages","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"hide-ui-messages","reflectToAttr":false,"docs":"When set to `true`, UI messages are hidden. These messages can be no data warnings, any placeholder messages set or invalid chart configuration.\nBy default, its value is `false`, which displays the messages on the chart.","docsTags":[{"name":"since","text":"5.1"}],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"hideZeroCountCategories","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"hide-zero-count-categories","reflectToAttr":false,"docs":"When `true`, missing categories from a `Count` aggregation are kept as gaps in the chart's data.\n\nWhen data is retrieved from the server, features with a count of 0 are excluded from the response, resulting in missing chart entries.\n\nBy default, the chart's [WebChartGenericDataItem](https://developers.arcgis.com/javascript/latest/references/charts-components/spec/data-source/#WebChartGenericDataItem-dataItems) associated with empty categories (from only a `Count` aggregation) are populated with 0s.","docsTags":[{"name":"since","text":"5.1"}],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"ignoreSmoothRenderingLimit","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"ignore-smooth-rendering-limit","reflectToAttr":false,"docs":"When `true`, disables the default setting that uses debounce functions to handle the visibility of markers\nthat are outside of the plotting area when the min/max bound changes and/or when a zoom action is performed\n(via chart cursor or scrollbar), to increase performance.\n\nThis property will be set when the chart is created and cannot be updated after that.\nIt's recommended that this property should only be set to `true` for small datasets.\nWhen left `undefined`, will be treated as `false`.\n\nNote: Applicable to line charts only.","docsTags":[],"default":"false","deprecation":"since 5.1. Won't be replaced.","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"ignoreViewExtent","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"ignore-view-extent","reflectToAttr":false,"docs":"When `true`, it signals the queries to ignore the view's extent, whether an additional geometry filter is provided or not.\n\nThis property will be effective when the component's [view](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#view) property is provided or when the [layer](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#layer) property is set to [`FeatureLayerView`](/references/core/views/layers/FeatureLayerView/).\n\nBy default the queries made by the chart will consider the view's extent as the unique geometry filter applicable. This implies ignoring any\ngeometry filters passed through the [model](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#model) or the [runtimeDataFilters](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#runtimeDataFilters) properties.","docsTags":[],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"interactionsDisabled","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"interactions-disabled","reflectToAttr":false,"docs":"When `true`, all interactions such as zooming and selection are disabled on the chart. The chart will be rendered in a read-only state.","docsTags":[],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"layer","type":"FeatureLayerView \| SupportedLayer \| SupportedRasterLayer \| undefined","complexType":{"original":"FeatureLayerView \| SupportedLayer \| SupportedRasterLayer \| undefined","resolved":"FeatureLayerView \| SupportedLayer \| SupportedRasterLayer \| undefined","references":{"default":{"location":"import","path":"@arcgis/core/views/layers/FeatureLayerView.js","id":"notImplemented"},"SupportedLayer":{"location":"local","path":"interfaces","id":"notImplemented"},"SupportedRasterLayer":{"location":"local","path":"interfaces","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Used to perform queries.\nIf the layer is a `FeatureLayerView` or if the layer and the `view` property are both provided, the queries will be executed client-side.","docsTags":[],"values":[],"optional":true,"required":false},{"name":"layerFieldsChangePolicy","type":"LayerFieldsChangePolicy","complexType":{"original":"LayerFieldsChangePolicy","resolved":"LayerFieldsChangePolicy","references":{"LayerFieldsChangePolicy":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"layer-fields-change-policy","reflectToAttr":false,"docs":"Allows the chart to update automatically when the layer's `fields` property changes.","docsTags":[],"default":"\"refresh\"","deprecation":"since 5.1. Won't be replaced.","values":[{"type":"string","value":"refresh"},{"type":"string","value":"ignore"}],"optional":true,"required":false},{"name":"layerFilterChangePolicy","type":"LayerFilterChangePolicy","complexType":{"original":"LayerFilterChangePolicy","resolved":"LayerFilterChangePolicy","references":{"LayerFilterChangePolicy":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"layer-filter-change-policy","reflectToAttr":false,"docs":"Whether the chart should be refreshed when the layer's filter (`definitionExpression`) changes.","docsTags":[],"default":"\"refresh\"","deprecation":"since 5.1. Won't be replaced.","values":[{"type":"string","value":"refresh"},{"type":"string","value":"ignore"}],"optional":true,"required":false},{"name":"layerItemId","type":"string \| undefined","complexType":{"original":"string \| undefined","resolved":"string \| undefined","references":{}},"mutable":true,"attr":"layer-item-id","reflectToAttr":false,"docs":"Layer item ID associated with the chart to be rendered. Can be used in conjunction with the `chartIndex` property. If `layerItemId` is set without `chartIndex`, the first chart in the layer will be rendered.\n\nThe layer item ID can be found in the URL of the layer's item page on ArcGIS Online or Enterprise.\nFor example, in the URL `https://www.arcgis.com/home/item.html?id=8871626e970a4f3e9d6113ec63a92f2f`, the layer item ID is `8871626e970a4f3e9d6113ec63a92f2f`.\n\nSupported layer types include: [`FeatureLayer`](/references/core/layers/FeatureLayer), [`SubtypeSublayer`](/references/core/layers/support/SubtypeSublayer), [`ImageryLayer`](/references/core/layers/ImageryLayer), [`ImageryTileLayer`](/references/core/layers/ImageryTileLayer) and [`WCSLayer`](/references/core/layers/WCSLayer).","docsTags":[{"name":"example","text":"```html\n<arcgis-chart layer-item-id=\"8871626e970a4f3e9d6113ec63a92f2f\" chart-index=\"2\"></arcgis-chart>\n```"}],"values":[{"type":"string"}],"optional":true,"required":false},{"name":"layerRendererChangePolicy","type":"LayerRendererChangePolicy","complexType":{"original":"LayerRendererChangePolicy","resolved":"LayerRendererChangePolicy","references":{"LayerRendererChangePolicy":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"layer-renderer-change-policy","reflectToAttr":false,"docs":"Allows the chart to update automatically when the layer's renderer changes. Applies when the color match is enabled.\n\nNote: If the property is set to `ignore` the chart will still use the layer's renderer information when the data is updated.","docsTags":[],"default":"\"refresh\"","deprecation":"since 5.1. Won't be replaced.","values":[{"type":"string","value":"refresh"},{"type":"string","value":"ignore"}],"optional":true,"required":false},{"name":"legendPosition","type":"WebChartLegendPositions \| undefined","complexType":{"original":"WebChartLegendPositions \| undefined","resolved":"WebChartLegendPositions \| undefined","references":{"WebChartLegendPositions":{"location":"local","path":"spec/chart-object-literals","id":"notImplemented"}}},"mutable":true,"attr":"legend-position","reflectToAttr":false,"docs":"Sets the legend's position on the chart.\n\nNote: Not applicable to gauges.","docsTags":[],"deprecation":"since 5.0. Use charts model's [legendPosition](https://developers.arcgis.com/javascript/latest/references/charts-components/model/bar-chart-model/bar-chart-model/#legendPosition) prop instead.","values":[{"type":"string","value":"left"},{"type":"string","value":"right"},{"type":"string","value":"top"},{"type":"string","value":"bottom"}],"optional":true,"required":false},{"name":"legendValueLabelFormatter","type":"PieChartLegendValueLabelFormatCallback \| undefined","complexType":{"original":"PieChartLegendValueLabelFormatCallback \| undefined","resolved":"PieChartLegendValueLabelFormatCallback \| undefined","references":{"PieChartLegendValueLabelFormatCallback":{"location":"local","path":"chart-rendering/common/interfaces","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"When the pie chart label contains either a numeric value or a percentage (which can be set through the\n[displayNumericValueOnLegendItems](https://developers.arcgis.com/javascript/latest/references/charts-components/model/pie-chart-model/pie-chart-model/#displayNumericValueOnLegendItems) and\n[displayPercentageOnLegendItems](https://developers.arcgis.com/javascript/latest/references/charts-components/model/pie-chart-model/pie-chart-model/#displayPercentageOnLegendItems) properties from the pie chart model), this property\ncan be used to format the numeric value and/or percentage. If the returned string contains HTML tags they will be interpreted as such.","docsTags":[{"name":"example","text":"```ts\n// Set the pie chart model to display both numeric value and percentage.\npieChartModel.displayNumericValueOnLegendItems = true;\npieChartModel.displayPercentageOnLegendItems = true;\n\n// Render the numeric value and percentage in bold and italic respectively, with 2 decimal places.\nchartElement.legendValueLabelFormatter = (value, percentage) => {\n return `<strong><u>${Number(value).toFixed(2)}</u></strong> (<em>${Number(percentage).toFixed(2)}%</em>)`;\n};\n```\n\n<img\n src=\"https://developers.arcgis.com/javascript/latest/assets/references/components/chart/legendValueLabelFormatter.avif\"\n alt=\"legendValueLabelFormatter\"\n style=\"max-width: 400px; width: 100%; height: auto;\"\n/>\n\nNote: Applicable to pie charts only."}],"values":[],"optional":true,"required":false},{"name":"legendVisibility","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"legend-visibility","reflectToAttr":false,"docs":"When `true`, the legend is visible on the chart.\n\nNote: Not applicable to gauges.","docsTags":[],"default":"false","deprecation":"since 5.0. Use charts model's [legendVisibility](https://developers.arcgis.com/javascript/latest/references/charts-components/model/bar-chart-model/bar-chart-model/#legendVisibility) prop instead.","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"loaderColors","type":"LoaderColors \| undefined","complexType":{"original":"LoaderColors \| undefined","resolved":"LoaderColors \| undefined","references":{"LoaderColors":{"location":"local","path":"utils/misc/interfaces","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Defines the colors for the loader animation.","docsTags":[{"name":"example","text":"```ts\n// Set a blue curtain and a red spinner for the loader animation\nchartComponent.loaderColors = { curtainColor: [30, 144, 255, 255], spinnerColor: [255, 0, 0, 255] };\n```"}],"deprecation":"since 5.1. Customize the Calcite CSS variables defined by [calciteThemingCSSVariables](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#calciteThemingCSSVariables) instead.","values":[],"optional":true,"required":false},{"name":"messageOverrides","type":"Record<string, unknown> \| undefined","complexType":{"original":"Record<string, unknown> \| undefined","resolved":"Record<string, unknown> \| undefined","references":{"Record":{"location":"global","path":"global:","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Custom messages for translated strings on the chart. If the returned string contains HTML tags they will be interpreted as such.\n\nThe customizable messages can be found thru the [`CommonStringsIdentity`](/references/charts-components/utils/localization/interfaces/#CommonStringsIdentity) variable.","docsTags":[{"name":"example","text":"```ts\n// User sets the xAxisField to a field that doesn't exist in the dataset.\nbarChartModel.xAxisField = \"wrong_field_name\";\n\n// Overrides the default message when there's a query error instead of displaying the default \"Failure to read input data.\" message.\nchartElement.messageOverrides = {\n errorStrings: {\n errors: {\n queryError:\n \"<b><u>The input data provided is invalid, please ensure the xAxisField is correctly specified.</u></b>\"\n },\n },\n };\n```\n\n![messageOverrides](https://developers.arcgis.com/javascript/latest/assets/references/components/chart/messageOverrides.avif)"}],"values":[],"optional":true,"required":false},{"name":"model","type":"ChartModel \| WebChart \| undefined","complexType":{"original":"ChartModel \| WebChart \| undefined","resolved":"ChartModel \| WebChart \| undefined","references":{"ChartModel":{"location":"local","path":"model/chart-model/chart-model","id":"notImplemented"},"WebChart":{"location":"local","path":"spec/web-chart","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Provides an API to interact with the chart's configuration.\n\n`model` accepts either a [ChartModel](https://developers.arcgis.com/javascript/latest/references/charts-components/model/chart-model/chart-model/) instance or a [WebChart](https://developers.arcgis.com/javascript/latest/references/charts-components/spec/web-chart/#WebChart) object.\n- `ChartModel`: A chart model class instance, which can be created using the [createModel](https://developers.arcgis.com/javascript/latest/references/charts-components/model/shared/setup-utils/#createModel) function.\n - This is the recommended approach as it ensures the chart configuration is valid and compatible with the component.\n- `WebChart`: A plain chart configuration object that follows the [WebChart](https://developers.arcgis.com/javascript/latest/references/charts-components/spec/web-chart/#WebChart) specification.","docsTags":[{"name":"see","text":"[Create a new chart with charts model](https://developers.arcgis.com/javascript/latest/charts/#create-a-new-chart-with-charts-model)"}],"values":[],"optional":true,"required":false},{"name":"nullAsValid","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"null-as-valid","reflectToAttr":false,"docs":"When `true`, null values are considered as valid.\n\nBy default, when the data contains only null values, the chart dataset is considered empty:\n- The [@arcgisBadDataWarningRaise](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#event-arcgisBadDataWarningRaise) event will be sent.\n- The \"No data available to display\" warning message will be displayed in the chart container.","docsTags":[],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"placeholder","type":"string \| undefined","complexType":{"original":"string \| undefined","resolved":"string \| undefined","references":{}},"mutable":true,"attr":"placeholder","reflectToAttr":false,"docs":"Placeholder text displayed in the chart container when no chart is configured.\nIf the string contains HTML tags they will be interpreted as such.","docsTags":[{"name":"example","text":"```ts\nchartElement.placeholder = \"<strong>Welcome!</strong><br/>Read the <a href=\\\"https://developers.arcgis.com/javascript/latest/charts/charts-intro/\\\">charts introduction page</a> to get started.\";\n```\n\n![placeholder](https://developers.arcgis.com/javascript/latest/assets/references/components/chart/placeholder.avif)"}],"values":[{"type":"string"}],"optional":true,"required":false},{"name":"popupTemplateFieldInfosEnabled","type":"boolean \| undefined","complexType":{"original":"boolean \| undefined","resolved":"boolean \| undefined","references":{}},"mutable":true,"attr":"popup-template-field-infos-enabled","reflectToAttr":false,"docs":"When `true`, field aliases from layer's [popupTemplate](/references/core/layers/FeatureLayer/#popupTemplate) are used to render field names in tooltips, axes and legend on the chart.","docsTags":[],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"queueChartCreation","type":"boolean \| undefined","complexType":{"original":"boolean \| undefined","resolved":"boolean \| undefined","references":{}},"mutable":true,"attr":"queue-chart-creation","reflectToAttr":false,"docs":"Builds charts sequentially instead of rendering them all at once.","docsTags":[],"default":"false","deprecation":"since 5.1. Use [skipChartCreationQueue](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#skipChartCreationQueue) instead.","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"replaceNoValueCategoryWithZero","type":"boolean \| undefined","complexType":{"original":"boolean \| undefined","resolved":"boolean \| undefined","references":{}},"mutable":true,"attr":"replace-no-value-category-with-zero","reflectToAttr":false,"docs":"When `true`, the chart's `dataItems` associated with empty (no value) categories (from only a `Count` aggregation)\nwill be populated with 0s.","docsTags":[],"default":"false","deprecation":"since 5.0. Use [hideZeroCountCategories](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#hideZeroCountCategories) instead.","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"returnFeaturesExtent","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"return-features-extent","reflectToAttr":false,"docs":"When `true`, the feature extent is returned in the payload of [@arcgisDataProcessComplete](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#event-arcgisDataProcessComplete)\nand [@arcgisSelectionComplete](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#event-arcgisSelectionComplete) events.\nApplies only to:\n- Charts using an aggregation.\n- Data sources using a feature layer compatible with envelope aggregation.\n\nThe extent is returned through the [featuresExtentField](https://developers.arcgis.com/javascript/latest/references/charts-components/utils/defaults/index/#featuresExtentField) variable.\n\nNote: Not applicable to gauges.","docsTags":[],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"returnSelectionIndexes","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"return-selection-indexes","reflectToAttr":false,"docs":"When `true`, selection indexes are computed and returned whenever a selection is made on or passed to the chart.\n\nNote: Not applicable to gauges.","docsTags":[],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"returnSelectionOIDs","type":"boolean \| undefined","complexType":{"original":"boolean \| undefined","resolved":"boolean \| undefined","references":{}},"mutable":true,"attr":"return-selection-oi-ds","reflectToAttr":false,"docs":"When `true`, object ids are computed and returned whenever a selection is made on or passed to the chart.\nOnly considered for data sources using a [feature layer](/references/core/layers/FeatureLayer).\n\nNote: Not applicable to gauges or charts configured with imagery layers.","docsTags":[],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"rotated","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"rotated","reflectToAttr":false,"docs":"When `true`, the chart is rotated 90 degrees so that the x-axis becomes vertical and the y-axis becomes horizontal.\n\nNote: Applicable to bar charts, box plots, combo bar line charts and line charts.","docsTags":[],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"rotation","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"rotation","reflectToAttr":false,"docs":"When `true`, the chart is rotated 90 degrees so that the x-axis becomes vertical and the y-axis becomes horizontal.\n\nNote: Applicable to bar chart, line chart, combo bar line chart and box plot.","docsTags":[],"default":"false","deprecation":"since 5.0. Use either [rotated](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#rotated) or the charts model's [rotated](https://developers.arcgis.com/javascript/latest/references/charts-components/model/bar-chart-model/bar-chart-model/#rotated) prop instead.","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"runtimeDataFilters","type":"WebChartDataFilters \| undefined","complexType":{"original":"WebChartDataFilters \| undefined","resolved":"WebChartDataFilters \| undefined","references":{"WebChartDataFilters":{"location":"local","path":"spec/web-chart","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Applies runtime data filters to the chart, features will be filtered based on the provided key value pairs.\n\nSupported keys are `where`, `objectIds`, `geometry`, `spatialRelationship`, `distance`, `units`, `timeExtent`, and `gdbVersion`.","docsTags":[{"name":"example","text":"```ts\n// This example filters the chart to show only features with the name \"Katrina\", object IDs 12, 19, and 27, within a specified geometry, within 10 miles and a specific time extent.\nconst start = new Date(2005, 8, 23).getTime();\nconst end = new Date(2005, 8, 28).getTime();\n\nchartComponent.runtimeDataFilters = {\n where: \"Name = 'Katrina'\",\n objectIds: [12, 19, 27],\n geometry: {\n xmin: -130,\n ymin: 20,\n xmax: -60,\n ymax: 55,\n },\n spatialRelationship: \"contains\",\n distance: 10,\n units: \"miles\",\n timeExtent: [start, end]\n};\n```"}],"values":[],"optional":true,"required":false},{"name":"secondaryYAxisLabelFormatter","type":"AxisLabelFormatCallback \| undefined","complexType":{"original":"AxisLabelFormatCallback \| undefined","resolved":"AxisLabelFormatCallback \| undefined","references":{"AxisLabelFormatCallback":{"location":"local","path":"chart-rendering/common/interfaces","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Callback function used to format the secondary y-axis labels. If the returned string contains HTML tags they will be interpreted as such.","docsTags":[{"name":"example","text":"```ts\n// Render a custom secondary y-axis label with the value formatted as a compact currency.\nchartElement.secondaryYAxisLabelFormatter = (value) => {\n const formattedValue = new Intl.NumberFormat(\"en-US\", {\n style: \"currency\",\n currency: \"USD\",\n notation: \"compact\",\n maximumFractionDigits: 1,\n }).format(value);\n return `<strong>${formattedValue}</strong>`;\n};\n```\n\n![secondaryYAxisLabelFormatter](https://developers.arcgis.com/javascript/latest/assets/references/components/chart/secondaryYAxisLabelFormatter.avif)\n\nNote: Applicable to bar, line, and combo bar line charts configured with dual axes through the [setSeriesToSecondaryYAxis](https://developers.arcgis.com/javascript/latest/references/charts-components/model/bar-chart-model/bar-chart-model/#setSeriesToSecondaryYAxis) method."}],"values":[],"optional":true,"required":false},{"name":"selectionData","type":"SelectionData \| undefined","complexType":{"original":"SelectionData \| undefined","resolved":"SelectionData \| undefined","references":{"SelectionData":{"location":"local","path":"utils/misc/interfaces","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Applies a programmatic selection to the chart. The payload can target chart elements by object IDs (`selectionOIDs`), by indexes (`selectionIndexes`), or by items (`selectionItems`).\n\n##### Selection by object IDs\nWhen passing in a `selectionOIDs` array, the chart will match the provided object IDs with the chart's data items and apply the selection.","docsTags":[{"name":"example","text":"```ts\n// This selects the chart data items (`Mid East` and `Great Lakes`) that contains the object IDs \"3118\" and \"6544\".\nchartElement.selectionData = {\n selectionOIDs: [3118, 6544],\n};\n```\n\n<img\n src=\"https://developers.arcgis.com/javascript/latest/assets/references/components/chart/selectionData_selectionOIDs.avif\"\n alt=\"selectionOIDs\"\n style=\"max-width: 600px; width: 100%; height: auto;\"\n/>\n\n##### Selection by items\nWhen passing in a `selectionItems` array, the chart will match the provided items with the chart's data items and apply the selection."},{"name":"example","text":"```ts\n// This selects the first chart data item with the matching items.\nchartElement.selectionData = {\n selectionItems: [\n {\n // The field name and value\n neighbourhood_group: \"Manhattan\",\n // The y-series field name and value, 0 indicates the first series.\n COUNT_OBJECTID_0: \"\",\n },\n ],\n};\n```\n\n<img\n src=\"https://developers.arcgis.com/javascript/latest/assets/references/components/chart/selectionData_selectionItems.avif\"\n alt=\"selectionItems\"\n style=\"max-width: 600px; width: 100%; height: auto;\"\n/>\n\nNote: Not applicable to gauges."}],"values":[],"optional":true,"required":false},{"name":"selectionManager","type":"SelectionManager \| undefined","complexType":{"original":"SelectionManager \| undefined","resolved":"SelectionManager \| undefined","references":{"default":{"location":"import","path":"@arcgis/core/views/SelectionManager.js","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Selection manager object used to synchronize the selections with the chart when [syncViewSelection](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#syncViewSelection) is `true`.\nIt has precedence over the layer view's [SelectionManager](/references/core/views/SelectionManager/) when both are available.","docsTags":[{"name":"since","text":"5.1"}],"values":[],"optional":true,"required":false},{"name":"selectionTheme","type":"SelectionTheme \| undefined","complexType":{"original":"SelectionTheme \| undefined","resolved":"SelectionTheme \| undefined","references":{"SelectionTheme":{"location":"local","path":"utils/misc/interfaces","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Customizes the visual style applied to selected and non-selected chart data items (bars, slices, markers, boxes etc.).\n\n- The [`selectedElementsTheme`](/references/charts-components/utils/misc/interfaces/#SelectionTheme-selectedElementsTheme) property controls the appearance of selected elements.\n- The [`nonSelectedElementsTheme`](/references/charts-components/utils/misc/interfaces/#SelectionTheme-nonSelectedElementsTheme) property controls the appearance of elements that are not selected.","docsTags":[{"name":"example","text":"```ts\nchartElement.selectionTheme = {\n // The selected elements will have a magenta outline with a width of 3 pixels and will be scaled up by 10%.\n selectedElementsTheme: {\n elementOutlineColor: [255, 0, 237, 255],\n elementOutlineWidth: 3,\n transformation: {\n scale: 1.1,\n },\n },\n // The non-selected elements will be scaled down by 20% and have their opacity reduced to 50%.\n nonSelectedElementsTheme: {\n transformation: {\n scale: 0.8,\n opacity: 0.5,\n },\n },\n};\n```\n\n<img\n src=\"https://developers.arcgis.com/javascript/latest/assets/references/components/chart/selectionTheme.avif\"\n alt=\"selectionTheme\"\n style=\"max-width: 700px; width: 100%; height: auto;\"\n/>\n\nNote: Not applicable to gauges."}],"values":[],"optional":true,"required":false},{"name":"setTimeBinningInfoWhenNotProvided","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"set-time-binning-info-when-not-provided","reflectToAttr":false,"docs":"When `true`, the time binning unit and size is automatically set when not provided via the [`temporalBinningSize`](/references/charts-components/model/bar-chart-model/bar-chart-model/#temporalBinningSize) or [`temporalBinningUnit`](/references/charts-components/model/line-chart-model/line-chart-model/#temporalBinningUnit) properties of the chart model.\n\nThe time binning unit and size information for the chart will be derived from the dataset's date minimum and maximum values to compute an interval that best fits the date range.\n\nNote: Only applicable to charts with temporal binning enabled (bar chart, combo bar line chart, line chart, radar chart).","docsTags":[],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"showEmptySeries","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"show-empty-series","reflectToAttr":false,"docs":"When `true`, show the series on the chart and legend even if it doesn't contain any data.\n\nBy default, the empty series are hidden from the chart and the legend.","docsTags":[{"name":"example","text":"```ts\n// In this example, we first set a data filter to only include features with a room type of \"Entire home/apt\" or \"Private room\".\n// The \"Shared room\" series will be empty after applying the data filter.\nchartElement.runtimeDataFilters = {\n where: \"room_type = 'Entire home/apt' OR room_type = 'Private room'\",\n};\n\n// With the `showEmptySeries` property set to `true`,\n// the \"Shared room\" series will still be displayed on the chart and in the legend, even though it was filtered out.\nchartElement.showEmptySeries = true;\n```\n\n<img\n src=\"https://developers.arcgis.com/javascript/latest/assets/references/components/chart/showEmptySeries.avif\"\n alt=\"showEmptySeries\"\n style=\"max-width: 700px; width: 100%; height: auto;\"\n/>\n\nNote: Not applicable to gauges."},{"name":"since","text":"5.1"}],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"showLicenseWatermark","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"show-license-watermark","reflectToAttr":false,"docs":"When `true`, the license watermark is displayed on the lower left corner of the chart.","docsTags":[{"name":"since","text":"5.1"}],"default":"false","deprecation":"since 5.2. Won't be replaced.","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"showUIMessages","type":"boolean \| undefined","complexType":{"original":"boolean \| undefined","resolved":"boolean \| undefined","references":{}},"mutable":true,"attr":"show-ui-messages","reflectToAttr":false,"docs":"Whether to display or hide all UI messages (e.g. no data warnings, any placeholder messages set or invalid chart configuration).","docsTags":[],"default":"false","deprecation":"since 5.1. Use [hideUIMessages](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#hideUIMessages) instead.","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"skipChartCreationQueue","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"skip-chart-creation-queue","reflectToAttr":false,"docs":"When `true`, charts will render immediately without waiting for other charts to finish rendering.\nBy default, charts are queued so that only one chart renders at a time.","docsTags":[{"name":"since","text":"5.1"}],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"syncChartsSelection","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"sync-charts-selection","reflectToAttr":false,"docs":"When `true`, the selection will be synchronized between charts configured with the same layer.","docsTags":[{"name":"example","text":"```ts\n// Both charts are configured with the same layer.\n// The \"Private room\" slice is selected on the pie chart and the selection is reflected on the bar chart.\nchartElement1.syncChartsSelection = true;\nchartElement2.syncChartsSelection = true;\n```\n\n<img\n src=\"https://developers.arcgis.com/javascript/latest/assets/references/components/chart/syncChartsSelection.avif\"\n alt=\"syncChartsSelection\"\n style=\"max-width: 700px; width: 100%; height: auto;\"\n/>"},{"name":"since","text":"5.1"}],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"syncSelection","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"sync-selection","reflectToAttr":false,"docs":"Whether to synchronize the selection between chart components from the same layer.","docsTags":[],"default":"false","deprecation":"since 5.1. Use [syncChartsSelection](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#syncChartsSelection) prop instead.","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"syncSelectionsBetweenChartAndLayerViewPolicy","type":"SyncSelectionsBetweenChartAndLayerViewPolicy","complexType":{"original":"SyncSelectionsBetweenChartAndLayerViewPolicy","resolved":"SyncSelectionsBetweenChartAndLayerViewPolicy","references":{"SyncSelectionsBetweenChartAndLayerViewPolicy":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"sync-selections-between-chart-and-layer-view-policy","reflectToAttr":false,"docs":"Determines whether the chart's selection should be synchronized with either the chart's [selectionManager](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#selectionManager) or the layer view's.","docsTags":[],"default":"\"disabled\"","deprecation":"since 5.1. Use [syncViewSelection](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#syncViewSelection) prop instead.","values":[{"type":"string","value":"disabled"},{"type":"string","value":"enabled"}],"optional":true,"required":false},{"name":"syncViewSelection","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"sync-view-selection","reflectToAttr":false,"docs":"Determines whether the chart's selection should be synchronized with either the chart's [selectionManager](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#selectionManager) or the layer view's.","docsTags":[{"name":"since","text":"5.1"}],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"syncViewTimeExtent","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"sync-view-time-extent","reflectToAttr":false,"docs":"Whether the chart should be refreshed when the view's time extent changes.\n\nNote: Not supported for histogram.","docsTags":[{"name":"since","text":"5.1"}],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"syncViewTimeZone","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"sync-view-time-zone","reflectToAttr":false,"docs":"Whether the chart's data should be in sync with the view's [timeZone](/references/core/views/MapView/#timeZone).\n\nNote: This applies only to charts supporting temporal data. Additionally if the data is binned, it applies only if the layer has the\ncapacity to handle the `/queryBins` operation. For any other case the chart will ignore the view's time zone regardless of the value of this property.","docsTags":[{"name":"since","text":"5.1"}],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"syncViewTimeZoneInclusionList","type":"(typeof WebChartTypes.BarSeries \| typeof WebChartTypes.ComboLineAndBarSeries \| typeof WebChartTypes.HeatSeries \| typeof WebChartTypes.LineSeries \| typeof WebChartTypes.RadarSeries)[]","complexType":{"original":"(typeof WebChartTypes.BarSeries \| typeof WebChartTypes.ComboLineAndBarSeries \| typeof WebChartTypes.HeatSeries \| typeof WebChartTypes.LineSeries \| typeof WebChartTypes.RadarSeries)[]","resolved":"(typeof WebChartTypes.BarSeries \| typeof WebChartTypes.ComboLineAndBarSeries \| typeof WebChartTypes.HeatSeries \| typeof WebChartTypes.LineSeries \| typeof WebChartTypes.RadarSeries)[]","references":{"WebChartTypes":{"location":"local","path":"spec/chart-object-literals","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"List of chart types to include from syncing the view's [`timeZone`](/references/core/views/MapView/#timeZone) with the data. Currently heat charts are included by default.\n\nNote: This applies only to charts supporting temporal data. Additionally if the data is binned, it applies only if the layer has the\ncapacity to handle the `/queryBins` operation. For any other case the chart will ignore the view's time zone regardless of the content of this list.","docsTags":[],"deprecation":"since 5.1. Use [syncViewTimeZone](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#syncViewTimeZone) instead.","values":[],"optional":true,"required":false},{"name":"timeZone","type":"MapView[\"timeZone\"] \| undefined","complexType":{"original":"MapView[\"timeZone\"] \| undefined","resolved":"MapView[\"timeZone\"] \| undefined","references":{"default":{"location":"import","path":"@arcgis/core/views/MapView.js","id":"notImplemented"}}},"mutable":true,"attr":"time-zone","reflectToAttr":false,"docs":"Used to set a custom time zone for the chart.","docsTags":[{"name":"example","text":"```ts\nchartComponent.timeZone = \"America/Los_Angeles\";\n```"}],"values":[{"type":"string"}],"optional":true,"required":false},{"name":"togglingLegendItemsDisabled","type":"boolean \| undefined","complexType":{"original":"boolean \| undefined","resolved":"boolean \| undefined","references":{}},"mutable":true,"attr":"toggling-legend-items-disabled","reflectToAttr":false,"docs":"When `true`, disables the toggling of series or slices from the legend items. Clicking on the legend items will not hide or show the corresponding elements on the chart.\n\nNote: Only applicable to charts with multiple series and while the legend is displayed.","docsTags":[],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"tooltipFormatter","type":"ChartOptions[\"tooltipFormatter\"] \| undefined","complexType":{"original":"ChartOptions[\"tooltipFormatter\"] \| undefined","resolved":"ChartOptions[\"tooltipFormatter\"] \| undefined","references":{"ChartOptions":{"location":"local","path":"chart-rendering/common/interfaces","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Callback function used to format the tooltips when hovering over a chart element. If the returned string contains HTML tags they will be interpreted as such.","docsTags":[{"name":"example","text":"```ts\n// Render a custom tooltip with the series name, x-value, and stat value.\nchartElement.tooltipFormatter = (props) => `\n <div>\n <div><strong>${props.seriesName}</strong> in <strong>${props.xValue}</strong></div>\n <div>Total listings: <strong>${props.statValue}</strong></div>\n </div>\n`;\n```\n\n![tooltipFormatter](https://developers.arcgis.com/javascript/latest/assets/references/components/chart/tooltipFormatter.avif)\n\nNote: Not applicable to gauges."}],"values":[],"optional":true,"required":false},{"name":"updateSplitBySeries","type":"MissingSplitBySeriesProps \| undefined","complexType":{"original":"MissingSplitBySeriesProps \| undefined","resolved":"MissingSplitBySeriesProps \| undefined","references":{"MissingSplitBySeriesProps":{"location":"local","path":"utils/components/interfaces","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Whether to automatically add the missing series to cover the split-by values not referenced in the configuration.\n- This property only applies to plain chart configuration object that's constructed following the [WebChart](https://developers.arcgis.com/javascript/latest/references/charts-components/spec/web-chart/#WebChart) specification.\n - When [`addMissingSeries`](/references/charts-components/utils/components/interfaces/#MissingSplitBySeriesProps-addMissingSeries) is set to `true`, the missing series will be added.\n - When [`seriesTemplate`](/references/charts-components/utils/components/interfaces/#MissingSplitBySeriesProps-seriesTemplate) is omitted, the first existing series from the configuration will be copied to be used as a model for the missing ones. The chart won't render if the series template is not set and there's no series in the configuration.\n- If a chart is configured using a chart model, this property is not necessary as the split-by series will be updated automatically when the model's properties are changed.\n\nNote: Applicable only to bar chart, box plot, line chart and radar chart when a split-by field is used.","docsTags":[],"values":[],"optional":true,"required":false},{"name":"useAnimatedCharts","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"use-animated-charts","reflectToAttr":false,"docs":"Enable animation on the chart.","docsTags":[],"default":"false","deprecation":"since 5.1. Use [animationEnabled](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#animationEnabled) instead.","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"usePopupTemplateFieldsInfo","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"use-popup-template-fields-info","reflectToAttr":false,"docs":"Allows the use of the fields alias from the `layer.popupTemplate` when rendering the field names on the chart (e.g. tooltips, axes, legend).","docsTags":[],"default":"false","deprecation":"since 5.1. Use [popupTemplateFieldInfosEnabled](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#popupTemplateFieldInfosEnabled) instead.","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"view","type":"MapView \| SceneView \| undefined","complexType":{"original":"MapView \| SceneView \| undefined","resolved":"MapView \| SceneView \| undefined","references":{"default":{"location":"import","path":"@arcgis/core/views/SceneView.js","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Used to access the feature layer view instance in order to perform client side queries.","docsTags":[],"values":[],"optional":true,"required":false},{"name":"viewTimeExtentChangePolicy","type":"ViewTimeExtentChangePolicy","complexType":{"original":"ViewTimeExtentChangePolicy","resolved":"ViewTimeExtentChangePolicy","references":{"ViewTimeExtentChangePolicy":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"view-time-extent-change-policy","reflectToAttr":false,"docs":"Whether the chart should be refreshed when the view's time extent changes.","docsTags":[],"default":"\"ignore\"","deprecation":"since 5.1. Use [syncViewTimeExtent](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#syncViewTimeExtent) prop instead.\n\nNote: Not applicable for histograms.","values":[{"type":"string","value":"refresh"},{"type":"string","value":"ignore"}],"optional":true,"required":false},{"name":"xAxisLabelFormatter","type":"AxisLabelFormatCallback \| undefined","complexType":{"original":"AxisLabelFormatCallback \| undefined","resolved":"AxisLabelFormatCallback \| undefined","references":{"AxisLabelFormatCallback":{"location":"local","path":"chart-rendering/common/interfaces","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Callback function used to format the x-axis labels. If the returned string contains HTML tags they will be interpreted as such.","docsTags":[{"name":"example","text":"```ts\n// Render a custom x-axis label with underlined string and bolded value.\nchartElement.xAxisLabelFormatter = (value) => {\n return `<u>Neighbourhood Group:</u> <strong>${value}</strong>`;\n};\n```\n\n![xAxisLabelFormatter](https://developers.arcgis.com/javascript/latest/assets/references/components/chart/xAxisLabelFormatter.avif)\n\nNote: Only applicable to charts with x-axis labels displayed."}],"values":[],"optional":true,"required":false},{"name":"yAxisLabelFormatter","type":"AxisLabelFormatCallback \| undefined","complexType":{"original":"AxisLabelFormatCallback \| undefined","resolved":"AxisLabelFormatCallback \| undefined","references":{"AxisLabelFormatCallback":{"location":"local","path":"chart-rendering/common/interfaces","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Callback function used to format the y-axis labels. If the returned string contains HTML tags they will be interpreted as such.","docsTags":[{"name":"example","text":"```ts\n// Render a custom y-axis label with underlined string and bolded value.\nchartElement.yAxisLabelFormatter = (value) => {\n return `<u>Rental Listings:</u> <strong>${value}</strong>`;\n};\n```\n\n![yAxisLabelFormatter](https://developers.arcgis.com/javascript/latest/assets/references/components/chart/yAxisLabelFormatter.avif)\n\nNote: Only applicable to charts with y-axis labels displayed."}],"values":[],"optional":true,"required":false}],"methods":[{"name":"applySelectionFromSelectionManager","returns":{"type":"void","docs":""},"complexType":{"signature":"(): void","parameters":[],"return":"void","references":{}},"signature":"applySelectionFromSelectionManager(): void","parameters":[],"docs":"Apply the selection from the selection manager to the chart.","docsTags":[{"name":"internal"}]},{"name":"clearSelection","returns":{"type":"Promise<void>","docs":""},"complexType":{"signature":"(): Promise<void>","parameters":[],"return":"Promise<void>","references":{"Promise":{"location":"global","path":"global:","id":"notImplemented"}}},"signature":"clearSelection(): Promise<void>","parameters":[],"docs":"Clears all selection on the chart.\n\nNote: Not applicable to gauge.","docsTags":[]},{"name":"componentOnReady","returns":{"type":"Promise<this>","docs":""},"complexType":{"signature":"(): Promise<this>","parameters":[],"return":"Promise<this>","references":{"Promise":{"location":"import","path":"typescript/lib/lib.es5.d.ts","id":"notImplemented"}}},"signature":"componentOnReady(): Promise<this>","parameters":[],"docs":"Creates a promise that resolves once the component is fully loaded.","docsTags":[{"name":"example","text":"```js\nconst arcgisChart = document.createElement(\"arcgis-chart\");\ndocument.body.append(arcgisChart);\nawait arcgisChart.componentOnReady();\nconsole.log(\"arcgis-chart is ready to go!\");\n```"},{"name":"inheritedFrom","text":"{\"name\":\"this\"}"}]},{"name":"destroy","returns":{"type":"Promise<void>","docs":""},"complexType":{"signature":"(): Promise<void>","parameters":[],"return":"Promise<void>","references":{"Promise":{"location":"global","path":"global:","id":"notImplemented"}}},"signature":"destroy(): Promise<void>","parameters":[],"docs":"Destroys the chart instance.","docsTags":[{"name":"since","text":"5.1"}]},{"name":"errorAlert","returns":{"type":"Promise<void>","docs":""},"complexType":{"signature":"(errorMessage?: string): Promise<void>","parameters":[{"name":"errorMessage","type":"string","docs":""}],"return":"Promise<void>","references":{"Promise":{"location":"global","path":"global:","id":"notImplemented"}}},"signature":"errorAlert(errorMessage?: string): Promise<void>","parameters":[{"name":"errorMessage","type":"string","docs":""}],"docs":"Triggers an alert to display an error message.","docsTags":[],"deprecation":"since 5.1. Won't be replaced."},{"name":"exportAsCSV","returns":{"type":"Promise<void>","docs":""},"complexType":{"signature":"(options?: CSVOptions): Promise<void>","parameters":[{"name":"options","type":"CSVOptions","docs":"The options to customize the exported CSV file."}],"return":"Promise<void>","references":{"Promise":{"location":"global","path":"global:","id":"notImplemented"},"CSVOptions":{"location":"local","path":"interfaces","id":"notImplemented"}}},"signature":"exportAsCSV(options?: CSVOptions): Promise<void>","parameters":[{"name":"options","type":"CSVOptions","docs":"The options to customize the exported CSV file."}],"docs":"Export the current chart's data as a CSV file.","docsTags":[{"name":"example","text":"```ts\n// Export the chart's data as a CSV file with custom options.\nawait chartElement.exportAsCSV({\n columns: [\"neighbourhood_group\", \"room_type\", \"Count\"],\n delimiter: \"\|\",\n includeHeader: false,\n quoteAll: true,\n locale: \"fr\"\n});\n```\n\n```csv\n// The exported CSV file will contain the following data:\nsep=\|\n\"Bronx\"\|\"Entire home/apt\"\|\"379\"\n\"Bronx\"\|\"Private room\"\|\"652\"\n\"Bronx\"\|\"Shared room\"\|\"60\"\n\"Brooklyn\"\|\"Entire home/apt\"\|\"9 559\"\n...\n```\n\nNote: Not supported for gauges, scatterplots and radar charts."}]},{"name":"exportAsImage","returns":{"type":"Promise<void>","docs":""},"complexType":{"signature":"(format?: DownloadableChartImagesTypes): Promise<void>","parameters":[{"name":"format","type":"DownloadableChartImagesTypes","docs":"The image format to export the chart as. Default: `png`."}],"return":"Promise<void>","references":{"Promise":{"location":"global","path":"global:","id":"notImplemented"},"DownloadableChartImagesTypes":{"location":"local","path":"utils/components/interfaces","id":"notImplemented"}}},"signature":"exportAsImage(format?: DownloadableChartImagesTypes): Promise<void>","parameters":[{"name":"format","type":"DownloadableChartImagesTypes","docs":"The image format to export the chart as. Default: `png`."}],"docs":"Exports and downloads the current chart as an image.\n- Supported formats: `png` (default), `jpeg`, `jpg`, `webp`, and `svg`.\n - When `webp` format is used on Safari, it will fallback to `png`.","docsTags":[]},{"name":"loadModel","returns":{"type":"Promise<void>","docs":""},"complexType":{"signature":"(): Promise<void>","parameters":[],"return":"Promise<void>","references":{"Promise":{"location":"global","path":"global:","id":"notImplemented"}}},"signature":"loadModel(): Promise<void>","parameters":[],"docs":"Returns a promise that resolves when the chart model is fully loaded.\n\nThis method should be used when loading a chart with [layerItemId](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#layerItemId) and [chartIndex](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#chartIndex), and further customization of the chart model is needed.","docsTags":[{"name":"example","text":"```html\n// Load a chart from a layer item\n<arcgis-chart layer-item-id=\"8871626e970a4f3e9d6113ec63a92f2f\" chart-index=\"2\" />\n```\n```ts\n// Get a reference to the chart element in the DOM\nconst chartElement = document.querySelector(\"arcgis-chart\");\n\n// Call the method to ensure the model is fully loaded before making changes\nawait chartElement.loadModel();\n\n// Once the model is loaded, use the model's properties/methods to customize\nchartElement.model.titleText = \"New Title\";\n```"},{"name":"see","text":"[Load from layer item and customize with charts model](https://developers.arcgis.com/javascript/latest/charts/#load-from-layer-item-and-customize-with-charts-model)"}]},{"name":"notify","returns":{"type":"Promise<void>","docs":""},"complexType":{"signature":"(message?: string, heading?: string): Promise<void>","parameters":[{"name":"message","type":"string","docs":"The message to display in the chart's container."},{"name":"heading","type":"string","docs":"The heading to display in the chart's container."}],"return":"Promise<void>","references":{"Promise":{"location":"global","path":"global:","id":"notImplemented"}}},"signature":"notify(message?: string, heading?: string): Promise<void>","parameters":[{"name":"message","type":"string","docs":"The message to display in the chart's container."},{"name":"heading","type":"string","docs":"The heading to display in the chart's container."}],"docs":"Passes external messages to the chart component and displays them in the chart's container.\nWhen a model update is overriding the notification modal, consider waiting for the [@arcgisUpdateComplete](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#event-arcgisUpdateComplete) event.","docsTags":[{"name":"example","text":"```html\n<button id=\"show-notification\" type=\"button\">Show notification</button>\n<button id=\"clear-notification\" type=\"button\">Clear notification</button>\n```\n\n```ts\n// When the \"Show notification\" button is clicked, the chart's container will display a custom message and heading.\ndocument.querySelector(\"#show-notification\").addEventListener(\"click\", () => {\n chartElement.notify(\n \"This is a notification message.\",\n \"Notification heading\",\n );\n});\n\n// When the \"Clear notification\" button is clicked, the chart's container will be cleared and hidden.\ndocument.querySelector(\"#clear-notification\").addEventListener(\"click\", () => {\n chartElement.notify();\n});\n```"}]},{"name":"refresh","returns":{"type":"Promise<void>","docs":""},"complexType":{"signature":"(props?: {\n updateData?: boolean;\n resetAxesBounds?: boolean;\n}): Promise<void>","parameters":[{"name":"props","type":"{\n updateData?: boolean;\n resetAxesBounds?: boolean;\n}","docs":"Properties to control the refresh behavior: `updateData` indicates whether to fetch new data (default: `true`), and `resetAxesBounds` indicates whether to reset the axes bounds along with the refresh (default: `false`)."}],"return":"Promise<void>","references":{"Promise":{"location":"global","path":"global:","id":"notImplemented"}}},"signature":"refresh(props?: {\n updateData?: boolean;\n resetAxesBounds?: boolean;\n}): Promise<void>","parameters":[{"name":"props","type":"{\n updateData?: boolean;\n resetAxesBounds?: boolean;\n}","docs":"Properties to control the refresh behavior: `updateData` indicates whether to fetch new data (default: `true`), and `resetAxesBounds` indicates whether to reset the axes bounds along with the refresh (default: `false`)."}],"docs":"Re-render the chart.","docsTags":[]},{"name":"resetZoom","returns":{"type":"Promise<void>","docs":""},"complexType":{"signature":"(): Promise<void>","parameters":[],"return":"Promise<void>","references":{"Promise":{"location":"global","path":"global:","id":"notImplemented"}}},"signature":"resetZoom(): Promise<void>","parameters":[],"docs":"Resets the chart's zoom and brings it back to full zoom extent.\n\nNote: Not applicable to gauges, heat charts, pie charts and radar charts.","docsTags":[]},{"name":"switchSelection","returns":{"type":"Promise<void>","docs":""},"complexType":{"signature":"(): Promise<void>","parameters":[],"return":"Promise<void>","references":{"Promise":{"location":"global","path":"global:","id":"notImplemented"}}},"signature":"switchSelection(): Promise<void>","parameters":[],"docs":"Switches the selection on the chart.\n\nNote: Not applicable to gauges.","docsTags":[]}],"events":[{"event":"arcgisAxesMinMaxChange","detail":"AxesMinMaxChangePayload","bubbles":true,"complexType":{"original":"AxesMinMaxChangePayload","resolved":"AxesMinMaxChangePayload","references":{"AxesMinMaxChangePayload":{"location":"local","path":"utils/components/event-payloads","id":"notImplemented"}}},"cancelable":true,"composed":true,"docs":"Event triggered once the chart axes min/max values are computed.","docsTags":[]},{"event":"arcgisBadDataWarningRaise","detail":"DataWarningObject","bubbles":true,"complexType":{"original":"DataWarningObject","resolved":"DataWarningObject","references":{"DataWarningObject":{"location":"local","path":"utils/chart-config/validator/interfaces","id":"notImplemented"}}},"cancelable":true,"composed":true,"docs":"Event triggered when an error is detected with the data set.","docsTags":[]},{"event":"arcgisChartNotFoundWarning","detail":"string","bubbles":true,"complexType":{"original":"string","resolved":"string","references":{}},"cancelable":true,"composed":true,"docs":"Event triggered when the chart is not found for the given [chartIndex](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#chartIndex) property.","docsTags":[]},{"event":"arcgisConfigChange","detail":"{\n newConfig: WebChart \| undefined;\n oldConfig: WebChart \| undefined;\n functionCalled: string \| undefined;\n}","bubbles":true,"complexType":{"original":"{\n newConfig: WebChart \| undefined;\n oldConfig: WebChart \| undefined;\n functionCalled: string \| undefined;\n}","resolved":"{\n newConfig: WebChart \| undefined;\n oldConfig: WebChart \| undefined;\n functionCalled: string \| undefined;\n}","references":{"WebChart":{"location":"local","path":"spec/web-chart","id":"notImplemented"}}},"cancelable":true,"composed":true,"docs":"Event triggered when the chart config is changed.","docsTags":[]},{"event":"arcgisDataFetchComplete","detail":"WebChartDataTypes","bubbles":true,"complexType":{"original":"WebChartDataTypes","resolved":"WebChartDataTypes","references":{"WebChartDataTypes":{"location":"local","path":"spec/data-source","id":"notImplemented"}}},"cancelable":true,"composed":true,"docs":"Event triggered once the chart data has been fetched but not yet fully processed.\n\nFor instance it can be useful to see all the slices before they get grouped into an 'other' slice during the post-processing step.\n\nNote: Applicable to pie charts only.","docsTags":[]},{"event":"arcgisDataProcessComplete","detail":"DataProcessCompletePayload","bubbles":true,"complexType":{"original":"DataProcessCompletePayload","resolved":"DataProcessCompletePayload","references":{"DataProcessCompletePayload":{"location":"local","path":"utils/components/event-payloads","id":"notImplemented"}}},"cancelable":true,"composed":true,"docs":"Event triggered once the chart data has been processed.","docsTags":[]},{"event":"arcgisDataProcessError","detail":"void","bubbles":true,"complexType":{"original":"void","resolved":"void","references":{}},"cancelable":true,"composed":true,"docs":"Event triggered when an error occurred while fetching of processing the data for the chart.","docsTags":[]},{"event":"arcgisInvalidConfigWarningRaise","detail":"DataWarningObject","bubbles":true,"complexType":{"original":"DataWarningObject","resolved":"DataWarningObject","references":{"DataWarningObject":{"location":"local","path":"utils/chart-config/validator/interfaces","id":"notImplemented"}}},"cancelable":true,"composed":true,"docs":"Event triggered when an invalid configuration is detected.","docsTags":[],"deprecation":"since 5.1. Won't be replaced."},{"event":"arcgisLegendItemVisibilityChange","detail":"LegendItemVisibilityChangePayload","bubbles":true,"complexType":{"original":"LegendItemVisibilityChangePayload","resolved":"LegendItemVisibilityChangePayload","references":{"LegendItemVisibilityChangePayload":{"location":"local","path":"utils/components/event-payloads","id":"notImplemented"}}},"cancelable":true,"composed":true,"docs":"Event triggered once a legend item visibility has been changed.","docsTags":[]},{"event":"arcgisNoRenderPropChange","detail":"NoRenderPropChangePayload","bubbles":true,"complexType":{"original":"NoRenderPropChangePayload","resolved":"NoRenderPropChangePayload","references":{"NoRenderPropChangePayload":{"location":"local","path":"utils/components/event-payloads","id":"notImplemented"}}},"cancelable":true,"composed":true,"docs":"Event triggered when a no-render prop is changed.","docsTags":[]},{"event":"arcgisRenderingComplete","detail":"void","bubbles":true,"complexType":{"original":"void","resolved":"void","references":{}},"cancelable":true,"composed":true,"docs":"Event triggered once the chart rendering is complete.","docsTags":[]},{"event":"arcgisRuntimeError","detail":"void","bubbles":true,"complexType":{"original":"void","resolved":"void","references":{}},"cancelable":true,"composed":true,"docs":"Event triggered when an error occurred that prevents the chart from being created or updated.","docsTags":[]},{"event":"arcgisSelectionComplete","detail":"SelectionCompletePayload","bubbles":true,"complexType":{"original":"SelectionCompletePayload","resolved":"SelectionCompletePayload","references":{"SelectionCompletePayload":{"location":"local","path":"utils/components/event-payloads","id":"notImplemented"}}},"cancelable":true,"composed":true,"docs":"Event triggered when a selection is applied to the chart.","docsTags":[]},{"event":"arcgisSeriesColorChange","detail":"SeriesColorChangePayload","bubbles":true,"complexType":{"original":"SeriesColorChangePayload","resolved":"SeriesColorChangePayload","references":{"SeriesColorChangePayload":{"location":"local","path":"utils/components/event-payloads","id":"notImplemented"}}},"cancelable":true,"composed":true,"docs":"Event triggered once the chart series color have been assigned.","docsTags":[]},{"event":"arcgisSeriesOrder","detail":"string[]","bubbles":true,"complexType":{"original":"string[]","resolved":"string[]","references":{}},"cancelable":true,"composed":true,"docs":"Event carrying the series id as they have been sorted following the `orderOptions` instructions.","docsTags":[]},{"event":"arcgisUpdateComplete","detail":"ValidationStatus","bubbles":true,"complexType":{"original":"ValidationStatus","resolved":"ValidationStatus","references":{"ValidationStatus":{"location":"local","path":"utils/chart-config/validator/interfaces","id":"notImplemented"}}},"cancelable":true,"composed":true,"docs":"Event triggered once the chart is updated.","docsTags":[]}],"styles":[],"slots":[{"name":"action-bar","docs":"Slot for the [arcgis-charts-action-bar](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-charts-action-bar/) component or [calcite-action-bar](https://developers.arcgis.com/calcite-design-system/components/action-bar/) component."}],"parts":[],"listeners":[]},{"filePath":"src/components/charts-action-bar/charts-action-bar.tsx","tag":"arcgis-charts-action-bar","overview":"","readme":"","usage":{},"docs":"The Charts Action Bar component provides context-specific actions such as rotation, zooming, and filtering, as well as general actions like exporting the chart as an image or CSV file.\nThis component is designed to be used with a chart component and is not intended for standalone use.","docsTags":[{"name":"see","text":"[Tutorial: Chart and map interactions](https://developers.arcgis.com/javascript/latest/tutorials/chart-and-map-interactions/)"},{"name":"since","text":"4.29"},{"name":"superclass","text":"{\"name\":\"HTMLElement\",\"package\":\"global:\",\"viewUrl\":\"https://developer.mozilla.org/docs/Web/API/HTMLElement\"}"}],"encapsulation":"shadow","dependents":[],"dependencies":[],"dependencyGraph":{},"props":[{"name":"actionBarSelectionMode","type":"Extract<ActionModes, \"monoSelection\" \| \"multiSelection\" \| \"multiSelectionWithCtrlKey\"> \| undefined","complexType":{"original":"Extract<ActionModes, \"monoSelection\" \| \"multiSelection\" \| \"multiSelectionWithCtrlKey\"> \| undefined","resolved":"Extract<ActionModes, \"monoSelection\" \| \"multiSelection\" \| \"multiSelectionWithCtrlKey\"> \| undefined","references":{"Extract":{"location":"global","path":"global:","id":"notImplemented"},"ActionModes":{"location":"local","path":"utils/cursor/interfaces","id":"notImplemented"}}},"mutable":true,"attr":"action-bar-selection-mode","reflectToAttr":false,"docs":"Defines which selection mode the slotted action bar should use.\n- `monoSelection`: Select a single data point/series, new selection replaces the previous one.\n- `multiSelection`: Select multiple data points/series, new selection adds to the previous one.\n- `multiSelectionWithCtrlKey`: Select multiple data points/series while holding the Ctrl key (Cmd key on Mac), new selection adds to the previous one.","docsTags":[],"default":"\"multiSelectionWithCtrlKey\"","values":[{"type":"string","value":"monoSelection"},{"type":"string","value":"multiSelection"},{"type":"string","value":"multiSelectionWithCtrlKey"}],"optional":true,"required":false},{"name":"chartElement","type":"ArcgisChart \| undefined","complexType":{"original":"ArcgisChart \| undefined","resolved":"ArcgisChart \| undefined","references":{"ArcgisChart":{"location":"local","path":"components/arcgis-chart","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Chart element reference with which the action bar is associated.","docsTags":[],"values":[],"optional":true,"required":false},{"name":"chartType","type":"ChartTypes \| undefined","complexType":{"original":"ChartTypes \| undefined","resolved":"ChartTypes \| undefined","references":{"ChartTypes":{"location":"local","path":"utils/misc/index","id":"notImplemented"}}},"mutable":true,"attr":"chart-type","reflectToAttr":false,"docs":"Chart type used to determine which default actions to display.","docsTags":[],"values":[{"type":"string","value":"scatterSeries"},{"type":"string","value":"pieSeries"},{"type":"string","value":"gaugeSeries"},{"type":"string","value":"lineSeries"},{"type":"string","value":"barSeries"},{"type":"string","value":"histogramSeries"},{"type":"string","value":"boxPlotSeries"},{"type":"string","value":"radarSeries"},{"type":"string","value":"comboLineAndBarSeries"},{"type":"string","value":"heatSeries"}],"optional":true,"required":false},{"name":"clearSelectionState","type":"ActionState","complexType":{"original":"ActionState","resolved":"ActionState","references":{"ActionState":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"clear-selection-state","reflectToAttr":false,"docs":"When `disabled`, interaction with the clear selection action is prevented and the component is displayed with lower opacity.","docsTags":[],"default":"\"enabled\"","values":[{"type":"string","value":"disabled"},{"type":"string","value":"enabled"}],"optional":true,"required":false},{"name":"clearSelectionTitle","type":"string \| undefined","complexType":{"original":"string \| undefined","resolved":"string \| undefined","references":{}},"mutable":true,"attr":"clear-selection-title","reflectToAttr":false,"docs":"Custom title for the clear selection action.","docsTags":[],"values":[{"type":"string"}],"optional":true,"required":false},{"name":"clearSelectionToggle","type":"ActionToggle","complexType":{"original":"ActionToggle","resolved":"ActionToggle","references":{"ActionToggle":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"clear-selection-toggle","reflectToAttr":false,"docs":"When `active`, the clear selection action is highlighted.","docsTags":[],"default":"\"inactive\"","values":[{"type":"string","value":"active"},{"type":"string","value":"inactive"}],"optional":true,"required":false},{"name":"csvExportExclusionList","type":"WebChartTypes[]","complexType":{"original":"WebChartTypes[]","resolved":"WebChartTypes[]","references":{"WebChartTypes":{"location":"local","path":"spec/chart-object-literals","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"The CSV export action is disabled for certain chart types.\n\nModify this property to add or remove chart types from the list of disabled types.","docsTags":[],"values":[],"optional":true,"required":false},{"name":"disableCSVExportForChartTypes","type":"WebChartTypes[]","complexType":{"original":"WebChartTypes[]","resolved":"WebChartTypes[]","references":{"WebChartTypes":{"location":"local","path":"spec/chart-object-literals","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"The CSV export action is disabled for certain chart types.\n\nModify this property to add or remove chart types from the list of disabled types.","docsTags":[],"deprecation":"since 5.1. Use [csvExportExclusionList](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-charts-action-bar/#csvExportExclusionList) instead.","values":[],"optional":true,"required":false},{"name":"editChartState","type":"ActionState","complexType":{"original":"ActionState","resolved":"ActionState","references":{"ActionState":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"edit-chart-state","reflectToAttr":false,"docs":"When `disabled`, interaction with the edit chart action is prevented and the component is displayed with lower opacity.","docsTags":[],"default":"\"disabled\"","values":[{"type":"string","value":"disabled"},{"type":"string","value":"enabled"}],"optional":true,"required":false},{"name":"editChartTitle","type":"string \| undefined","complexType":{"original":"string \| undefined","resolved":"string \| undefined","references":{}},"mutable":true,"attr":"edit-chart-title","reflectToAttr":false,"docs":"Custom title for the edit chart action.","docsTags":[],"values":[{"type":"string"}],"optional":true,"required":false},{"name":"editChartToggle","type":"ActionToggle","complexType":{"original":"ActionToggle","resolved":"ActionToggle","references":{"ActionToggle":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"edit-chart-toggle","reflectToAttr":false,"docs":"When `active`, the edit chart action is highlighted.","docsTags":[],"default":"\"inactive\"","values":[{"type":"string","value":"active"},{"type":"string","value":"inactive"}],"optional":true,"required":false},{"name":"expanded","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"expanded","reflectToAttr":false,"docs":"When `true`, the action bar is expanded.","docsTags":[],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"exportActionState","type":"ActionState","complexType":{"original":"ActionState","resolved":"ActionState","references":{"ActionState":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"export-action-state","reflectToAttr":false,"docs":"When `disabled`, interaction with the export action is prevented and the component is displayed with lower opacity.","docsTags":[],"default":"\"enabled\"","values":[{"type":"string","value":"disabled"},{"type":"string","value":"enabled"}],"optional":true,"required":false},{"name":"exportAsCSVState","type":"ActionState","complexType":{"original":"ActionState","resolved":"ActionState","references":{"ActionState":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"export-as-csv-state","reflectToAttr":false,"docs":"When `disabled`, interaction with the download CSV is prevented and the component is displayed with lower opacity.","docsTags":[],"default":"\"enabled\"","values":[{"type":"string","value":"disabled"},{"type":"string","value":"enabled"}],"optional":true,"required":false},{"name":"exportAsCSVTitle","type":"string \| undefined","complexType":{"original":"string \| undefined","resolved":"string \| undefined","references":{}},"mutable":true,"attr":"export-as-csv-title","reflectToAttr":false,"docs":"Custom title for the download CSV action.","docsTags":[],"values":[{"type":"string"}],"optional":true,"required":false},{"name":"exportAsImageState","type":"ActionState","complexType":{"original":"ActionState","resolved":"ActionState","references":{"ActionState":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"export-as-image-state","reflectToAttr":false,"docs":"When `disabled`, interaction with the download image is prevented and the component is displayed with lower opacity.","docsTags":[],"default":"\"enabled\"","values":[{"type":"string","value":"disabled"},{"type":"string","value":"enabled"}],"optional":true,"required":false},{"name":"exportAsImageTitle","type":"string \| undefined","complexType":{"original":"string \| undefined","resolved":"string \| undefined","references":{}},"mutable":true,"attr":"export-as-image-title","reflectToAttr":false,"docs":"Custom title for the download chart action.","docsTags":[],"values":[{"type":"string"}],"optional":true,"required":false},{"name":"filterByExtentState","type":"ActionState","complexType":{"original":"ActionState","resolved":"ActionState","references":{"ActionState":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"filter-by-extent-state","reflectToAttr":false,"docs":"When `disabled`, interaction with the filter by extent action is prevented and the component is displayed with lower opacity.","docsTags":[],"default":"\"enabled\"","values":[{"type":"string","value":"disabled"},{"type":"string","value":"enabled"}],"optional":true,"required":false},{"name":"filterByExtentTitle","type":"string \| undefined","complexType":{"original":"string \| undefined","resolved":"string \| undefined","references":{}},"mutable":true,"attr":"filter-by-extent-title","reflectToAttr":false,"docs":"Custom title for the filter by extent action.","docsTags":[],"values":[{"type":"string"}],"optional":true,"required":false},{"name":"filterByExtentToggle","type":"ActionToggle","complexType":{"original":"ActionToggle","resolved":"ActionToggle","references":{"ActionToggle":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"filter-by-extent-toggle","reflectToAttr":false,"docs":"When `active`, the filter by extent action is highlighted.","docsTags":[],"default":"\"inactive\"","values":[{"type":"string","value":"active"},{"type":"string","value":"inactive"}],"optional":true,"required":false},{"name":"filterBySelectionState","type":"ActionState","complexType":{"original":"ActionState","resolved":"ActionState","references":{"ActionState":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"filter-by-selection-state","reflectToAttr":false,"docs":"When `disabled`, interaction with the filter by selection action is prevented and the component is displayed with lower opacity.","docsTags":[],"default":"\"enabled\"","values":[{"type":"string","value":"disabled"},{"type":"string","value":"enabled"}],"optional":true,"required":false},{"name":"filterBySelectionTitle","type":"string \| undefined","complexType":{"original":"string \| undefined","resolved":"string \| undefined","references":{}},"mutable":true,"attr":"filter-by-selection-title","reflectToAttr":false,"docs":"Custom title for the filter by selection action.","docsTags":[],"values":[{"type":"string"}],"optional":true,"required":false},{"name":"filterBySelectionToggle","type":"ActionToggle","complexType":{"original":"ActionToggle","resolved":"ActionToggle","references":{"ActionToggle":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"filter-by-selection-toggle","reflectToAttr":false,"docs":"When `active`, the filter by selection action is highlighted.","docsTags":[],"default":"\"inactive\"","values":[{"type":"string","value":"active"},{"type":"string","value":"inactive"}],"optional":true,"required":false},{"name":"forceDisableActions","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"force-disable-actions","reflectToAttr":false,"docs":"When `true`, overrides the individual settings for each action to instead force disable them all.","docsTags":[],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"fullExtentState","type":"ActionState","complexType":{"original":"ActionState","resolved":"ActionState","references":{"ActionState":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"full-extent-state","reflectToAttr":false,"docs":"When `disabled`, interaction with the full extent action is prevented and the component is displayed with lower opacity.","docsTags":[],"default":"\"enabled\"","values":[{"type":"string","value":"disabled"},{"type":"string","value":"enabled"}],"optional":true,"required":false},{"name":"fullExtentTitle","type":"string \| undefined","complexType":{"original":"string \| undefined","resolved":"string \| undefined","references":{}},"mutable":true,"attr":"full-extent-title","reflectToAttr":false,"docs":"Custom title for the full extent action.","docsTags":[],"values":[{"type":"string"}],"optional":true,"required":false},{"name":"fullExtentToggle","type":"ActionToggle","complexType":{"original":"ActionToggle","resolved":"ActionToggle","references":{"ActionToggle":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"full-extent-toggle","reflectToAttr":false,"docs":"When `active`, the full extent action is highlighted.","docsTags":[],"default":"\"inactive\"","values":[{"type":"string","value":"active"},{"type":"string","value":"inactive"}],"optional":true,"required":false},{"name":"hiddenActions","type":"DefaultChartActions[]","complexType":{"original":"DefaultChartActions[]","resolved":"DefaultChartActions[]","references":{"DefaultChartActions":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Holds a list of actions to hide from the action bar.\n\nNote: The edit chart action is hidden by default. To show it, remove its value from this array.","docsTags":[],"values":[],"optional":true,"required":false},{"name":"legendState","type":"ActionState","complexType":{"original":"ActionState","resolved":"ActionState","references":{"ActionState":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"legend-state","reflectToAttr":false,"docs":"When `disabled`, interaction with the legend action is prevented and the component is displayed with lower opacity.","docsTags":[],"default":"\"enabled\"","values":[{"type":"string","value":"disabled"},{"type":"string","value":"enabled"}],"optional":true,"required":false},{"name":"legendTitle","type":"string \| undefined","complexType":{"original":"string \| undefined","resolved":"string \| undefined","references":{}},"mutable":true,"attr":"legend-title","reflectToAttr":false,"docs":"Custom title for the legend action.","docsTags":[],"values":[{"type":"string"}],"optional":true,"required":false},{"name":"legendToggle","type":"ActionToggle","complexType":{"original":"ActionToggle","resolved":"ActionToggle","references":{"ActionToggle":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"legend-toggle","reflectToAttr":false,"docs":"When `active`, the legend action is highlighted.","docsTags":[],"default":"\"inactive\"","values":[{"type":"string","value":"active"},{"type":"string","value":"inactive"}],"optional":true,"required":false},{"name":"messageOverrides","type":"Record<string, unknown> \| undefined","complexType":{"original":"Record<string, unknown> \| undefined","resolved":"Record<string, unknown> \| undefined","references":{"Record":{"location":"global","path":"global:","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Overwrite localized strings for this component.","docsTags":[],"values":[],"optional":true,"required":false},{"name":"rotateChartState","type":"ActionState","complexType":{"original":"ActionState","resolved":"ActionState","references":{"ActionState":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"rotate-chart-state","reflectToAttr":false,"docs":"When `disabled`, interaction with the rotate chart action is prevented and the component is displayed with lower opacity.","docsTags":[],"default":"\"enabled\"","values":[{"type":"string","value":"disabled"},{"type":"string","value":"enabled"}],"optional":true,"required":false},{"name":"rotateChartTitle","type":"string \| undefined","complexType":{"original":"string \| undefined","resolved":"string \| undefined","references":{}},"mutable":true,"attr":"rotate-chart-title","reflectToAttr":false,"docs":"Custom title for the rotate chart action.","docsTags":[],"values":[{"type":"string"}],"optional":true,"required":false},{"name":"rotateChartToggle","type":"ActionToggle","complexType":{"original":"ActionToggle","resolved":"ActionToggle","references":{"ActionToggle":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"rotate-chart-toggle","reflectToAttr":false,"docs":"When `active`, the rotate chart action is highlighted.","docsTags":[],"default":"\"inactive\"","values":[{"type":"string","value":"active"},{"type":"string","value":"inactive"}],"optional":true,"required":false},{"name":"selectionState","type":"ActionState","complexType":{"original":"ActionState","resolved":"ActionState","references":{"ActionState":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"selection-state","reflectToAttr":false,"docs":"When `disabled`, interaction with the selection action is prevented and the component is displayed with lower opacity.","docsTags":[],"default":"\"enabled\"","values":[{"type":"string","value":"disabled"},{"type":"string","value":"enabled"}],"optional":true,"required":false},{"name":"selectionTitle","type":"string \| undefined","complexType":{"original":"string \| undefined","resolved":"string \| undefined","references":{}},"mutable":true,"attr":"selection-title","reflectToAttr":false,"docs":"Custom title for the selection action.","docsTags":[],"values":[{"type":"string"}],"optional":true,"required":false},{"name":"selectionToggle","type":"ActionToggle","complexType":{"original":"ActionToggle","resolved":"ActionToggle","references":{"ActionToggle":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"selection-toggle","reflectToAttr":false,"docs":"When `active`, the selection action is highlighted.","docsTags":[],"default":"\"inactive\"","values":[{"type":"string","value":"active"},{"type":"string","value":"inactive"}],"optional":true,"required":false},{"name":"switchSelectionState","type":"ActionState","complexType":{"original":"ActionState","resolved":"ActionState","references":{"ActionState":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"switch-selection-state","reflectToAttr":false,"docs":"When `disabled`, interaction with the switch selection action is prevented and the component is displayed with lower opacity.","docsTags":[],"default":"\"enabled\"","values":[{"type":"string","value":"disabled"},{"type":"string","value":"enabled"}],"optional":true,"required":false},{"name":"switchSelectionTitle","type":"string \| undefined","complexType":{"original":"string \| undefined","resolved":"string \| undefined","references":{}},"mutable":true,"attr":"switch-selection-title","reflectToAttr":false,"docs":"Custom title for the switch selection action.","docsTags":[],"values":[{"type":"string"}],"optional":true,"required":false},{"name":"switchSelectionToggle","type":"ActionToggle","complexType":{"original":"ActionToggle","resolved":"ActionToggle","references":{"ActionToggle":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"switch-selection-toggle","reflectToAttr":false,"docs":"When `active`, the switch selection action is highlighted.","docsTags":[],"default":"\"inactive\"","values":[{"type":"string","value":"active"},{"type":"string","value":"inactive"}],"optional":true,"required":false},{"name":"zoomState","type":"ActionState","complexType":{"original":"ActionState","resolved":"ActionState","references":{"ActionState":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"zoom-state","reflectToAttr":false,"docs":"When `disabled`, interaction with the zoom action is prevented and the component is displayed with lower opacity.","docsTags":[],"default":"\"enabled\"","values":[{"type":"string","value":"disabled"},{"type":"string","value":"enabled"}],"optional":true,"required":false},{"name":"zoomTitle","type":"string \| undefined","complexType":{"original":"string \| undefined","resolved":"string \| undefined","references":{}},"mutable":true,"attr":"zoom-title","reflectToAttr":false,"docs":"Custom title for the zoom action.","docsTags":[],"values":[{"type":"string"}],"optional":true,"required":false},{"name":"zoomToggle","type":"ActionToggle","complexType":{"original":"ActionToggle","resolved":"ActionToggle","references":{"ActionToggle":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"zoom-toggle","reflectToAttr":false,"docs":"When `active`, the zoom action is highlighted.","docsTags":[],"default":"\"inactive\"","values":[{"type":"string","value":"active"},{"type":"string","value":"inactive"}],"optional":true,"required":false}],"methods":[{"name":"componentOnReady","returns":{"type":"Promise<this>","docs":""},"complexType":{"signature":"(): Promise<this>","parameters":[],"return":"Promise<this>","references":{"Promise":{"location":"import","path":"typescript/lib/lib.es5.d.ts","id":"notImplemented"}}},"signature":"componentOnReady(): Promise<this>","parameters":[],"docs":"Creates a promise that resolves once the component is fully loaded.","docsTags":[{"name":"example","text":"```js\nconst arcgisChartsActionBar = document.createElement(\"arcgis-charts-action-bar\");\ndocument.body.append(arcgisChartsActionBar);\nawait arcgisChartsActionBar.componentOnReady();\nconsole.log(\"arcgis-charts-action-bar is ready to go!\");\n```"},{"name":"inheritedFrom","text":"{\"name\":\"this\"}"}]}],"events":[{"event":"arcgisActionBarToggle","detail":"boolean","bubbles":true,"complexType":{"original":"boolean","resolved":"boolean","references":{}},"cancelable":true,"composed":true,"docs":"Event triggered once action bar expand is toggled.","docsTags":[]},{"event":"arcgisDefaultActionSelect","detail":"DefaultActionSelectPayload","bubbles":true,"complexType":{"original":"DefaultActionSelectPayload","resolved":"DefaultActionSelectPayload","references":{"DefaultActionSelectPayload":{"location":"local","path":"utils/components/event-payloads","id":"notImplemented"}}},"cancelable":true,"composed":true,"docs":"Event triggered once a default action is selected.","docsTags":[]}],"styles":[],"slots":[{"name":"custom-action-top","docs":"A slot for adding custom `calcite-action` to the top of the default actions."},{"name":"custom-action-below","docs":"A slot for adding custom `calcite-action` to the bottom of the default actions."}],"parts":[],"listeners":[]}],"typeLibrary":{}}
1	+ {"deprecation":"docs.json is deprecated and will be removed in a future release. Use api.json instead","timestamp":"2026-08-18T04:38:23","compiler":{"name":"@arcgis/lumina-compiler","version":"5.2.0-next.76","typescriptVersion":"6.0.3"},"components":[{"filePath":"src/components/chart/chart.tsx","tag":"arcgis-chart","overview":"","readme":"","usage":{},"docs":"The ArcGIS Chart component renders a chart by setting a [model](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#model) object that defines the chart's configuration and data.\n\nYou can render a chart either by:\n- Setting [layerItemId](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#layerItemId) and [chartIndex](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#chartIndex) to load a saved chart from a layer item.\n- Create a new chart by using the [`createModel()`](/references/charts-components/model/shared/setup-utils/#createModel) function to create a chart model and set it to the [model](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#model) property.\n\n> [!IMPORTANT]\n>\n> See the [Introduction to charts](https://developers.arcgis.com/javascript/latest/charts-components-intro/) guide for detailed examples on how to render a chart using the above patterns.\n\nThere are 10 supported chart types, each with its own model properties and methods. Refer to the [chart types documentation](https://developers.arcgis.com/javascript/latest/charts/chart-types/) for more information on each chart type.\n\n##### See also:\n- [Tutorial: Display a chart](https://developers.arcgis.com/javascript/latest/tutorials/display-a-chart/)\n- [Tutorial: Chart and map interactions](https://developers.arcgis.com/javascript/latest/tutorials/chart-and-map-interactions/)\n\n> [!WARNING]\n> When the chart is rendering while its container is not yet fully sized, a console error about the chart's attribute height may appear. This is a known issue and should not affect the functionality of the chart.","docsTags":[{"name":"since","text":"4.32"},{"name":"superclass","text":"{\"name\":\"HTMLElement\",\"package\":\"global:\",\"viewUrl\":\"https://developer.mozilla.org/docs/Web/API/HTMLElement\"}"}],"encapsulation":"shadow","dependents":[],"dependencies":[],"dependencyGraph":{},"props":[{"name":"actionMode","type":"ActionModes \| undefined","complexType":{"original":"ActionModes \| undefined","resolved":"ActionModes \| undefined","references":{"ActionModes":{"location":"local","path":"utils/cursor/interfaces","id":"notImplemented"}}},"mutable":true,"attr":"action-mode","reflectToAttr":false,"docs":"Specifies how user interactions on the chart are handled.\n\n- `monoSelection`: Select one data item at a time. Each new selection replaces the previous selection.\n- `multiSelection`: Select multiple data items. Each new selection is added to the existing selection.\n- `multiSelectionWithCtrlKey`: Select multiple data items only while holding Ctrl (or Cmd on macOS). Without the key, selection behaves like `monoSelection`.\n- `zoom`: Zoom into an area of the chart.\n- `none`: Disable interaction-driven selection and zoom actions.\n\nNote: Not applicable to gauges.","docsTags":[],"values":[{"type":"string","value":"none"},{"type":"string","value":"monoSelection"},{"type":"string","value":"multiSelection"},{"type":"string","value":"multiSelectionWithCtrlKey"},{"type":"string","value":"zoom"}],"optional":true,"required":false},{"name":"allowUsingObjectIdStat","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"allow-using-object-id-stat","reflectToAttr":false,"docs":"When `true`, object ID can be used as a numeric field for aggregated charts (for example, `sum` of `objectId`).","docsTags":[],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"animationEnabled","type":"boolean \| undefined","complexType":{"original":"boolean \| undefined","resolved":"boolean \| undefined","references":{}},"mutable":true,"attr":"animation-enabled","reflectToAttr":false,"docs":"When `true`, elements such as data items, axes, and legends will animate when the chart is first rendered or when the chart's configuration is updated.\n\n<video\n src=\"https://developers.arcgis.com/javascript/latest/assets/references/components/chart/animationEnabled.webm\"\n aria-label=\"animationEnabled\"\n width=\"720\"\n autoPlay\n loop\n muted\n playsInline\n/>","docsTags":[{"name":"since","text":"5.1"}],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"aria","type":"DOMContainerAria \| undefined","complexType":{"original":"DOMContainerAria \| undefined","resolved":"DOMContainerAria \| undefined","references":{"DOMContainerAria":{"location":"import","path":"@arcgis/core/views/DOMContainer.js","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"The ARIA attributes for the chart component. Provides accessibility information to assistive technologies such as screen readers. Supports the following properties: [\\`label\\`](https://developer.mozilla.org/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-label), [\\`description\\`](https://developer.mozilla.org/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-description), [\\`describedByElements\\`](https://developer.mozilla.org/docs/Web/API/Element/ariaDescribedByElements), and [\\`labelledByElements\\`](https://developer.mozilla.org/docs/Web/API/Element/ariaLabelledByElements).","docsTags":[{"name":"example","text":"```ts\nchartElement.aria = {\n label: \"Custom chart label\",\n description: \"Custom chart description\",\n};\n```"},{"name":"see","text":"[ARIA attributes](https://developers.arcgis.com/javascript/latest/accessibility/#aria-attributes)"},{"name":"since","text":"5.0"}],"values":[],"optional":true,"required":false},{"name":"autoDestroyDisabled","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"auto-destroy-disabled","reflectToAttr":false,"docs":"When `true`, the component is not destroyed automatically when it is disconnected from the document, which is useful when moving or temporarily hiding it.\n\n> [!CAUTION]\n>\n> Call the [destroy()](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#destroy) method when you are done to prevent memory leaks.","docsTags":[{"name":"since","text":"5.0"}],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"autoDisposeChart","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"auto-dispose-chart","reflectToAttr":false,"docs":"Auto disposes the chart when a new one is created in the same container.","docsTags":[],"default":"false","deprecation":"since 5.0. Use [autoDestroyDisabled](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#autoDestroyDisabled) instead.","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"autoInverseDataLabelTextColor","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"auto-inverse-data-label-text-color","reflectToAttr":false,"docs":"When `true`, the data label text color is automatically adjusted for readability based on its background, switching to either the chart background color or white when the contrast is too low.\n\n\| With `autoInverseDataLabelTextColor` \| Without `autoInverseDataLabelTextColor` \|\n\| -------- \| -------- \|\n\| ![autoInverseDataLabelTextColor true](https://developers.arcgis.com/javascript/latest/assets/references/components/chart/autoInverseDataLabelTextColorTrue.avif) \| ![autoInverseDataLabelTextColor false](https://developers.arcgis.com/javascript/latest/assets/references/components/chart/autoInverseDataLabelTextColorFalse.avif) \|\n\nNote: Applicable to heat charts only.","docsTags":[{"name":"since","text":"4.34"}],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"calciteThemingCSSVariables","type":"CalciteThemeCSSVariables","complexType":{"original":"CalciteThemeCSSVariables","resolved":"CalciteThemeCSSVariables","references":{"CalciteThemeCSSVariables":{"location":"local","path":"utils/components/themes","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Specifies the Calcite CSS variables to use when applying a Calcite theme.\n\nBy default the following variables are used:\n- background: `--calcite-color-foreground-1`\n- text: `--calcite-color-text-1`\n- line: `--calcite-color-border-1`\n- secondary line: `--calcite-color-text-3`\n- spinner: `--calcite-color-brand-hover`\n\nThe chart colors are overridden by those associated to those CSS variables, but only if they have not been customized beforehand.","docsTags":[{"name":"see","text":"[Charts theming with Calcite CSS variables](https://developers.arcgis.com/javascript/latest/charts/features-and-capabilities/styling-and-theming/#theming-with-css-variables)"},{"name":"see","text":"[Components theming with Calcite](https://developers.arcgis.com/javascript/latest/building-your-ui/#styling-and-theming-with-calcite)"},{"name":"since","text":"5.1"}],"values":[],"optional":true,"required":false},{"name":"chartIndex","type":"number \| undefined","complexType":{"original":"number \| undefined","resolved":"number \| undefined","references":{}},"mutable":true,"attr":"chart-index","reflectToAttr":false,"docs":"The index of the chart to be rendered from the layer. Must be used in conjunction with the `layerItemId` or `layer` property.\n\nIf a `layer` or `layerItemId` is set without `chartIndex`, the first chart in the layer will be rendered.\n\nIf the `chartIndex` is out of bounds, the first chart in the layer will be rendered and a warning event will be emitted.","docsTags":[{"name":"example","text":"```html\n<arcgis-chart layer-item-id=\"8871626e970a4f3e9d6113ec63a92f2f\" chart-index=\"2\"></arcgis-chart>\n```"}],"values":[{"type":"number"}],"optional":true,"required":false},{"name":"chartLimits","type":"ChartElementLimit \| undefined","complexType":{"original":"ChartElementLimit \| undefined","resolved":"ChartElementLimit \| undefined","references":{"ChartElementLimit":{"location":"local","path":"utils/defaults/interfaces","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Customize the maximum number of data items allowed on the chart.\n\nThe chart's behavior once that limit is reached can be adjusted through the `behaviorAfterLimit` nested property, to either reject the creation\nor update of the chart, or render the elements up to the given limits.\n\nNote: Not applicable to gauges.","docsTags":[{"name":"example","text":"```ts\nchartElement.chartLimits = {\n behaviorAfterLimit: LimitBehavior.RenderUpToTheLimit,\n maxCategoryCountTotal: 15,\n};\n```"}],"values":[],"optional":true,"required":false},{"name":"chartWillRender","type":"PreRenderCallback \| undefined","complexType":{"original":"PreRenderCallback \| undefined","resolved":"PreRenderCallback \| undefined","references":{"PreRenderCallback":{"location":"local","path":"chart-rendering/common/interfaces","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Lifecycle function executed after the data has been processed and before the chart renders.\nCan be used to alter the model from information extracted from the data.\n\nNote: Applicable to gauges and pie charts only.","docsTags":[],"values":[],"optional":true,"required":false},{"name":"configurationEnabled","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"configuration-enabled","reflectToAttr":false,"docs":"Whether to use features uniquely designed for a chart currently being configured by a user via the UI.\nWhen `true` and if the [arcgis-charts-action-bar](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-charts-action-bar/) is slotted in the chart component,\nthe action bar will expose an \"Edit chart\" action, surface relevant error states, and show a helpful in-container placeholder about the chart’s purpose.","docsTags":[{"name":"since","text":"5.1"}],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"cursorRange","type":"CursorRange \| undefined","complexType":{"original":"CursorRange \| undefined","resolved":"CursorRange \| undefined","references":{"CursorRange":{"location":"local","path":"utils/cursor/interfaces","id":"notImplemented"}}},"mutable":true,"attr":"cursor-range","reflectToAttr":false,"docs":"Defines how the cursor selection rectangle is constrained when [actionMode](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#actionMode) is `zoom`, `multiSelection`, or `multiSelectionWithCtrlKey`.\n\n- `multi-axes`: Allows drawing a free rectangle across both axes.\n- `x-axis`: Constrains the rectangle to the x-axis direction.\n- `y-axis`: Constrains the rectangle to the y-axis direction.\n- `undefined`: Uses the default behavior for the current chart type and action mode.\n\nNote: Not applicable to gauges.","docsTags":[],"values":[{"type":"string","value":"multi-axes"},{"type":"string","value":"x-axis"},{"type":"string","value":"y-axis"}],"optional":true,"required":false},{"name":"dataLabelFormatter","type":"ChartOptions[\"dataLabelFormatter\"] \| undefined","complexType":{"original":"ChartOptions[\"dataLabelFormatter\"] \| undefined","resolved":"ChartOptions[\"dataLabelFormatter\"] \| undefined","references":{"ChartOptions":{"location":"local","path":"chart-rendering/common/interfaces","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Callback function used to format the data labels. If the returned string contains HTML tags they will be interpreted as such.","docsTags":[{"name":"example","text":"```ts\n// Render custom data labels with the stat value and percentage formatted to 2 decimal places.\nchartElement.dataLabelFormatter = (statValue, percent) => {\n return `\n <div>\n Total listings: <strong>${statValue}</strong><br>\n Percentage: <strong>${Number(percent).toFixed(2)}%</strong>\n </div>\n `;\n};\n```\n<img\n src=\"https://developers.arcgis.com/javascript/latest/assets/references/components/chart/dataLabelFormatter.avif\"\n alt=\"dataLabelFormatter true\"\n style=\"max-width: 700px; width: 100%; height: auto;\"\n/>\n\nNote: Not applicable to gauges and radar charts."}],"values":[],"optional":true,"required":false},{"name":"disableInteractions","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"disable-interactions","reflectToAttr":false,"docs":"Disables all interactions on the chart.","docsTags":[],"default":"false","deprecation":"since 5.1. Use [interactionsDisabled](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#interactionsDisabled) instead.","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"disableTogglingLegendItems","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"disable-toggling-legend-items","reflectToAttr":false,"docs":"Disables the toggling of series from the legend items.\n\nNote: Only applicable to multi-series charts.","docsTags":[],"default":"false","deprecation":"since 5.1. Use [togglingLegendItemsDisabled](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#togglingLegendItemsDisabled) instead.","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"enableBetaFeatures","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"enable-beta-features","reflectToAttr":false,"docs":"Whether to enable the beta features from the chart component.","docsTags":[{"name":"internal"}],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"enableConfiguration","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"enable-configuration","reflectToAttr":false,"docs":"Whether to use features uniquely designed for a chart currently being configured by a user via the UI.\nWhen true, the slotted charts action bar will expose an Edit chart action, surfaces relevant error states,\nand can show a helpful in-container placeholder about the chart’s purpose.","docsTags":[],"default":"false","deprecation":"since 5.1. Use [configurationEnabled](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#configurationEnabled) instead.","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"enableResponsiveFeatures","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"enable-responsive-features","reflectToAttr":false,"docs":"Enables the responsive features.","docsTags":[],"default":"false","deprecation":"since 5.1. Won't be replaced.","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"errorPolicy","type":"ErrorPolicy","complexType":{"original":"ErrorPolicy","resolved":"ErrorPolicy","references":{"ErrorPolicy":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"error-policy","reflectToAttr":false,"docs":"When set to `ignore`, the chart fails silently without displaying an error or hiding the chart.\nBy default, it is set to `throw`, which displays an error alert and hides the chart when it can't be created or updated.","docsTags":[],"default":"\"throw\"","values":[{"type":"string","value":"throw"},{"type":"string","value":"ignore"}],"optional":true,"required":false},{"name":"featureIndex","type":"number \| undefined","complexType":{"original":"number \| undefined","resolved":"number \| undefined","references":{}},"mutable":true,"attr":"feature-index","reflectToAttr":false,"docs":"The index of the feature to render when using a feature based gauge.\n\nNote: Applicable to gauges only.","docsTags":[],"deprecation":"since 5.0. Use charts model's [featureIndex](https://developers.arcgis.com/javascript/latest/references/charts-components/model/gauge-model/gauge-model/#featureIndex) prop instead.","values":[{"type":"number"}],"optional":true,"required":false},{"name":"filterByExtent","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"filter-by-extent","reflectToAttr":false,"docs":"When `true`, all chart elements are filtered based on the view extent.","docsTags":[],"default":"false","deprecation":"since 5.1. Use [filterByViewExtent](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#filterByViewExtent) instead.","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"filterBySelection","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"filter-by-selection","reflectToAttr":false,"docs":"When `true`, the chart uses the current selection as a data filter and renders only selected elements instead of rendering the full dataset with selection styling.\nAxis bounds, time binning intervals will be computed based on the selected elements only.\n\nNote: Not applicable to gauges or charts configured with imagery layers.","docsTags":[],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"filterByViewExtent","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"filter-by-view-extent","reflectToAttr":false,"docs":"When `true`, chart queries are constrained to the current map view extent. The chart refreshes as the view extent changes, and the axis bounds or other derived values are recalculated from the view extent data.","docsTags":[],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"gaugeInnerLabelFormatter","type":"GaugeInnerLabelFormatCallback \| undefined","complexType":{"original":"GaugeInnerLabelFormatCallback \| undefined","resolved":"GaugeInnerLabelFormatCallback \| undefined","references":{"GaugeInnerLabelFormatCallback":{"location":"local","path":"chart-rendering/common/interfaces","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Callback function used to format the gauge inner label. If the returned string contains HTML tags they will be interpreted as such.","docsTags":[{"name":"example","text":"```ts\n// Render a centered custom gauge label with the value formatted to 2 decimal places.\nchartElement.gaugeInnerLabelFormatter = (value) => {\n return `<div style=\"text-align: center;\"><u>Custom gauge inner label: </u><br /><b>${Number(value).toFixed(2)}</b></div>`;\n};\n```\n\n<img\n src=\"https://developers.arcgis.com/javascript/latest/assets/references/components/chart/gaugeInnerLabelFormatter.avif\"\n alt=\"gaugeInnerLabelFormatter\"\n style=\"max-width: 700px; width: 100%; height: auto;\"\n/>\n\nNote: Applicable to gauges only."}],"values":[],"optional":true,"required":false},{"name":"guideTooltipFormatter","type":"GuideTooltipFormatCallback \| undefined","complexType":{"original":"GuideTooltipFormatCallback \| undefined","resolved":"GuideTooltipFormatCallback \| undefined","references":{"GuideTooltipFormatCallback":{"location":"local","path":"chart-rendering/common/interfaces","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Callback function used to format the axes guides tooltip. If the returned string contains HTML tags they will be interpreted as such.","docsTags":[{"name":"example","text":"```ts\n// Render a custom tooltip with the guide's start and end values.\nchartElement.guideTooltipFormatter = (props) => {\n return `\n <u>Custom guide tooltip</u><br />\n Range: <b>${props.start} - ${props.end}</b>\n `;\n};\n```\n\n<img\n src=\"https://developers.arcgis.com/javascript/latest/assets/references/components/chart/guideTooltipFormatter.avif\"\n alt=\"guideTooltipFormatter\"\n style=\"max-width: 700px; width: 100%; height: auto;\"\n/>\n\nNote: Not applicable to pie charts."}],"values":[],"optional":true,"required":false},{"name":"hideEmptySeries","type":"boolean \| undefined","complexType":{"original":"boolean \| undefined","resolved":"boolean \| undefined","references":{}},"mutable":true,"attr":"hide-empty-series","reflectToAttr":false,"docs":"When `true`, the empty series are completely hidden from the chart and the legend.\nFor example, a series may become empty after applying a data filter, filter by attribute or geometry (as when using the filter by view extent).\n\nNote: Not applicable to gauges.","docsTags":[],"default":"false","deprecation":"since 5.1. Use [showEmptySeries](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#showEmptySeries) instead.","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"hideLicenseWatermark","type":"boolean \| undefined","complexType":{"original":"boolean \| undefined","resolved":"boolean \| undefined","references":{}},"mutable":true,"attr":"hide-license-watermark","reflectToAttr":false,"docs":"Hides the license watermark.","docsTags":[],"default":"false","deprecation":"since 5.1. Use [showLicenseWatermark](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#showLicenseWatermark) instead.","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"hideLoaderAnimation","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"hide-loader-animation","reflectToAttr":false,"docs":"When `true`, the loader animation is hidden when the chart is being created or updated. By default, it is shown at chart creation and each update (if it takes more than 300ms).\n\| When `hideLoaderAnimation` is `true` \| When `hideLoaderAnimation` is `false` \|\n\| -------- \| -------- \|\n\| <video src=\"https://developers.arcgis.com/javascript/latest/assets/references/components/chart/hideLoaderAnimationTrue.webm\" aria-label=\"animationEnabled\" width=\"720\" autoPlay loop muted playsInline/> \| <video src=\"https://developers.arcgis.com/javascript/latest/assets/references/components/chart/hideLoaderAnimationFalse.webm\" aria-label=\"animationEnabled\" width=\"720\" autoPlay loop muted playsInline/>","docsTags":[],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"hideUIMessages","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"hide-ui-messages","reflectToAttr":false,"docs":"When set to `true`, UI messages are hidden. These messages can be no data warnings, any placeholder messages set or invalid chart configuration.\nBy default, its value is `false`, which displays the messages on the chart.","docsTags":[{"name":"since","text":"5.1"}],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"hideZeroCountCategories","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"hide-zero-count-categories","reflectToAttr":false,"docs":"When `true`, missing categories from a `Count` aggregation are kept as gaps in the chart's data.\n\nWhen data is retrieved from the server, features with a count of 0 are excluded from the response, resulting in missing chart entries.\n\nBy default, the chart's [WebChartGenericDataItem](https://developers.arcgis.com/javascript/latest/references/charts-components/spec/data-source/#WebChartGenericDataItem-dataItems) associated with empty categories (from only a `Count` aggregation) are populated with 0s.","docsTags":[{"name":"since","text":"5.1"}],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"ignoreSmoothRenderingLimit","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"ignore-smooth-rendering-limit","reflectToAttr":false,"docs":"When `true`, disables the default setting that uses debounce functions to handle the visibility of markers\nthat are outside of the plotting area when the min/max bound changes and/or when a zoom action is performed\n(via chart cursor or scrollbar), to increase performance.\n\nThis property will be set when the chart is created and cannot be updated after that.\nIt's recommended that this property should only be set to `true` for small datasets.\nWhen left `undefined`, will be treated as `false`.\n\nNote: Applicable to line charts only.","docsTags":[],"default":"false","deprecation":"since 5.1. Won't be replaced.","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"ignoreViewExtent","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"ignore-view-extent","reflectToAttr":false,"docs":"When `true`, it signals the queries to ignore the view's extent, whether an additional geometry filter is provided or not.\n\nThis property will be effective when the component's [view](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#view) property is provided or when the [layer](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#layer) property is set to [`FeatureLayerView`](/references/core/views/layers/FeatureLayerView/).\n\nBy default the queries made by the chart will consider the view's extent as the unique geometry filter applicable. This implies ignoring any\ngeometry filters passed through the [model](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#model) or the [runtimeDataFilters](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#runtimeDataFilters) properties.","docsTags":[],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"interactionsDisabled","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"interactions-disabled","reflectToAttr":false,"docs":"When `true`, all interactions such as zooming and selection are disabled on the chart. The chart will be rendered in a read-only state.","docsTags":[],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"layer","type":"FeatureLayerView \| SupportedLayer \| SupportedRasterLayer \| undefined","complexType":{"original":"FeatureLayerView \| SupportedLayer \| SupportedRasterLayer \| undefined","resolved":"FeatureLayerView \| SupportedLayer \| SupportedRasterLayer \| undefined","references":{"default":{"location":"import","path":"@arcgis/core/views/layers/FeatureLayerView.js","id":"notImplemented"},"SupportedLayer":{"location":"local","path":"interfaces","id":"notImplemented"},"SupportedRasterLayer":{"location":"local","path":"interfaces","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Used to perform queries.\nIf the layer is a `FeatureLayerView` or if the layer and the `view` property are both provided, the queries will be executed client-side.","docsTags":[],"values":[],"optional":true,"required":false},{"name":"layerFieldsChangePolicy","type":"LayerFieldsChangePolicy","complexType":{"original":"LayerFieldsChangePolicy","resolved":"LayerFieldsChangePolicy","references":{"LayerFieldsChangePolicy":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"layer-fields-change-policy","reflectToAttr":false,"docs":"Allows the chart to update automatically when the layer's `fields` property changes.","docsTags":[],"default":"\"refresh\"","deprecation":"since 5.1. Won't be replaced.","values":[{"type":"string","value":"refresh"},{"type":"string","value":"ignore"}],"optional":true,"required":false},{"name":"layerFilterChangePolicy","type":"LayerFilterChangePolicy","complexType":{"original":"LayerFilterChangePolicy","resolved":"LayerFilterChangePolicy","references":{"LayerFilterChangePolicy":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"layer-filter-change-policy","reflectToAttr":false,"docs":"Whether the chart should be refreshed when the layer's filter (`definitionExpression`) changes.","docsTags":[],"default":"\"refresh\"","deprecation":"since 5.1. Won't be replaced.","values":[{"type":"string","value":"refresh"},{"type":"string","value":"ignore"}],"optional":true,"required":false},{"name":"layerItemId","type":"string \| undefined","complexType":{"original":"string \| undefined","resolved":"string \| undefined","references":{}},"mutable":true,"attr":"layer-item-id","reflectToAttr":false,"docs":"Layer item ID associated with the chart to be rendered. Can be used in conjunction with the `chartIndex` property. If `layerItemId` is set without `chartIndex`, the first chart in the layer will be rendered.\n\nThe layer item ID can be found in the URL of the layer's item page on ArcGIS Online or Enterprise.\nFor example, in the URL `https://www.arcgis.com/home/item.html?id=8871626e970a4f3e9d6113ec63a92f2f`, the layer item ID is `8871626e970a4f3e9d6113ec63a92f2f`.\n\nSupported layer types include: [`FeatureLayer`](/references/core/layers/FeatureLayer), [`SubtypeSublayer`](/references/core/layers/support/SubtypeSublayer), [`ImageryLayer`](/references/core/layers/ImageryLayer), [`ImageryTileLayer`](/references/core/layers/ImageryTileLayer) and [`WCSLayer`](/references/core/layers/WCSLayer).","docsTags":[{"name":"example","text":"```html\n<arcgis-chart layer-item-id=\"8871626e970a4f3e9d6113ec63a92f2f\" chart-index=\"2\"></arcgis-chart>\n```"}],"values":[{"type":"string"}],"optional":true,"required":false},{"name":"layerRendererChangePolicy","type":"LayerRendererChangePolicy","complexType":{"original":"LayerRendererChangePolicy","resolved":"LayerRendererChangePolicy","references":{"LayerRendererChangePolicy":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"layer-renderer-change-policy","reflectToAttr":false,"docs":"Allows the chart to update automatically when the layer's renderer changes. Applies when the color match is enabled.\n\nNote: If the property is set to `ignore` the chart will still use the layer's renderer information when the data is updated.","docsTags":[],"default":"\"refresh\"","deprecation":"since 5.1. Won't be replaced.","values":[{"type":"string","value":"refresh"},{"type":"string","value":"ignore"}],"optional":true,"required":false},{"name":"legendPosition","type":"WebChartLegendPositions \| undefined","complexType":{"original":"WebChartLegendPositions \| undefined","resolved":"WebChartLegendPositions \| undefined","references":{"WebChartLegendPositions":{"location":"local","path":"spec/chart-object-literals","id":"notImplemented"}}},"mutable":true,"attr":"legend-position","reflectToAttr":false,"docs":"Sets the legend's position on the chart.\n\nNote: Not applicable to gauges.","docsTags":[],"deprecation":"since 5.0. Use charts model's [legendPosition](https://developers.arcgis.com/javascript/latest/references/charts-components/model/bar-chart-model/bar-chart-model/#legendPosition) prop instead.","values":[{"type":"string","value":"left"},{"type":"string","value":"right"},{"type":"string","value":"top"},{"type":"string","value":"bottom"}],"optional":true,"required":false},{"name":"legendValueLabelFormatter","type":"PieChartLegendValueLabelFormatCallback \| undefined","complexType":{"original":"PieChartLegendValueLabelFormatCallback \| undefined","resolved":"PieChartLegendValueLabelFormatCallback \| undefined","references":{"PieChartLegendValueLabelFormatCallback":{"location":"local","path":"chart-rendering/common/interfaces","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"When the pie chart label contains either a numeric value or a percentage (which can be set through the\n[displayNumericValueOnLegendItems](https://developers.arcgis.com/javascript/latest/references/charts-components/model/pie-chart-model/pie-chart-model/#displayNumericValueOnLegendItems) and\n[displayPercentageOnLegendItems](https://developers.arcgis.com/javascript/latest/references/charts-components/model/pie-chart-model/pie-chart-model/#displayPercentageOnLegendItems) properties from the pie chart model), this property\ncan be used to format the numeric value and/or percentage. If the returned string contains HTML tags they will be interpreted as such.","docsTags":[{"name":"example","text":"```ts\n// Set the pie chart model to display both numeric value and percentage.\npieChartModel.displayNumericValueOnLegendItems = true;\npieChartModel.displayPercentageOnLegendItems = true;\n\n// Render the numeric value and percentage in bold and italic respectively, with 2 decimal places.\nchartElement.legendValueLabelFormatter = (value, percentage) => {\n return `<strong><u>${Number(value).toFixed(2)}</u></strong> (<em>${Number(percentage).toFixed(2)}%</em>)`;\n};\n```\n\n<img\n src=\"https://developers.arcgis.com/javascript/latest/assets/references/components/chart/legendValueLabelFormatter.avif\"\n alt=\"legendValueLabelFormatter\"\n style=\"max-width: 400px; width: 100%; height: auto;\"\n/>\n\nNote: Applicable to pie charts only."}],"values":[],"optional":true,"required":false},{"name":"legendVisibility","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"legend-visibility","reflectToAttr":false,"docs":"When `true`, the legend is visible on the chart.\n\nNote: Not applicable to gauges.","docsTags":[],"default":"false","deprecation":"since 5.0. Use charts model's [legendVisibility](https://developers.arcgis.com/javascript/latest/references/charts-components/model/bar-chart-model/bar-chart-model/#legendVisibility) prop instead.","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"loaderColors","type":"LoaderColors \| undefined","complexType":{"original":"LoaderColors \| undefined","resolved":"LoaderColors \| undefined","references":{"LoaderColors":{"location":"local","path":"utils/misc/interfaces","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Defines the colors for the loader animation.","docsTags":[{"name":"example","text":"```ts\n// Set a blue curtain and a red spinner for the loader animation\nchartComponent.loaderColors = { curtainColor: [30, 144, 255, 255], spinnerColor: [255, 0, 0, 255] };\n```"}],"deprecation":"since 5.1. Customize the Calcite CSS variables defined by [calciteThemingCSSVariables](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#calciteThemingCSSVariables) instead.","values":[],"optional":true,"required":false},{"name":"messageOverrides","type":"Record<string, unknown> \| undefined","complexType":{"original":"Record<string, unknown> \| undefined","resolved":"Record<string, unknown> \| undefined","references":{"Record":{"location":"global","path":"global:","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Custom messages for translated strings on the chart. If the returned string contains HTML tags they will be interpreted as such.\n\nThe customizable messages can be found thru the [`CommonStringsIdentity`](/references/charts-components/utils/localization/interfaces/#CommonStringsIdentity) variable.","docsTags":[{"name":"example","text":"```ts\n// User sets the xAxisField to a field that doesn't exist in the dataset.\nbarChartModel.xAxisField = \"wrong_field_name\";\n\n// Overrides the default message when there's a query error instead of displaying the default \"Failure to read input data.\" message.\nchartElement.messageOverrides = {\n errorStrings: {\n errors: {\n queryError:\n \"<b><u>The input data provided is invalid, please ensure the xAxisField is correctly specified.</u></b>\"\n },\n },\n };\n```\n\n![messageOverrides](https://developers.arcgis.com/javascript/latest/assets/references/components/chart/messageOverrides.avif)"}],"values":[],"optional":true,"required":false},{"name":"model","type":"ChartModel \| WebChart \| undefined","complexType":{"original":"ChartModel \| WebChart \| undefined","resolved":"ChartModel \| WebChart \| undefined","references":{"ChartModel":{"location":"local","path":"model/chart-model/chart-model","id":"notImplemented"},"WebChart":{"location":"local","path":"spec/web-chart","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Provides an API to interact with the chart's configuration.\n\n`model` accepts either a [ChartModel](https://developers.arcgis.com/javascript/latest/references/charts-components/model/chart-model/chart-model/) instance or a [WebChart](https://developers.arcgis.com/javascript/latest/references/charts-components/spec/web-chart/#WebChart) object.\n- `ChartModel`: A chart model class instance, which can be created using the [createModel](https://developers.arcgis.com/javascript/latest/references/charts-components/model/shared/setup-utils/#createModel) function.\n - This is the recommended approach as it ensures the chart configuration is valid and compatible with the component.\n- `WebChart`: A plain chart configuration object that follows the [WebChart](https://developers.arcgis.com/javascript/latest/references/charts-components/spec/web-chart/#WebChart) specification.","docsTags":[{"name":"see","text":"[Create a new chart with charts model](https://developers.arcgis.com/javascript/latest/charts/#create-a-new-chart-with-charts-model)"}],"values":[],"optional":true,"required":false},{"name":"nullAsValid","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"null-as-valid","reflectToAttr":false,"docs":"When `true`, null values are considered as valid.\n\nBy default, when the data contains only null values, the chart dataset is considered empty:\n- The [@arcgisBadDataWarningRaise](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#event-arcgisBadDataWarningRaise) event will be sent.\n- The \"No data available to display\" warning message will be displayed in the chart container.","docsTags":[],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"placeholder","type":"string \| undefined","complexType":{"original":"string \| undefined","resolved":"string \| undefined","references":{}},"mutable":true,"attr":"placeholder","reflectToAttr":false,"docs":"Placeholder text displayed in the chart container when no chart is configured.\nIf the string contains HTML tags they will be interpreted as such.","docsTags":[{"name":"example","text":"```ts\nchartElement.placeholder = \"<strong>Welcome!</strong><br/>Read the <a href=\\\"https://developers.arcgis.com/javascript/latest/charts/charts-intro/\\\">charts introduction page</a> to get started.\";\n```\n\n![placeholder](https://developers.arcgis.com/javascript/latest/assets/references/components/chart/placeholder.avif)"}],"values":[{"type":"string"}],"optional":true,"required":false},{"name":"popupTemplateFieldInfosEnabled","type":"boolean \| undefined","complexType":{"original":"boolean \| undefined","resolved":"boolean \| undefined","references":{}},"mutable":true,"attr":"popup-template-field-infos-enabled","reflectToAttr":false,"docs":"When `true`, field aliases from layer's [popupTemplate](/references/core/layers/FeatureLayer/#popupTemplate) are used to render field names in tooltips, axes and legend on the chart.","docsTags":[],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"queueChartCreation","type":"boolean \| undefined","complexType":{"original":"boolean \| undefined","resolved":"boolean \| undefined","references":{}},"mutable":true,"attr":"queue-chart-creation","reflectToAttr":false,"docs":"Builds charts sequentially instead of rendering them all at once.","docsTags":[],"default":"false","deprecation":"since 5.1. Use [skipChartCreationQueue](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#skipChartCreationQueue) instead.","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"replaceNoValueCategoryWithZero","type":"boolean \| undefined","complexType":{"original":"boolean \| undefined","resolved":"boolean \| undefined","references":{}},"mutable":true,"attr":"replace-no-value-category-with-zero","reflectToAttr":false,"docs":"When `true`, the chart's `dataItems` associated with empty (no value) categories (from only a `Count` aggregation)\nwill be populated with 0s.","docsTags":[],"default":"false","deprecation":"since 5.0. Use [hideZeroCountCategories](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#hideZeroCountCategories) instead.","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"returnFeaturesExtent","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"return-features-extent","reflectToAttr":false,"docs":"When `true`, the feature extent is returned in the payload of [@arcgisDataProcessComplete](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#event-arcgisDataProcessComplete)\nand [@arcgisSelectionComplete](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#event-arcgisSelectionComplete) events.\nApplies only to:\n- Charts using an aggregation.\n- Data sources using a feature layer compatible with envelope aggregation.\n\nThe extent is returned through the [featuresExtentField](https://developers.arcgis.com/javascript/latest/references/charts-components/utils/defaults/index/#featuresExtentField) variable.\n\nNote: Not applicable to gauges.","docsTags":[],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"returnSelectionIndexes","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"return-selection-indexes","reflectToAttr":false,"docs":"When `true`, selection indexes are computed and returned whenever a selection is made on or passed to the chart.\n\nNote: Not applicable to gauges.","docsTags":[],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"returnSelectionOIDs","type":"boolean \| undefined","complexType":{"original":"boolean \| undefined","resolved":"boolean \| undefined","references":{}},"mutable":true,"attr":"return-selection-oi-ds","reflectToAttr":false,"docs":"When `true`, object ids are computed and returned whenever a selection is made on or passed to the chart.\nOnly considered for data sources using a [feature layer](/references/core/layers/FeatureLayer).\n\nNote: Not applicable to gauges or charts configured with imagery layers.","docsTags":[],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"rotated","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"rotated","reflectToAttr":false,"docs":"When `true`, the chart is rotated 90 degrees so that the x-axis becomes vertical and the y-axis becomes horizontal.\n\nNote: Applicable to bar charts, box plots, combo bar line charts and line charts.","docsTags":[],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"rotation","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"rotation","reflectToAttr":false,"docs":"When `true`, the chart is rotated 90 degrees so that the x-axis becomes vertical and the y-axis becomes horizontal.\n\nNote: Applicable to bar chart, line chart, combo bar line chart and box plot.","docsTags":[],"default":"false","deprecation":"since 5.0. Use either [rotated](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#rotated) or the charts model's [rotated](https://developers.arcgis.com/javascript/latest/references/charts-components/model/bar-chart-model/bar-chart-model/#rotated) prop instead.","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"runtimeDataFilters","type":"WebChartDataFilters \| undefined","complexType":{"original":"WebChartDataFilters \| undefined","resolved":"WebChartDataFilters \| undefined","references":{"WebChartDataFilters":{"location":"local","path":"spec/web-chart","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Applies runtime data filters to the chart, features will be filtered based on the provided key value pairs.\n\nSupported keys are `where`, `objectIds`, `geometry`, `spatialRelationship`, `distance`, `units`, `timeExtent`, and `gdbVersion`.","docsTags":[{"name":"example","text":"```ts\n// This example filters the chart to show only features with the name \"Katrina\", object IDs 12, 19, and 27, within a specified geometry, within 10 miles and a specific time extent.\nconst start = new Date(2005, 8, 23).getTime();\nconst end = new Date(2005, 8, 28).getTime();\n\nchartComponent.runtimeDataFilters = {\n where: \"Name = 'Katrina'\",\n objectIds: [12, 19, 27],\n geometry: {\n xmin: -130,\n ymin: 20,\n xmax: -60,\n ymax: 55,\n },\n spatialRelationship: \"contains\",\n distance: 10,\n units: \"miles\",\n timeExtent: [start, end]\n};\n```"}],"values":[],"optional":true,"required":false},{"name":"secondaryYAxisLabelFormatter","type":"AxisLabelFormatCallback \| undefined","complexType":{"original":"AxisLabelFormatCallback \| undefined","resolved":"AxisLabelFormatCallback \| undefined","references":{"AxisLabelFormatCallback":{"location":"local","path":"chart-rendering/common/interfaces","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Callback function used to format the secondary y-axis labels. If the returned string contains HTML tags they will be interpreted as such.","docsTags":[{"name":"example","text":"```ts\n// Render a custom secondary y-axis label with the value formatted as a compact currency.\nchartElement.secondaryYAxisLabelFormatter = (value) => {\n const formattedValue = new Intl.NumberFormat(\"en-US\", {\n style: \"currency\",\n currency: \"USD\",\n notation: \"compact\",\n maximumFractionDigits: 1,\n }).format(value);\n return `<strong>${formattedValue}</strong>`;\n};\n```\n\n![secondaryYAxisLabelFormatter](https://developers.arcgis.com/javascript/latest/assets/references/components/chart/secondaryYAxisLabelFormatter.avif)\n\nNote: Applicable to bar, line, and combo bar line charts configured with dual axes through the [setSeriesToSecondaryYAxis](https://developers.arcgis.com/javascript/latest/references/charts-components/model/bar-chart-model/bar-chart-model/#setSeriesToSecondaryYAxis) method."}],"values":[],"optional":true,"required":false},{"name":"selectionData","type":"SelectionData \| undefined","complexType":{"original":"SelectionData \| undefined","resolved":"SelectionData \| undefined","references":{"SelectionData":{"location":"local","path":"utils/misc/interfaces","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Applies a programmatic selection to the chart. The payload can target chart elements by object IDs (`selectionOIDs`), by indexes (`selectionIndexes`), or by items (`selectionItems`).\n\n##### Selection by object IDs\nWhen passing in a `selectionOIDs` array, the chart will match the provided object IDs with the chart's data items and apply the selection.","docsTags":[{"name":"example","text":"```ts\n// This selects the chart data items (`Mid East` and `Great Lakes`) that contains the object IDs \"3118\" and \"6544\".\nchartElement.selectionData = {\n selectionOIDs: [3118, 6544],\n};\n```\n\n<img\n src=\"https://developers.arcgis.com/javascript/latest/assets/references/components/chart/selectionData_selectionOIDs.avif\"\n alt=\"selectionOIDs\"\n style=\"max-width: 600px; width: 100%; height: auto;\"\n/>\n\n##### Selection by items\nWhen passing in a `selectionItems` array, the chart will match the provided items with the chart's data items and apply the selection."},{"name":"example","text":"```ts\n// This selects the first chart data item with the matching items.\nchartElement.selectionData = {\n selectionItems: [\n {\n // The field name and value\n neighbourhood_group: \"Manhattan\",\n // The y-series field name and value, 0 indicates the first series.\n COUNT_OBJECTID_0: \"\",\n },\n ],\n};\n```\n\n<img\n src=\"https://developers.arcgis.com/javascript/latest/assets/references/components/chart/selectionData_selectionItems.avif\"\n alt=\"selectionItems\"\n style=\"max-width: 600px; width: 100%; height: auto;\"\n/>\n\nNote: Not applicable to gauges."}],"values":[],"optional":true,"required":false},{"name":"selectionManager","type":"SelectionManager \| undefined","complexType":{"original":"SelectionManager \| undefined","resolved":"SelectionManager \| undefined","references":{"default":{"location":"import","path":"@arcgis/core/views/SelectionManager.js","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Selection manager object used to synchronize the selections with the chart when [syncViewSelection](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#syncViewSelection) is `true`.\nIt has precedence over the layer view's [SelectionManager](/references/core/views/SelectionManager/) when both are available.","docsTags":[{"name":"since","text":"5.1"}],"values":[],"optional":true,"required":false},{"name":"selectionTheme","type":"SelectionTheme \| undefined","complexType":{"original":"SelectionTheme \| undefined","resolved":"SelectionTheme \| undefined","references":{"SelectionTheme":{"location":"local","path":"utils/misc/interfaces","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Customizes the visual style applied to selected and non-selected chart data items (bars, slices, markers, boxes etc.).\n\n- The [`selectedElementsTheme`](/references/charts-components/utils/misc/interfaces/#SelectionTheme-selectedElementsTheme) property controls the appearance of selected elements.\n- The [`nonSelectedElementsTheme`](/references/charts-components/utils/misc/interfaces/#SelectionTheme-nonSelectedElementsTheme) property controls the appearance of elements that are not selected.","docsTags":[{"name":"example","text":"```ts\nchartElement.selectionTheme = {\n // The selected elements will have a magenta outline with a width of 3 pixels and will be scaled up by 10%.\n selectedElementsTheme: {\n elementOutlineColor: [255, 0, 237, 255],\n elementOutlineWidth: 3,\n transformation: {\n scale: 1.1,\n },\n },\n // The non-selected elements will be scaled down by 20% and have their opacity reduced to 50%.\n nonSelectedElementsTheme: {\n transformation: {\n scale: 0.8,\n opacity: 0.5,\n },\n },\n};\n```\n\n<img\n src=\"https://developers.arcgis.com/javascript/latest/assets/references/components/chart/selectionTheme.avif\"\n alt=\"selectionTheme\"\n style=\"max-width: 700px; width: 100%; height: auto;\"\n/>\n\nNote: Not applicable to gauges."}],"values":[],"optional":true,"required":false},{"name":"setTimeBinningInfoWhenNotProvided","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"set-time-binning-info-when-not-provided","reflectToAttr":false,"docs":"When `true`, the time binning unit and size is automatically set when not provided via the [`temporalBinningSize`](/references/charts-components/model/bar-chart-model/bar-chart-model/#temporalBinningSize) or [`temporalBinningUnit`](/references/charts-components/model/line-chart-model/line-chart-model/#temporalBinningUnit) properties of the chart model.\n\nThe time binning unit and size information for the chart will be derived from the dataset's date minimum and maximum values to compute an interval that best fits the date range.\n\nNote: Only applicable to charts with temporal binning enabled (bar chart, combo bar line chart, line chart, radar chart).","docsTags":[],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"showEmptySeries","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"show-empty-series","reflectToAttr":false,"docs":"When `true`, show the series on the chart and legend even if it doesn't contain any data.\n\nBy default, the empty series are hidden from the chart and the legend.","docsTags":[{"name":"example","text":"```ts\n// In this example, we first set a data filter to only include features with a room type of \"Entire home/apt\" or \"Private room\".\n// The \"Shared room\" series will be empty after applying the data filter.\nchartElement.runtimeDataFilters = {\n where: \"room_type = 'Entire home/apt' OR room_type = 'Private room'\",\n};\n\n// With the `showEmptySeries` property set to `true`,\n// the \"Shared room\" series will still be displayed on the chart and in the legend, even though it was filtered out.\nchartElement.showEmptySeries = true;\n```\n\n<img\n src=\"https://developers.arcgis.com/javascript/latest/assets/references/components/chart/showEmptySeries.avif\"\n alt=\"showEmptySeries\"\n style=\"max-width: 700px; width: 100%; height: auto;\"\n/>\n\nNote: Not applicable to gauges."},{"name":"since","text":"5.1"}],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"showLicenseWatermark","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"show-license-watermark","reflectToAttr":false,"docs":"When `true`, the license watermark is displayed on the lower left corner of the chart.","docsTags":[{"name":"since","text":"5.1"}],"default":"false","deprecation":"since 5.2. Won't be replaced.","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"showUIMessages","type":"boolean \| undefined","complexType":{"original":"boolean \| undefined","resolved":"boolean \| undefined","references":{}},"mutable":true,"attr":"show-ui-messages","reflectToAttr":false,"docs":"Whether to display or hide all UI messages (e.g. no data warnings, any placeholder messages set or invalid chart configuration).","docsTags":[],"default":"false","deprecation":"since 5.1. Use [hideUIMessages](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#hideUIMessages) instead.","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"skipChartCreationQueue","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"skip-chart-creation-queue","reflectToAttr":false,"docs":"When `true`, charts will render immediately without waiting for other charts to finish rendering.\nBy default, charts are queued so that only one chart renders at a time.","docsTags":[{"name":"since","text":"5.1"}],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"syncChartsSelection","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"sync-charts-selection","reflectToAttr":false,"docs":"When `true`, the selection will be synchronized between charts configured with the same layer.","docsTags":[{"name":"example","text":"```ts\n// Both charts are configured with the same layer.\n// The \"Private room\" slice is selected on the pie chart and the selection is reflected on the bar chart.\nchartElement1.syncChartsSelection = true;\nchartElement2.syncChartsSelection = true;\n```\n\n<img\n src=\"https://developers.arcgis.com/javascript/latest/assets/references/components/chart/syncChartsSelection.avif\"\n alt=\"syncChartsSelection\"\n style=\"max-width: 700px; width: 100%; height: auto;\"\n/>"},{"name":"since","text":"5.1"}],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"syncSelection","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"sync-selection","reflectToAttr":false,"docs":"Whether to synchronize the selection between chart components from the same layer.","docsTags":[],"default":"false","deprecation":"since 5.1. Use [syncChartsSelection](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#syncChartsSelection) prop instead.","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"syncSelectionsBetweenChartAndLayerViewPolicy","type":"SyncSelectionsBetweenChartAndLayerViewPolicy","complexType":{"original":"SyncSelectionsBetweenChartAndLayerViewPolicy","resolved":"SyncSelectionsBetweenChartAndLayerViewPolicy","references":{"SyncSelectionsBetweenChartAndLayerViewPolicy":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"sync-selections-between-chart-and-layer-view-policy","reflectToAttr":false,"docs":"Determines whether the chart's selection should be synchronized with either the chart's [selectionManager](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#selectionManager) or the layer view's.","docsTags":[],"default":"\"disabled\"","deprecation":"since 5.1. Use [syncViewSelection](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#syncViewSelection) prop instead.","values":[{"type":"string","value":"disabled"},{"type":"string","value":"enabled"}],"optional":true,"required":false},{"name":"syncViewSelection","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"sync-view-selection","reflectToAttr":false,"docs":"Determines whether the chart's selection should be synchronized with either the chart's [selectionManager](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#selectionManager) or the layer view's.","docsTags":[{"name":"since","text":"5.1"}],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"syncViewTimeExtent","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"sync-view-time-extent","reflectToAttr":false,"docs":"Whether the chart should be refreshed when the view's time extent changes.\n\nNote: Not supported for histogram.","docsTags":[{"name":"since","text":"5.1"}],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"syncViewTimeZone","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"sync-view-time-zone","reflectToAttr":false,"docs":"Whether the chart's data should be in sync with the view's [timeZone](/references/core/views/MapView/#timeZone).\n\nNote: This applies only to charts supporting temporal data. Additionally if the data is binned, it applies only if the layer has the\ncapacity to handle the `/queryBins` operation. For any other case the chart will ignore the view's time zone regardless of the value of this property.","docsTags":[{"name":"since","text":"5.1"}],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"syncViewTimeZoneInclusionList","type":"(typeof WebChartTypes.BarSeries \| typeof WebChartTypes.ComboLineAndBarSeries \| typeof WebChartTypes.HeatSeries \| typeof WebChartTypes.LineSeries \| typeof WebChartTypes.RadarSeries)[]","complexType":{"original":"(typeof WebChartTypes.BarSeries \| typeof WebChartTypes.ComboLineAndBarSeries \| typeof WebChartTypes.HeatSeries \| typeof WebChartTypes.LineSeries \| typeof WebChartTypes.RadarSeries)[]","resolved":"(typeof WebChartTypes.BarSeries \| typeof WebChartTypes.ComboLineAndBarSeries \| typeof WebChartTypes.HeatSeries \| typeof WebChartTypes.LineSeries \| typeof WebChartTypes.RadarSeries)[]","references":{"WebChartTypes":{"location":"local","path":"spec/chart-object-literals","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"List of chart types to include from syncing the view's [`timeZone`](/references/core/views/MapView/#timeZone) with the data. Currently heat charts are included by default.\n\nNote: This applies only to charts supporting temporal data. Additionally if the data is binned, it applies only if the layer has the\ncapacity to handle the `/queryBins` operation. For any other case the chart will ignore the view's time zone regardless of the content of this list.","docsTags":[],"deprecation":"since 5.1. Use [syncViewTimeZone](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#syncViewTimeZone) instead.","values":[],"optional":true,"required":false},{"name":"timeZone","type":"MapView[\"timeZone\"] \| undefined","complexType":{"original":"MapView[\"timeZone\"] \| undefined","resolved":"MapView[\"timeZone\"] \| undefined","references":{"default":{"location":"import","path":"@arcgis/core/views/MapView.js","id":"notImplemented"}}},"mutable":true,"attr":"time-zone","reflectToAttr":false,"docs":"Used to set a custom time zone for the chart.","docsTags":[{"name":"example","text":"```ts\nchartComponent.timeZone = \"America/Los_Angeles\";\n```"}],"values":[{"type":"string"}],"optional":true,"required":false},{"name":"togglingLegendItemsDisabled","type":"boolean \| undefined","complexType":{"original":"boolean \| undefined","resolved":"boolean \| undefined","references":{}},"mutable":true,"attr":"toggling-legend-items-disabled","reflectToAttr":false,"docs":"When `true`, disables the toggling of series or slices from the legend items. Clicking on the legend items will not hide or show the corresponding elements on the chart.\n\nNote: Only applicable to charts with multiple series and while the legend is displayed.","docsTags":[],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"tooltipFormatter","type":"ChartOptions[\"tooltipFormatter\"] \| undefined","complexType":{"original":"ChartOptions[\"tooltipFormatter\"] \| undefined","resolved":"ChartOptions[\"tooltipFormatter\"] \| undefined","references":{"ChartOptions":{"location":"local","path":"chart-rendering/common/interfaces","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Callback function used to format the tooltips when hovering over a chart element. If the returned string contains HTML tags they will be interpreted as such.","docsTags":[{"name":"example","text":"```ts\n// Render a custom tooltip with the series name, x-value, and stat value.\nchartElement.tooltipFormatter = (props) => `\n <div>\n <div><strong>${props.seriesName}</strong> in <strong>${props.xValue}</strong></div>\n <div>Total listings: <strong>${props.statValue}</strong></div>\n </div>\n`;\n```\n\n![tooltipFormatter](https://developers.arcgis.com/javascript/latest/assets/references/components/chart/tooltipFormatter.avif)\n\nNote: Not applicable to gauges."}],"values":[],"optional":true,"required":false},{"name":"updateSplitBySeries","type":"MissingSplitBySeriesProps \| undefined","complexType":{"original":"MissingSplitBySeriesProps \| undefined","resolved":"MissingSplitBySeriesProps \| undefined","references":{"MissingSplitBySeriesProps":{"location":"local","path":"utils/components/interfaces","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Whether to automatically add the missing series to cover the split-by values not referenced in the configuration.\n- This property only applies to plain chart configuration object that's constructed following the [WebChart](https://developers.arcgis.com/javascript/latest/references/charts-components/spec/web-chart/#WebChart) specification.\n - When [`addMissingSeries`](/references/charts-components/utils/components/interfaces/#MissingSplitBySeriesProps-addMissingSeries) is set to `true`, the missing series will be added.\n - When [`seriesTemplate`](/references/charts-components/utils/components/interfaces/#MissingSplitBySeriesProps-seriesTemplate) is omitted, the first existing series from the configuration will be copied to be used as a model for the missing ones. The chart won't render if the series template is not set and there's no series in the configuration.\n- If a chart is configured using a chart model, this property is not necessary as the split-by series will be updated automatically when the model's properties are changed.\n\nNote: Applicable only to bar chart, box plot, line chart and radar chart when a split-by field is used.","docsTags":[],"values":[],"optional":true,"required":false},{"name":"useAnimatedCharts","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"use-animated-charts","reflectToAttr":false,"docs":"Enable animation on the chart.","docsTags":[],"default":"false","deprecation":"since 5.1. Use [animationEnabled](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#animationEnabled) instead.","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"usePopupTemplateFieldsInfo","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"use-popup-template-fields-info","reflectToAttr":false,"docs":"Allows the use of the fields alias from the `layer.popupTemplate` when rendering the field names on the chart (e.g. tooltips, axes, legend).","docsTags":[],"default":"false","deprecation":"since 5.1. Use [popupTemplateFieldInfosEnabled](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#popupTemplateFieldInfosEnabled) instead.","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"view","type":"MapView \| SceneView \| undefined","complexType":{"original":"MapView \| SceneView \| undefined","resolved":"MapView \| SceneView \| undefined","references":{"default":{"location":"import","path":"@arcgis/core/views/SceneView.js","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Used to access the feature layer view instance in order to perform client side queries.","docsTags":[],"values":[],"optional":true,"required":false},{"name":"viewTimeExtentChangePolicy","type":"ViewTimeExtentChangePolicy","complexType":{"original":"ViewTimeExtentChangePolicy","resolved":"ViewTimeExtentChangePolicy","references":{"ViewTimeExtentChangePolicy":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"view-time-extent-change-policy","reflectToAttr":false,"docs":"Whether the chart should be refreshed when the view's time extent changes.","docsTags":[],"default":"\"ignore\"","deprecation":"since 5.1. Use [syncViewTimeExtent](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#syncViewTimeExtent) prop instead.\n\nNote: Not applicable for histograms.","values":[{"type":"string","value":"refresh"},{"type":"string","value":"ignore"}],"optional":true,"required":false},{"name":"xAxisLabelFormatter","type":"AxisLabelFormatCallback \| undefined","complexType":{"original":"AxisLabelFormatCallback \| undefined","resolved":"AxisLabelFormatCallback \| undefined","references":{"AxisLabelFormatCallback":{"location":"local","path":"chart-rendering/common/interfaces","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Callback function used to format the x-axis labels. If the returned string contains HTML tags they will be interpreted as such.","docsTags":[{"name":"example","text":"```ts\n// Render a custom x-axis label with underlined string and bolded value.\nchartElement.xAxisLabelFormatter = (value) => {\n return `<u>Neighbourhood Group:</u> <strong>${value}</strong>`;\n};\n```\n\n![xAxisLabelFormatter](https://developers.arcgis.com/javascript/latest/assets/references/components/chart/xAxisLabelFormatter.avif)\n\nNote: Only applicable to charts with x-axis labels displayed."}],"values":[],"optional":true,"required":false},{"name":"yAxisLabelFormatter","type":"AxisLabelFormatCallback \| undefined","complexType":{"original":"AxisLabelFormatCallback \| undefined","resolved":"AxisLabelFormatCallback \| undefined","references":{"AxisLabelFormatCallback":{"location":"local","path":"chart-rendering/common/interfaces","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Callback function used to format the y-axis labels. If the returned string contains HTML tags they will be interpreted as such.","docsTags":[{"name":"example","text":"```ts\n// Render a custom y-axis label with underlined string and bolded value.\nchartElement.yAxisLabelFormatter = (value) => {\n return `<u>Rental Listings:</u> <strong>${value}</strong>`;\n};\n```\n\n![yAxisLabelFormatter](https://developers.arcgis.com/javascript/latest/assets/references/components/chart/yAxisLabelFormatter.avif)\n\nNote: Only applicable to charts with y-axis labels displayed."}],"values":[],"optional":true,"required":false}],"methods":[{"name":"applySelectionFromSelectionManager","returns":{"type":"void","docs":""},"complexType":{"signature":"(): void","parameters":[],"return":"void","references":{}},"signature":"applySelectionFromSelectionManager(): void","parameters":[],"docs":"Apply the selection from the selection manager to the chart.","docsTags":[{"name":"internal"}]},{"name":"clearSelection","returns":{"type":"Promise<void>","docs":""},"complexType":{"signature":"(): Promise<void>","parameters":[],"return":"Promise<void>","references":{"Promise":{"location":"global","path":"global:","id":"notImplemented"}}},"signature":"clearSelection(): Promise<void>","parameters":[],"docs":"Clears all selection on the chart.\n\nNote: Not applicable to gauge.","docsTags":[]},{"name":"componentOnReady","returns":{"type":"Promise<this>","docs":""},"complexType":{"signature":"(): Promise<this>","parameters":[],"return":"Promise<this>","references":{"Promise":{"location":"import","path":"typescript/lib/lib.es5.d.ts","id":"notImplemented"}}},"signature":"componentOnReady(): Promise<this>","parameters":[],"docs":"Creates a promise that resolves once the component is fully loaded.","docsTags":[{"name":"example","text":"```js\nconst arcgisChart = document.createElement(\"arcgis-chart\");\ndocument.body.append(arcgisChart);\nawait arcgisChart.componentOnReady();\nconsole.log(\"arcgis-chart is ready to go!\");\n```"},{"name":"inheritedFrom","text":"{\"name\":\"this\"}"}]},{"name":"destroy","returns":{"type":"Promise<void>","docs":""},"complexType":{"signature":"(): Promise<void>","parameters":[],"return":"Promise<void>","references":{"Promise":{"location":"global","path":"global:","id":"notImplemented"}}},"signature":"destroy(): Promise<void>","parameters":[],"docs":"Destroys the chart instance.","docsTags":[{"name":"since","text":"5.1"}]},{"name":"errorAlert","returns":{"type":"Promise<void>","docs":""},"complexType":{"signature":"(errorMessage?: string): Promise<void>","parameters":[{"name":"errorMessage","type":"string","docs":""}],"return":"Promise<void>","references":{"Promise":{"location":"global","path":"global:","id":"notImplemented"}}},"signature":"errorAlert(errorMessage?: string): Promise<void>","parameters":[{"name":"errorMessage","type":"string","docs":""}],"docs":"Triggers an alert to display an error message.","docsTags":[],"deprecation":"since 5.1. Won't be replaced."},{"name":"exportAsCSV","returns":{"type":"Promise<void>","docs":""},"complexType":{"signature":"(options?: CSVOptions): Promise<void>","parameters":[{"name":"options","type":"CSVOptions","docs":"The options to customize the exported CSV file."}],"return":"Promise<void>","references":{"Promise":{"location":"global","path":"global:","id":"notImplemented"},"CSVOptions":{"location":"local","path":"interfaces","id":"notImplemented"}}},"signature":"exportAsCSV(options?: CSVOptions): Promise<void>","parameters":[{"name":"options","type":"CSVOptions","docs":"The options to customize the exported CSV file."}],"docs":"Export the current chart's data as a CSV file.","docsTags":[{"name":"example","text":"```ts\n// Export the chart's data as a CSV file with custom options.\nawait chartElement.exportAsCSV({\n columns: [\"neighbourhood_group\", \"room_type\", \"Count\"],\n delimiter: \"\|\",\n includeHeader: false,\n quoteAll: true,\n locale: \"fr\"\n});\n```\n\n```csv\n// The exported CSV file will contain the following data:\nsep=\|\n\"Bronx\"\|\"Entire home/apt\"\|\"379\"\n\"Bronx\"\|\"Private room\"\|\"652\"\n\"Bronx\"\|\"Shared room\"\|\"60\"\n\"Brooklyn\"\|\"Entire home/apt\"\|\"9 559\"\n...\n```\n\nNote: Not supported for gauges, scatterplots and radar charts."}]},{"name":"exportAsImage","returns":{"type":"Promise<void>","docs":""},"complexType":{"signature":"(format?: DownloadableChartImagesTypes): Promise<void>","parameters":[{"name":"format","type":"DownloadableChartImagesTypes","docs":"The image format to export the chart as. Default: `png`."}],"return":"Promise<void>","references":{"Promise":{"location":"global","path":"global:","id":"notImplemented"},"DownloadableChartImagesTypes":{"location":"local","path":"utils/components/interfaces","id":"notImplemented"}}},"signature":"exportAsImage(format?: DownloadableChartImagesTypes): Promise<void>","parameters":[{"name":"format","type":"DownloadableChartImagesTypes","docs":"The image format to export the chart as. Default: `png`."}],"docs":"Exports and downloads the current chart as an image.\n- Supported formats: `png` (default), `jpeg`, `jpg`, `webp`, and `svg`.\n - When `webp` format is used on Safari, it will fallback to `png`.","docsTags":[]},{"name":"loadModel","returns":{"type":"Promise<void>","docs":""},"complexType":{"signature":"(): Promise<void>","parameters":[],"return":"Promise<void>","references":{"Promise":{"location":"global","path":"global:","id":"notImplemented"}}},"signature":"loadModel(): Promise<void>","parameters":[],"docs":"Returns a promise that resolves when the chart model is fully loaded.\n\nThis method should be used when loading a chart with [layerItemId](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#layerItemId) and [chartIndex](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#chartIndex), and further customization of the chart model is needed.","docsTags":[{"name":"example","text":"```html\n// Load a chart from a layer item\n<arcgis-chart layer-item-id=\"8871626e970a4f3e9d6113ec63a92f2f\" chart-index=\"2\" />\n```\n```ts\n// Get a reference to the chart element in the DOM\nconst chartElement = document.querySelector(\"arcgis-chart\");\n\n// Call the method to ensure the model is fully loaded before making changes\nawait chartElement.loadModel();\n\n// Once the model is loaded, use the model's properties/methods to customize\nchartElement.model.titleText = \"New Title\";\n```"},{"name":"see","text":"[Load from layer item and customize with charts model](https://developers.arcgis.com/javascript/latest/charts/#load-from-layer-item-and-customize-with-charts-model)"}]},{"name":"notify","returns":{"type":"Promise<void>","docs":""},"complexType":{"signature":"(message?: string, heading?: string): Promise<void>","parameters":[{"name":"message","type":"string","docs":"The message to display in the chart's container."},{"name":"heading","type":"string","docs":"The heading to display in the chart's container."}],"return":"Promise<void>","references":{"Promise":{"location":"global","path":"global:","id":"notImplemented"}}},"signature":"notify(message?: string, heading?: string): Promise<void>","parameters":[{"name":"message","type":"string","docs":"The message to display in the chart's container."},{"name":"heading","type":"string","docs":"The heading to display in the chart's container."}],"docs":"Passes external messages to the chart component and displays them in the chart's container.\nWhen a model update is overriding the notification modal, consider waiting for the [@arcgisUpdateComplete](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#event-arcgisUpdateComplete) event.","docsTags":[{"name":"example","text":"```html\n<button id=\"show-notification\" type=\"button\">Show notification</button>\n<button id=\"clear-notification\" type=\"button\">Clear notification</button>\n```\n\n```ts\n// When the \"Show notification\" button is clicked, the chart's container will display a custom message and heading.\ndocument.querySelector(\"#show-notification\").addEventListener(\"click\", () => {\n chartElement.notify(\n \"This is a notification message.\",\n \"Notification heading\",\n );\n});\n\n// When the \"Clear notification\" button is clicked, the chart's container will be cleared and hidden.\ndocument.querySelector(\"#clear-notification\").addEventListener(\"click\", () => {\n chartElement.notify();\n});\n```"}]},{"name":"refresh","returns":{"type":"Promise<void>","docs":""},"complexType":{"signature":"(props?: {\n updateData?: boolean;\n resetAxesBounds?: boolean;\n}): Promise<void>","parameters":[{"name":"props","type":"{\n updateData?: boolean;\n resetAxesBounds?: boolean;\n}","docs":"Properties to control the refresh behavior: `updateData` indicates whether to fetch new data (default: `true`), and `resetAxesBounds` indicates whether to reset the axes bounds along with the refresh (default: `false`)."}],"return":"Promise<void>","references":{"Promise":{"location":"global","path":"global:","id":"notImplemented"}}},"signature":"refresh(props?: {\n updateData?: boolean;\n resetAxesBounds?: boolean;\n}): Promise<void>","parameters":[{"name":"props","type":"{\n updateData?: boolean;\n resetAxesBounds?: boolean;\n}","docs":"Properties to control the refresh behavior: `updateData` indicates whether to fetch new data (default: `true`), and `resetAxesBounds` indicates whether to reset the axes bounds along with the refresh (default: `false`)."}],"docs":"Re-render the chart.","docsTags":[]},{"name":"resetZoom","returns":{"type":"Promise<void>","docs":""},"complexType":{"signature":"(): Promise<void>","parameters":[],"return":"Promise<void>","references":{"Promise":{"location":"global","path":"global:","id":"notImplemented"}}},"signature":"resetZoom(): Promise<void>","parameters":[],"docs":"Resets the chart's zoom and brings it back to full zoom extent.\n\nNote: Not applicable to gauges, heat charts, pie charts and radar charts.","docsTags":[]},{"name":"switchSelection","returns":{"type":"Promise<void>","docs":""},"complexType":{"signature":"(): Promise<void>","parameters":[],"return":"Promise<void>","references":{"Promise":{"location":"global","path":"global:","id":"notImplemented"}}},"signature":"switchSelection(): Promise<void>","parameters":[],"docs":"Switches the selection on the chart.\n\nNote: Not applicable to gauges.","docsTags":[]}],"events":[{"event":"arcgisAxesMinMaxChange","detail":"AxesMinMaxChangePayload","bubbles":true,"complexType":{"original":"AxesMinMaxChangePayload","resolved":"AxesMinMaxChangePayload","references":{"AxesMinMaxChangePayload":{"location":"local","path":"utils/components/event-payloads","id":"notImplemented"}}},"cancelable":true,"composed":true,"docs":"Event triggered once the chart axes min/max values are computed.","docsTags":[]},{"event":"arcgisBadDataWarningRaise","detail":"DataWarningObject","bubbles":true,"complexType":{"original":"DataWarningObject","resolved":"DataWarningObject","references":{"DataWarningObject":{"location":"local","path":"utils/chart-config/validator/interfaces","id":"notImplemented"}}},"cancelable":true,"composed":true,"docs":"Event triggered when an error is detected with the data set.","docsTags":[]},{"event":"arcgisChartNotFoundWarning","detail":"string","bubbles":true,"complexType":{"original":"string","resolved":"string","references":{}},"cancelable":true,"composed":true,"docs":"Event triggered when the chart is not found for the given [chartIndex](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#chartIndex) property.","docsTags":[]},{"event":"arcgisConfigChange","detail":"{\n newConfig: WebChart \| undefined;\n oldConfig: WebChart \| undefined;\n functionCalled: string \| undefined;\n}","bubbles":true,"complexType":{"original":"{\n newConfig: WebChart \| undefined;\n oldConfig: WebChart \| undefined;\n functionCalled: string \| undefined;\n}","resolved":"{\n newConfig: WebChart \| undefined;\n oldConfig: WebChart \| undefined;\n functionCalled: string \| undefined;\n}","references":{"WebChart":{"location":"local","path":"spec/web-chart","id":"notImplemented"}}},"cancelable":true,"composed":true,"docs":"Event triggered when the chart config is changed.","docsTags":[]},{"event":"arcgisDataFetchComplete","detail":"WebChartDataTypes","bubbles":true,"complexType":{"original":"WebChartDataTypes","resolved":"WebChartDataTypes","references":{"WebChartDataTypes":{"location":"local","path":"spec/data-source","id":"notImplemented"}}},"cancelable":true,"composed":true,"docs":"Event triggered once the chart data has been fetched but not yet fully processed.\n\nFor instance it can be useful to see all the slices before they get grouped into an 'other' slice during the post-processing step.\n\nNote: Applicable to pie charts only.","docsTags":[]},{"event":"arcgisDataProcessComplete","detail":"DataProcessCompletePayload","bubbles":true,"complexType":{"original":"DataProcessCompletePayload","resolved":"DataProcessCompletePayload","references":{"DataProcessCompletePayload":{"location":"local","path":"utils/components/event-payloads","id":"notImplemented"}}},"cancelable":true,"composed":true,"docs":"Event triggered once the chart data has been processed.","docsTags":[]},{"event":"arcgisDataProcessError","detail":"void","bubbles":true,"complexType":{"original":"void","resolved":"void","references":{}},"cancelable":true,"composed":true,"docs":"Event triggered when an error occurred while fetching of processing the data for the chart.","docsTags":[]},{"event":"arcgisInvalidConfigWarningRaise","detail":"DataWarningObject","bubbles":true,"complexType":{"original":"DataWarningObject","resolved":"DataWarningObject","references":{"DataWarningObject":{"location":"local","path":"utils/chart-config/validator/interfaces","id":"notImplemented"}}},"cancelable":true,"composed":true,"docs":"Event triggered when an invalid configuration is detected.","docsTags":[],"deprecation":"since 5.1. Won't be replaced."},{"event":"arcgisLegendItemVisibilityChange","detail":"LegendItemVisibilityChangePayload","bubbles":true,"complexType":{"original":"LegendItemVisibilityChangePayload","resolved":"LegendItemVisibilityChangePayload","references":{"LegendItemVisibilityChangePayload":{"location":"local","path":"utils/components/event-payloads","id":"notImplemented"}}},"cancelable":true,"composed":true,"docs":"Event triggered once a legend item visibility has been changed.","docsTags":[]},{"event":"arcgisNoRenderPropChange","detail":"NoRenderPropChangePayload","bubbles":true,"complexType":{"original":"NoRenderPropChangePayload","resolved":"NoRenderPropChangePayload","references":{"NoRenderPropChangePayload":{"location":"local","path":"utils/components/event-payloads","id":"notImplemented"}}},"cancelable":true,"composed":true,"docs":"Event triggered when a no-render prop is changed.","docsTags":[]},{"event":"arcgisRenderingComplete","detail":"void","bubbles":true,"complexType":{"original":"void","resolved":"void","references":{}},"cancelable":true,"composed":true,"docs":"Event triggered once the chart rendering is complete.","docsTags":[]},{"event":"arcgisRuntimeError","detail":"void","bubbles":true,"complexType":{"original":"void","resolved":"void","references":{}},"cancelable":true,"composed":true,"docs":"Event triggered when an error occurred that prevents the chart from being created or updated.","docsTags":[]},{"event":"arcgisSelectionComplete","detail":"SelectionCompletePayload","bubbles":true,"complexType":{"original":"SelectionCompletePayload","resolved":"SelectionCompletePayload","references":{"SelectionCompletePayload":{"location":"local","path":"utils/components/event-payloads","id":"notImplemented"}}},"cancelable":true,"composed":true,"docs":"Event triggered when a selection is applied to the chart.","docsTags":[]},{"event":"arcgisSeriesColorChange","detail":"SeriesColorChangePayload","bubbles":true,"complexType":{"original":"SeriesColorChangePayload","resolved":"SeriesColorChangePayload","references":{"SeriesColorChangePayload":{"location":"local","path":"utils/components/event-payloads","id":"notImplemented"}}},"cancelable":true,"composed":true,"docs":"Event triggered once the chart series color have been assigned.","docsTags":[]},{"event":"arcgisSeriesOrder","detail":"string[]","bubbles":true,"complexType":{"original":"string[]","resolved":"string[]","references":{}},"cancelable":true,"composed":true,"docs":"Event carrying the series id as they have been sorted following the `orderOptions` instructions.","docsTags":[]},{"event":"arcgisUpdateComplete","detail":"ValidationStatus","bubbles":true,"complexType":{"original":"ValidationStatus","resolved":"ValidationStatus","references":{"ValidationStatus":{"location":"local","path":"utils/chart-config/validator/interfaces","id":"notImplemented"}}},"cancelable":true,"composed":true,"docs":"Event triggered once the chart is updated.","docsTags":[]}],"styles":[],"slots":[{"name":"action-bar","docs":"Slot for the [arcgis-charts-action-bar](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-charts-action-bar/) component or [calcite-action-bar](https://developers.arcgis.com/calcite-design-system/components/action-bar/) component."}],"parts":[],"listeners":[]},{"filePath":"src/components/charts-action-bar/charts-action-bar.tsx","tag":"arcgis-charts-action-bar","overview":"","readme":"","usage":{},"docs":"The Charts Action Bar component provides context-specific actions such as rotation, zooming, and filtering, as well as general actions like exporting the chart as an image or CSV file.\nThis component is designed to be used with a chart component and is not intended for standalone use.","docsTags":[{"name":"see","text":"[Tutorial: Chart and map interactions](https://developers.arcgis.com/javascript/latest/tutorials/chart-and-map-interactions/)"},{"name":"since","text":"4.29"},{"name":"superclass","text":"{\"name\":\"HTMLElement\",\"package\":\"global:\",\"viewUrl\":\"https://developer.mozilla.org/docs/Web/API/HTMLElement\"}"}],"encapsulation":"shadow","dependents":[],"dependencies":[],"dependencyGraph":{},"props":[{"name":"actionBarSelectionMode","type":"Extract<ActionModes, \"monoSelection\" \| \"multiSelection\" \| \"multiSelectionWithCtrlKey\"> \| undefined","complexType":{"original":"Extract<ActionModes, \"monoSelection\" \| \"multiSelection\" \| \"multiSelectionWithCtrlKey\"> \| undefined","resolved":"Extract<ActionModes, \"monoSelection\" \| \"multiSelection\" \| \"multiSelectionWithCtrlKey\"> \| undefined","references":{"Extract":{"location":"global","path":"global:","id":"notImplemented"},"ActionModes":{"location":"local","path":"utils/cursor/interfaces","id":"notImplemented"}}},"mutable":true,"attr":"action-bar-selection-mode","reflectToAttr":false,"docs":"Defines which selection mode the slotted action bar should use.\n- `monoSelection`: Select a single data point/series, new selection replaces the previous one.\n- `multiSelection`: Select multiple data points/series, new selection adds to the previous one.\n- `multiSelectionWithCtrlKey`: Select multiple data points/series while holding the Ctrl key (Cmd key on Mac), new selection adds to the previous one.","docsTags":[],"default":"\"multiSelectionWithCtrlKey\"","values":[{"type":"string","value":"monoSelection"},{"type":"string","value":"multiSelection"},{"type":"string","value":"multiSelectionWithCtrlKey"}],"optional":true,"required":false},{"name":"chartElement","type":"ArcgisChart \| undefined","complexType":{"original":"ArcgisChart \| undefined","resolved":"ArcgisChart \| undefined","references":{"ArcgisChart":{"location":"local","path":"components/arcgis-chart","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Chart element reference with which the action bar is associated.","docsTags":[],"values":[],"optional":true,"required":false},{"name":"chartType","type":"ChartTypes \| undefined","complexType":{"original":"ChartTypes \| undefined","resolved":"ChartTypes \| undefined","references":{"ChartTypes":{"location":"local","path":"utils/misc/index","id":"notImplemented"}}},"mutable":true,"attr":"chart-type","reflectToAttr":false,"docs":"Chart type used to determine which default actions to display.","docsTags":[],"values":[{"type":"string","value":"scatterSeries"},{"type":"string","value":"pieSeries"},{"type":"string","value":"gaugeSeries"},{"type":"string","value":"lineSeries"},{"type":"string","value":"barSeries"},{"type":"string","value":"histogramSeries"},{"type":"string","value":"boxPlotSeries"},{"type":"string","value":"radarSeries"},{"type":"string","value":"comboLineAndBarSeries"},{"type":"string","value":"heatSeries"}],"optional":true,"required":false},{"name":"clearSelectionState","type":"ActionState","complexType":{"original":"ActionState","resolved":"ActionState","references":{"ActionState":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"clear-selection-state","reflectToAttr":false,"docs":"When `disabled`, interaction with the clear selection action is prevented and the component is displayed with lower opacity.","docsTags":[],"default":"\"enabled\"","values":[{"type":"string","value":"disabled"},{"type":"string","value":"enabled"}],"optional":true,"required":false},{"name":"clearSelectionTitle","type":"string \| undefined","complexType":{"original":"string \| undefined","resolved":"string \| undefined","references":{}},"mutable":true,"attr":"clear-selection-title","reflectToAttr":false,"docs":"Custom title for the clear selection action.","docsTags":[],"values":[{"type":"string"}],"optional":true,"required":false},{"name":"clearSelectionToggle","type":"ActionToggle","complexType":{"original":"ActionToggle","resolved":"ActionToggle","references":{"ActionToggle":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"clear-selection-toggle","reflectToAttr":false,"docs":"When `active`, the clear selection action is highlighted.","docsTags":[],"default":"\"inactive\"","values":[{"type":"string","value":"active"},{"type":"string","value":"inactive"}],"optional":true,"required":false},{"name":"csvExportExclusionList","type":"WebChartTypes[]","complexType":{"original":"WebChartTypes[]","resolved":"WebChartTypes[]","references":{"WebChartTypes":{"location":"local","path":"spec/chart-object-literals","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"The CSV export action is disabled for certain chart types.\n\nModify this property to add or remove chart types from the list of disabled types.","docsTags":[],"values":[],"optional":true,"required":false},{"name":"disableCSVExportForChartTypes","type":"WebChartTypes[]","complexType":{"original":"WebChartTypes[]","resolved":"WebChartTypes[]","references":{"WebChartTypes":{"location":"local","path":"spec/chart-object-literals","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"The CSV export action is disabled for certain chart types.\n\nModify this property to add or remove chart types from the list of disabled types.","docsTags":[],"deprecation":"since 5.1. Use [csvExportExclusionList](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-charts-action-bar/#csvExportExclusionList) instead.","values":[],"optional":true,"required":false},{"name":"editChartState","type":"ActionState","complexType":{"original":"ActionState","resolved":"ActionState","references":{"ActionState":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"edit-chart-state","reflectToAttr":false,"docs":"When `disabled`, interaction with the edit chart action is prevented and the component is displayed with lower opacity.","docsTags":[],"default":"\"disabled\"","values":[{"type":"string","value":"disabled"},{"type":"string","value":"enabled"}],"optional":true,"required":false},{"name":"editChartTitle","type":"string \| undefined","complexType":{"original":"string \| undefined","resolved":"string \| undefined","references":{}},"mutable":true,"attr":"edit-chart-title","reflectToAttr":false,"docs":"Custom title for the edit chart action.","docsTags":[],"values":[{"type":"string"}],"optional":true,"required":false},{"name":"editChartToggle","type":"ActionToggle","complexType":{"original":"ActionToggle","resolved":"ActionToggle","references":{"ActionToggle":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"edit-chart-toggle","reflectToAttr":false,"docs":"When `active`, the edit chart action is highlighted.","docsTags":[],"default":"\"inactive\"","values":[{"type":"string","value":"active"},{"type":"string","value":"inactive"}],"optional":true,"required":false},{"name":"expanded","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"expanded","reflectToAttr":false,"docs":"When `true`, the action bar is expanded.","docsTags":[],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"exportActionState","type":"ActionState","complexType":{"original":"ActionState","resolved":"ActionState","references":{"ActionState":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"export-action-state","reflectToAttr":false,"docs":"When `disabled`, interaction with the export action is prevented and the component is displayed with lower opacity.","docsTags":[],"default":"\"enabled\"","values":[{"type":"string","value":"disabled"},{"type":"string","value":"enabled"}],"optional":true,"required":false},{"name":"exportAsCSVState","type":"ActionState","complexType":{"original":"ActionState","resolved":"ActionState","references":{"ActionState":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"export-as-csv-state","reflectToAttr":false,"docs":"When `disabled`, interaction with the download CSV is prevented and the component is displayed with lower opacity.","docsTags":[],"default":"\"enabled\"","values":[{"type":"string","value":"disabled"},{"type":"string","value":"enabled"}],"optional":true,"required":false},{"name":"exportAsCSVTitle","type":"string \| undefined","complexType":{"original":"string \| undefined","resolved":"string \| undefined","references":{}},"mutable":true,"attr":"export-as-csv-title","reflectToAttr":false,"docs":"Custom title for the download CSV action.","docsTags":[],"values":[{"type":"string"}],"optional":true,"required":false},{"name":"exportAsImageState","type":"ActionState","complexType":{"original":"ActionState","resolved":"ActionState","references":{"ActionState":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"export-as-image-state","reflectToAttr":false,"docs":"When `disabled`, interaction with the download image is prevented and the component is displayed with lower opacity.","docsTags":[],"default":"\"enabled\"","values":[{"type":"string","value":"disabled"},{"type":"string","value":"enabled"}],"optional":true,"required":false},{"name":"exportAsImageTitle","type":"string \| undefined","complexType":{"original":"string \| undefined","resolved":"string \| undefined","references":{}},"mutable":true,"attr":"export-as-image-title","reflectToAttr":false,"docs":"Custom title for the download chart action.","docsTags":[],"values":[{"type":"string"}],"optional":true,"required":false},{"name":"filterByExtentState","type":"ActionState","complexType":{"original":"ActionState","resolved":"ActionState","references":{"ActionState":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"filter-by-extent-state","reflectToAttr":false,"docs":"When `disabled`, interaction with the filter by extent action is prevented and the component is displayed with lower opacity.","docsTags":[],"default":"\"enabled\"","values":[{"type":"string","value":"disabled"},{"type":"string","value":"enabled"}],"optional":true,"required":false},{"name":"filterByExtentTitle","type":"string \| undefined","complexType":{"original":"string \| undefined","resolved":"string \| undefined","references":{}},"mutable":true,"attr":"filter-by-extent-title","reflectToAttr":false,"docs":"Custom title for the filter by extent action.","docsTags":[],"values":[{"type":"string"}],"optional":true,"required":false},{"name":"filterByExtentToggle","type":"ActionToggle","complexType":{"original":"ActionToggle","resolved":"ActionToggle","references":{"ActionToggle":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"filter-by-extent-toggle","reflectToAttr":false,"docs":"When `active`, the filter by extent action is highlighted.","docsTags":[],"default":"\"inactive\"","values":[{"type":"string","value":"active"},{"type":"string","value":"inactive"}],"optional":true,"required":false},{"name":"filterBySelectionState","type":"ActionState","complexType":{"original":"ActionState","resolved":"ActionState","references":{"ActionState":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"filter-by-selection-state","reflectToAttr":false,"docs":"When `disabled`, interaction with the filter by selection action is prevented and the component is displayed with lower opacity.","docsTags":[],"default":"\"enabled\"","values":[{"type":"string","value":"disabled"},{"type":"string","value":"enabled"}],"optional":true,"required":false},{"name":"filterBySelectionTitle","type":"string \| undefined","complexType":{"original":"string \| undefined","resolved":"string \| undefined","references":{}},"mutable":true,"attr":"filter-by-selection-title","reflectToAttr":false,"docs":"Custom title for the filter by selection action.","docsTags":[],"values":[{"type":"string"}],"optional":true,"required":false},{"name":"filterBySelectionToggle","type":"ActionToggle","complexType":{"original":"ActionToggle","resolved":"ActionToggle","references":{"ActionToggle":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"filter-by-selection-toggle","reflectToAttr":false,"docs":"When `active`, the filter by selection action is highlighted.","docsTags":[],"default":"\"inactive\"","values":[{"type":"string","value":"active"},{"type":"string","value":"inactive"}],"optional":true,"required":false},{"name":"forceDisableActions","type":"boolean","complexType":{"original":"boolean","resolved":"boolean","references":{}},"mutable":true,"attr":"force-disable-actions","reflectToAttr":false,"docs":"When `true`, overrides the individual settings for each action to instead force disable them all.","docsTags":[],"default":"false","values":[{"type":"boolean"}],"optional":true,"required":false},{"name":"fullExtentState","type":"ActionState","complexType":{"original":"ActionState","resolved":"ActionState","references":{"ActionState":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"full-extent-state","reflectToAttr":false,"docs":"When `disabled`, interaction with the full extent action is prevented and the component is displayed with lower opacity.","docsTags":[],"default":"\"enabled\"","values":[{"type":"string","value":"disabled"},{"type":"string","value":"enabled"}],"optional":true,"required":false},{"name":"fullExtentTitle","type":"string \| undefined","complexType":{"original":"string \| undefined","resolved":"string \| undefined","references":{}},"mutable":true,"attr":"full-extent-title","reflectToAttr":false,"docs":"Custom title for the full extent action.","docsTags":[],"values":[{"type":"string"}],"optional":true,"required":false},{"name":"fullExtentToggle","type":"ActionToggle","complexType":{"original":"ActionToggle","resolved":"ActionToggle","references":{"ActionToggle":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"full-extent-toggle","reflectToAttr":false,"docs":"When `active`, the full extent action is highlighted.","docsTags":[],"default":"\"inactive\"","values":[{"type":"string","value":"active"},{"type":"string","value":"inactive"}],"optional":true,"required":false},{"name":"hiddenActions","type":"DefaultChartActions[]","complexType":{"original":"DefaultChartActions[]","resolved":"DefaultChartActions[]","references":{"DefaultChartActions":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Holds a list of actions to hide from the action bar.\n\nNote: The edit chart action is hidden by default. To show it, remove its value from this array.","docsTags":[],"values":[],"optional":true,"required":false},{"name":"legendState","type":"ActionState","complexType":{"original":"ActionState","resolved":"ActionState","references":{"ActionState":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"legend-state","reflectToAttr":false,"docs":"When `disabled`, interaction with the legend action is prevented and the component is displayed with lower opacity.","docsTags":[],"default":"\"enabled\"","values":[{"type":"string","value":"disabled"},{"type":"string","value":"enabled"}],"optional":true,"required":false},{"name":"legendTitle","type":"string \| undefined","complexType":{"original":"string \| undefined","resolved":"string \| undefined","references":{}},"mutable":true,"attr":"legend-title","reflectToAttr":false,"docs":"Custom title for the legend action.","docsTags":[],"values":[{"type":"string"}],"optional":true,"required":false},{"name":"legendToggle","type":"ActionToggle","complexType":{"original":"ActionToggle","resolved":"ActionToggle","references":{"ActionToggle":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"legend-toggle","reflectToAttr":false,"docs":"When `active`, the legend action is highlighted.","docsTags":[],"default":"\"inactive\"","values":[{"type":"string","value":"active"},{"type":"string","value":"inactive"}],"optional":true,"required":false},{"name":"messageOverrides","type":"Record<string, unknown> \| undefined","complexType":{"original":"Record<string, unknown> \| undefined","resolved":"Record<string, unknown> \| undefined","references":{"Record":{"location":"global","path":"global:","id":"notImplemented"}}},"mutable":true,"reflectToAttr":false,"docs":"Overwrite localized strings for this component.","docsTags":[],"values":[],"optional":true,"required":false},{"name":"rotateChartState","type":"ActionState","complexType":{"original":"ActionState","resolved":"ActionState","references":{"ActionState":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"rotate-chart-state","reflectToAttr":false,"docs":"When `disabled`, interaction with the rotate chart action is prevented and the component is displayed with lower opacity.","docsTags":[],"default":"\"enabled\"","values":[{"type":"string","value":"disabled"},{"type":"string","value":"enabled"}],"optional":true,"required":false},{"name":"rotateChartTitle","type":"string \| undefined","complexType":{"original":"string \| undefined","resolved":"string \| undefined","references":{}},"mutable":true,"attr":"rotate-chart-title","reflectToAttr":false,"docs":"Custom title for the rotate chart action.","docsTags":[],"values":[{"type":"string"}],"optional":true,"required":false},{"name":"rotateChartToggle","type":"ActionToggle","complexType":{"original":"ActionToggle","resolved":"ActionToggle","references":{"ActionToggle":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"rotate-chart-toggle","reflectToAttr":false,"docs":"When `active`, the rotate chart action is highlighted.","docsTags":[],"default":"\"inactive\"","values":[{"type":"string","value":"active"},{"type":"string","value":"inactive"}],"optional":true,"required":false},{"name":"selectionState","type":"ActionState","complexType":{"original":"ActionState","resolved":"ActionState","references":{"ActionState":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"selection-state","reflectToAttr":false,"docs":"When `disabled`, interaction with the selection action is prevented and the component is displayed with lower opacity.","docsTags":[],"default":"\"enabled\"","values":[{"type":"string","value":"disabled"},{"type":"string","value":"enabled"}],"optional":true,"required":false},{"name":"selectionTitle","type":"string \| undefined","complexType":{"original":"string \| undefined","resolved":"string \| undefined","references":{}},"mutable":true,"attr":"selection-title","reflectToAttr":false,"docs":"Custom title for the selection action.","docsTags":[],"values":[{"type":"string"}],"optional":true,"required":false},{"name":"selectionToggle","type":"ActionToggle","complexType":{"original":"ActionToggle","resolved":"ActionToggle","references":{"ActionToggle":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"selection-toggle","reflectToAttr":false,"docs":"When `active`, the selection action is highlighted.","docsTags":[],"default":"\"inactive\"","values":[{"type":"string","value":"active"},{"type":"string","value":"inactive"}],"optional":true,"required":false},{"name":"switchSelectionState","type":"ActionState","complexType":{"original":"ActionState","resolved":"ActionState","references":{"ActionState":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"switch-selection-state","reflectToAttr":false,"docs":"When `disabled`, interaction with the switch selection action is prevented and the component is displayed with lower opacity.","docsTags":[],"default":"\"enabled\"","values":[{"type":"string","value":"disabled"},{"type":"string","value":"enabled"}],"optional":true,"required":false},{"name":"switchSelectionTitle","type":"string \| undefined","complexType":{"original":"string \| undefined","resolved":"string \| undefined","references":{}},"mutable":true,"attr":"switch-selection-title","reflectToAttr":false,"docs":"Custom title for the switch selection action.","docsTags":[],"values":[{"type":"string"}],"optional":true,"required":false},{"name":"switchSelectionToggle","type":"ActionToggle","complexType":{"original":"ActionToggle","resolved":"ActionToggle","references":{"ActionToggle":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"switch-selection-toggle","reflectToAttr":false,"docs":"When `active`, the switch selection action is highlighted.","docsTags":[],"default":"\"inactive\"","values":[{"type":"string","value":"active"},{"type":"string","value":"inactive"}],"optional":true,"required":false},{"name":"zoomState","type":"ActionState","complexType":{"original":"ActionState","resolved":"ActionState","references":{"ActionState":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"zoom-state","reflectToAttr":false,"docs":"When `disabled`, interaction with the zoom action is prevented and the component is displayed with lower opacity.","docsTags":[],"default":"\"enabled\"","values":[{"type":"string","value":"disabled"},{"type":"string","value":"enabled"}],"optional":true,"required":false},{"name":"zoomTitle","type":"string \| undefined","complexType":{"original":"string \| undefined","resolved":"string \| undefined","references":{}},"mutable":true,"attr":"zoom-title","reflectToAttr":false,"docs":"Custom title for the zoom action.","docsTags":[],"values":[{"type":"string"}],"optional":true,"required":false},{"name":"zoomToggle","type":"ActionToggle","complexType":{"original":"ActionToggle","resolved":"ActionToggle","references":{"ActionToggle":{"location":"local","path":"utils/types/index","id":"notImplemented"}}},"mutable":true,"attr":"zoom-toggle","reflectToAttr":false,"docs":"When `active`, the zoom action is highlighted.","docsTags":[],"default":"\"inactive\"","values":[{"type":"string","value":"active"},{"type":"string","value":"inactive"}],"optional":true,"required":false}],"methods":[{"name":"componentOnReady","returns":{"type":"Promise<this>","docs":""},"complexType":{"signature":"(): Promise<this>","parameters":[],"return":"Promise<this>","references":{"Promise":{"location":"import","path":"typescript/lib/lib.es5.d.ts","id":"notImplemented"}}},"signature":"componentOnReady(): Promise<this>","parameters":[],"docs":"Creates a promise that resolves once the component is fully loaded.","docsTags":[{"name":"example","text":"```js\nconst arcgisChartsActionBar = document.createElement(\"arcgis-charts-action-bar\");\ndocument.body.append(arcgisChartsActionBar);\nawait arcgisChartsActionBar.componentOnReady();\nconsole.log(\"arcgis-charts-action-bar is ready to go!\");\n```"},{"name":"inheritedFrom","text":"{\"name\":\"this\"}"}]}],"events":[{"event":"arcgisActionBarToggle","detail":"boolean","bubbles":true,"complexType":{"original":"boolean","resolved":"boolean","references":{}},"cancelable":true,"composed":true,"docs":"Event triggered once action bar expand is toggled.","docsTags":[]},{"event":"arcgisDefaultActionSelect","detail":"DefaultActionSelectPayload","bubbles":true,"complexType":{"original":"DefaultActionSelectPayload","resolved":"DefaultActionSelectPayload","references":{"DefaultActionSelectPayload":{"location":"local","path":"utils/components/event-payloads","id":"notImplemented"}}},"cancelable":true,"composed":true,"docs":"Event triggered once a default action is selected.","docsTags":[]}],"styles":[],"slots":[{"name":"custom-action-top","docs":"A slot for adding custom `calcite-action` to the top of the default actions."},{"name":"custom-action-below","docs":"A slot for adding custom `calcite-action` to the bottom of the default actions."}],"parts":[],"listeners":[]}],"typeLibrary":{}}