import type Layer from "../layers/Layer.js"; import type Sublayer from "../layers/support/Sublayer.js"; import type Widget from "./Widget.js"; import type ScaleRangeSliderViewModel from "./ScaleRangeSlider/ScaleRangeSliderViewModel.js"; import type { Icon } from "@esri/calcite-components/components/calcite-icon"; import type { MapViewOrSceneView } from "../views/MapViewOrSceneView.js"; import type { SupportedRegion } from "./ScaleRangeSlider/types.js"; import type { ScaleRangeSliderViewModelProperties } from "./ScaleRangeSlider/ScaleRangeSliderViewModel.js"; import type { WidgetProperties } from "./Widget.js"; export interface ScaleRangeSliderProperties extends WidgetProperties, Partial> { /** * Icon displayed in the widget's button. * * @default "actual-size" * @since 4.27 * @see [Calcite Icon Search](https://developers.arcgis.com/calcite-design-system/icons/) * @see [Calcite Icon Search](https://developers.arcgis.com/calcite-design-system/icons/) */ icon?: Icon["icon"] | null; /** * The widget's default label. * * @since 4.11 */ label?: string | null; /** * The view model for this widget. This is a class that contains all the logic * (properties and methods) that controls this widget's behavior. See the * [ScaleRangeSliderViewModel](https://developers.arcgis.com/javascript/latest/references/core/widgets/ScaleRangeSlider/ScaleRangeSliderViewModel/) class to access * all properties and methods on the widget. */ viewModel?: ScaleRangeSliderViewModelProperties; } /** * The visible elements that are displayed within the widget. * This provides the ability to turn individual elements of the widget's display on/off. */ export interface VisibleElements { /** * Indicates whether the preview thumbnail of the scale is visible. * Default value is `true`. */ preview?: boolean; /** * Indicates whether the scale dropdown menus are visible. * * @since 4.24 */ scaleMenus?: boolean | VisibleElementsScaleMenus; } export interface VisibleElementsScaleMenus { /** Indicates whether the minimum scale dropdown menu is visible. Default value is `true`. */ minScaleMenu?: boolean; /** Indicates whether the maximum scale dropdown menu is visible. Default value is `true`. */ maxScaleMenu?: boolean; } /** * The ScaleRangeSlider widget allows the user to set a minimum and maximum scale based on named scale ranges. * When a layer is provided to the widget, the [minScale](https://developers.arcgis.com/javascript/latest/references/core/widgets/ScaleRangeSlider/#minScale) and [maxScale](https://developers.arcgis.com/javascript/latest/references/core/widgets/ScaleRangeSlider/#maxScale) are set to the * scale range of the layer. * * The user can update the scale range by dragging thumbs across the slider to update the minScale and maxScale. * The user can also change the `minScale` and `maxScale` by using the dropdowns underneath the [minScaleLimit](https://developers.arcgis.com/javascript/latest/references/core/widgets/ScaleRangeSlider/#minScaleLimit) * and [maxScaleLimit](https://developers.arcgis.com/javascript/latest/references/core/widgets/ScaleRangeSlider/#maxScaleLimit). The thumbnail shows a preview of the scale based on the [region](https://developers.arcgis.com/javascript/latest/references/core/widgets/ScaleRangeSlider/#region) specified. * * ![widgets-scaleRangeSlider](https://developers.arcgis.com/javascript/latest/assets/references/core/widgets/widgets-scaleRangeSlider-v2.png) * * @deprecated since version 5.0. Use the [Scale Range Slider component](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-scale-range-slider/) instead. For information on widget deprecation, read about [Esri's move to web components](https://developers.arcgis.com/javascript/latest/components-transition-plan/). * @since 4.13 * @see [ScaleRangeSliderViewModel](https://developers.arcgis.com/javascript/latest/references/core/widgets/ScaleRangeSlider/ScaleRangeSliderViewModel/) * @see [ScaleRanges](https://developers.arcgis.com/javascript/latest/references/core/widgets/ScaleRangeSlider/ScaleRanges/) * @see [Slider](https://developers.arcgis.com/javascript/latest/references/core/widgets/Slider/) * @example * const scaleRangeSlider = new ScaleRangeSlider({ * view: view, * layer: featureLayer, // scale range of this layer sets initial minScale and maxScale * region: "MX", // preview thumbnail will be of Mexico * }); * view.ui.add(scaleRangeSlider, "bottom-left"); * * // to update the featureLayer min/max scale based on the slider * reactiveUtils.watch( * () => [scaleRangeSlider.minScale, scaleRangeSlider.maxScale], * ([minScale, maxScale]) => { * featureLayer.minScale = minScale; * featureLayer.maxScale = maxScale; * } * ); */ export default class ScaleRangeSlider extends Widget { constructor(properties?: ScaleRangeSliderProperties); /** * When `true`, sets the widget to a disabled state so the user cannot interact with it. * * @default false */ accessor disabled: boolean; /** * Icon displayed in the widget's button. * * @default "actual-size" * @since 4.27 * @see [Calcite Icon Search](https://developers.arcgis.com/calcite-design-system/icons/) * @see [Calcite Icon Search](https://developers.arcgis.com/calcite-design-system/icons/) */ get icon(): Icon["icon"]; set icon(value: Icon["icon"] | null | undefined); /** * The widget's default label. * * @since 4.11 */ get label(): string; set label(value: string | null | undefined); /** * When provided, the initial [minScale](https://developers.arcgis.com/javascript/latest/references/core/widgets/ScaleRangeSlider/#minScale) and [maxScale](https://developers.arcgis.com/javascript/latest/references/core/widgets/ScaleRangeSlider/#maxScale) values will match the layer's. * * When a tiled layer is used, the slider will be restricted from moving the slider thumbs past the `lods` of the layer's tiling scheme. * Since version 4.28, when a [MapImageLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/MapImageLayer/) is used, the slider will be restricted from moving past the min/max scale defined on the map service. * The unavailable range will be designated with a dashed line. */ accessor layer: Layer | Sublayer | null | undefined; /** * The maximum scale of the active scale range. When the maxScale * reaches the [maxScaleLimit](https://developers.arcgis.com/javascript/latest/references/core/widgets/ScaleRangeSlider/#maxScaleLimit), the maxScale * value becomes 0 and there is no maximum scale set. */ accessor maxScale: number; /** The lowest possible maximum scale value on the slider. */ accessor maxScaleLimit: number; /** * The minimum scale of the active scale range. When the minScale * reaches the [minScaleLimit](https://developers.arcgis.com/javascript/latest/references/core/widgets/ScaleRangeSlider/#minScaleLimit), the minScale * value becomes 0 and there is no minimum scale. */ accessor minScale: number; /** The highest possible minimum scale value on the slider. */ accessor minScaleLimit: number; /** * The mode of the widget, indicating which slider thumbs can be adjusted. * * @default "range" * @since 4.29 */ accessor mode: "range" | "max-scale-only" | "min-scale-only"; /** * The region that the scale thumbnails will focus on. * Each region comes from the [ISO 3166-1 alpha-2 code](https://en.wikipedia.org/wiki/List_of_ISO_3166_country_codes). * See [SupportedRegion](https://developers.arcgis.com/javascript/latest/references/core/widgets/ScaleRangeSlider/types/#SupportedRegion) for the list of regions that are currently supported. * * @default "US" */ accessor region: SupportedRegion; /** * Indicates whether the world scale value is shown in the scale menu. * * @default false * @since 4.34 */ accessor showWorldValue: boolean; /** * A reference to the [MapView](https://developers.arcgis.com/javascript/latest/references/core/views/MapView/) or [SceneView](https://developers.arcgis.com/javascript/latest/references/core/views/SceneView/). * Set this to link the widget to a specific view. */ accessor view: MapViewOrSceneView | null | undefined; /** * The view model for this widget. This is a class that contains all the logic * (properties and methods) that controls this widget's behavior. See the * [ScaleRangeSliderViewModel](https://developers.arcgis.com/javascript/latest/references/core/widgets/ScaleRangeSlider/ScaleRangeSliderViewModel/) class to access * all properties and methods on the widget. */ get viewModel(): ScaleRangeSliderViewModel; set viewModel(value: ScaleRangeSliderViewModelProperties); /** * The visible elements that are displayed within the widget. * This property provides the ability to turn individual elements of the widget's display on/off. * * @example * scaleRangeSlider.visibleElements = { * preview: false // thumbnail preview of map will not be displayed * } */ accessor visibleElements: VisibleElements; }