@arcgis/charts-components 5.2.0-next.45 → 5.2.0-next.47

package/dist/components/arcgis-chart/customElement.d.ts

@@ -22,16 +22,44 @@ import type { ErrorPolicy, LayerFieldsChangePolicy, LayerFilterChangePolicy, Lay
 import type { T9nMeta } from "@arcgis/lumina/controllers";
 
 /**
- * The Chart component renders a chart based on the provided model. Get started by reading the [introduction to charts](https://developers.arcgis.com/javascript/latest/charts-components-intro/) page.
+ * 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.
+ * There are different ways to render a chart with the ArcGIS Chart component:
  *
- * Supported chart types include bar charts, box plots, line charts, combo bar-line charts, gauges, heat charts, histograms, pie charts, scatterplots, and radar charts.
+ * ##### Load from a layer item
  *
- * @slot [action-bar] - Slot for adding a `charts-action-bar` component or `calcite-action-bar`.
- * @see [Introduction to charts](https://developers.arcgis.com/javascript/latest/charts-components-intro/)
- * @see
- * [Tutorial: Display a chart](https://developers.arcgis.com/javascript/latest/tutorials/display-a-chart/)
+ * To load a chart from a layer item, first the chart needs to be [configured in Map Viewer](https://doc.arcgis.com/en/arcgis-online/create-maps/configure-charts-mv.htm) and [saved to the layer item](https://doc.arcgis.com/en/arcgis-online/create-maps/duplicate-save-layers.htm#ESRI_SECTION1_2AE9121DFA5D4E099F0D434EBA7D9365).
+ * Then set the [layerItemId](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#layerItemId) property to the item's ID and the [chartIndex](https://developers.arcgis.com/javascript/latest/references/charts-components/components/arcgis-chart/#chartIndex) property to the index of the chart within the item.
  *
- * **Note**: When the chart is getting rendered 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.
+ * ```html
+ * <arcgis-chart layer-item-id="..." chart-index="0"></arcgis-chart>
+ * ```
+ *
+ * ##### Create a new chart with charts model
+ *
+ * To create a new chart, use the [`createModel()`](/references/charts-components/model/shared/setup-utils/#createModel) method with a layer and a chart type, then configure the chart using the model's properties and methods.
+ *
+ * ```js
+ * import FeatureLayer from "@arcgis/core/layers/FeatureLayer.js";
+ * import { createModel } from "@arcgis/charts-components/model/shared/setup-utils.js";
+ *
+ * const myLayer = new FeatureLayer({ portalItem: { id: "..." } });
+ *
+ * const chartElement = document.querySelector("arcgis-chart");
+ * const barChartModel = await createModel({ layer: myLayer, chartType: "barChart" });
+ * barChartModel.xAxisField = "field";
+ * ```
+ *
+ * Each supported chart type has its own configuration properties and methods, which are covered with examples in the [chart types documentation](https://developers.arcgis.com/javascript/latest/charts/chart-types/chart-types-intro).
+ *
+ * ##### See also:
+ * - [Introduction to charts](https://developers.arcgis.com/javascript/latest/charts-components-intro/)
+ * - [Tutorial: Display a chart](https://developers.arcgis.com/javascript/latest/tutorials/display-a-chart/)
+ * - [Tutorial: Chart and map interactions](https://developers.arcgis.com/javascript/latest/tutorials/chart-and-map-interactions/)
+ *
+ * > [!WARNING]
+ * > 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.
+ *
+ * @slot [action-bar] - 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.
  * @since 4.32
  */
 export abstract class ArcgisChart extends LitElement {
@@ -882,9 +910,9 @@ export abstract class ArcgisChart extends LitElement {
    */
   accessor layerFilterChangePolicy: LayerFilterChangePolicy;
   /**
-   * Layer item ID associated with the chart to be rendered. Can be used in conjunction with the `chartIndex` property.
+   * 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.
    *
-   * If `layerItemId` is set without `chartIndex`, the first chart in the layer will be rendered.
+   * The layer item ID can be found in the URL of the layer's item page on ArcGIS Online or Enterprise. For example, in the URL `https://www.arcgis.com/home/item.html?id=8871626e970a4f3e9d6113ec63a92f2f`, the layer item ID is `8871626e970a4f3e9d6113ec63a92f2f`.
    *
    * Supported layers include: `FeatureLayer`, `SubtypeSublayer`, `ImageryLayer`, `ImageryTileLayer` and `WCSLayer`.
    *