@arcgis/core/webscene/background/ColorBackground.d.ts

ArcGIS Maps SDK for JavaScript: A complete 2D and 3D mapping and data visualization API

import type Color from "../../Color.js";
import type Background from "./Background.js";
import type { ColorLike } from "../../Color.js";
import type { BackgroundProperties } from "./Background.js";

export interface ColorBackgroundProperties extends BackgroundProperties {
  /**
   * The color of the background.
   * This can be autocast with an array of rgb(a) values, named string, hex string or an hsl(a) string,
   * an object with `r`, `g`, `b`, and `a` properties, or a [Color](https://developers.arcgis.com/javascript/latest/references/core/Color/) object.
   *
   * @default "black"
   */
  color?: ColorLike;
}

/**
 * This type of [Background](https://developers.arcgis.com/javascript/latest/references/core/webscene/background/Background/) allows to set a [Color](https://developers.arcgis.com/javascript/latest/references/core/Color/)
 * as the background of a [SceneView](https://developers.arcgis.com/javascript/latest/references/core/views/SceneView/).
 * The view environment stars and atmosphere will show on top of the background when enabled.
 * To have a clear background color only, make sure to set both the [view.environment.starsEnabled](https://developers.arcgis.com/javascript/latest/references/core/views/SceneView/#environment)
 * and [view.environment.atmosphereEnabled](https://developers.arcgis.com/javascript/latest/references/core/views/SceneView/#environment) properties to `false`.
 *
 * The default for ColorBackground is a fully opaque, black color. The example below shows how to change this:
 *
 * ![background-color](https://developers.arcgis.com/javascript/latest/assets/references/core/views/background-color.png)
 *
 * ```js
 * const view = new SceneView({
 *   container: "view",
 *   map: map,
 *   environment: {
 *     background: {
 *       type: "color",
 *       color: [255, 252, 244, 1]
 *     },
 *     starsEnabled: false,
 *     atmosphereEnabled: false
 *   }
 * });
 * ```
 * Set [SceneView.alphaCompositingEnabled](https://developers.arcgis.com/javascript/latest/references/core/views/SceneView/#alphaCompositingEnabled) to `true` when you want to make
 * the [SceneView](https://developers.arcgis.com/javascript/latest/references/core/views/SceneView/) background partially or fully transparent and blend with the rest of the webpage.
 *
 * ```js
 * const view = new SceneView({
 *   container: "view",
 *   map: map,
 *   alphaCompositingEnabled: true,
 *   environment: {
 *     background: {
 *       type: "color",
 *       color: [255, 252, 244, 0.4]
 *     },
 *     starsEnabled: false,
 *     atmosphereEnabled: false
 *   }
 * });
 * ```
 *
 * @since 4.8
 * @see [SceneView.environment.background](https://developers.arcgis.com/javascript/latest/references/core/views/SceneView/#environment)
 * @see [SceneView.alphaCompositingEnabled](https://developers.arcgis.com/javascript/latest/references/core/views/SceneView/#alphaCompositingEnabled)
 * @see [Sample - Custom background for SceneView](https://developers.arcgis.com/javascript/latest/sample-code/sceneview-background/)
 */
export default class ColorBackground extends Background {
  constructor(properties?: ColorBackgroundProperties);
  /**
   * The color of the background.
   * This can be autocast with an array of rgb(a) values, named string, hex string or an hsl(a) string,
   * an object with `r`, `g`, `b`, and `a` properties, or a [Color](https://developers.arcgis.com/javascript/latest/references/core/Color/) object.
   *
   * @default "black"
   */
  get color(): Color;
  set color(value: ColorLike);
  /**
   * Creates a deep clone of the object.
   *
   * @returns A deep clone of the object that
   *   invoked this method.
   */
  clone(): ColorBackground;
}