import type Symbol3DLayer from "./Symbol3DLayer.js"; import type Edges3D from "./edges/Edges3D.js"; import type Symbol3DMaterial from "./support/Symbol3DMaterial.js"; import type { Symbol3DMaterialProperties } from "./support/Symbol3DMaterial.js"; import type { Edges3DProperties } from "./edges/Edges3D.js"; import type { Symbol3DLayerProperties } from "./Symbol3DLayer.js"; export interface ExtrudeSymbol3DLayerProperties extends Symbol3DLayerProperties, Partial> { /** * Sets the contour edges on polygons symbolized with ExtrudeSymbol3DLayer. * * @since 4.7 * @example * let symbol = { * type: "polygon-3d", // autocasts as new PolygonSymbol3D() * symbolLayers: [{ * type: "extrude", // autocasts as new ExtrudeSymbol3DLayer() * material: { * color: [244, 247, 134] * }, * edges: { * type: "solid", // autocasts as new SolidEdges3D() * color: [50, 50, 50, 0.5] * } * }] * }; */ edges?: Edges3DProperties | null; /** * The material used to shade the extrusion. This property defines the extrusion's color and emissive properties. * * @example * // CSS color string * symbolLayer.material = { * color: "dodgerblue" * }; * @example * // HEX string * symbolLayer.material = { * color: "#33cc33"; * }; * @example * // array of RGBA values * symbolLayer.material = { * color: [51, 204, 51, 0.3]; * }; * @example * // object with rgba properties * symbolLayer.material = { * color: { * r: 51, * g: 51, * b: 204, * a: 0.7 * } * }; * @example * // object with emissive properties and color * symbolLayer.material: { * color: "#00E9FF", * emissive: { strength: 1, source: "color" }, * }; */ material?: Symbol3DMaterialProperties | null; } /** * ExtrudeSymbol3DLayer is used to render [Polygon](https://developers.arcgis.com/javascript/latest/references/core/geometry/Polygon/) geometries * by extruding them upward from the ground, creating a 3D volumetric object. This is done * with a [PolygonSymbol3D](https://developers.arcgis.com/javascript/latest/references/core/symbols/PolygonSymbol3D/) in a [SceneView](https://developers.arcgis.com/javascript/latest/references/core/views/SceneView/). * [MapView](https://developers.arcgis.com/javascript/latest/references/core/views/MapView/) does not support 3D symbols. * * The color of the symbol is set in the [material](https://developers.arcgis.com/javascript/latest/references/core/symbols/ExtrudeSymbol3DLayer/#material) property. The height of the extrusion is * always defined in meters with the [size](https://developers.arcgis.com/javascript/latest/references/core/symbols/ExtrudeSymbol3DLayer/#size) property. Extrusion height and color can also * be data-driven by adding [size](https://developers.arcgis.com/javascript/latest/references/core/renderers/SimpleRenderer/#visualVariables) and/or * [color visual variables](https://developers.arcgis.com/javascript/latest/references/core/renderers/SimpleRenderer/#visualVariables) * to any [Renderer](https://developers.arcgis.com/javascript/latest/references/core/renderers/Renderer/) that uses this symbol layer. * * An ExtrudeSymbol3DLayer must be added to the `symbolLayers` property of * a [PolygonSymbol3D](https://developers.arcgis.com/javascript/latest/references/core/symbols/PolygonSymbol3D/). Multiple symbol layers may be used in a single symbol. * The image below depicts a polygon [FeatureLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/FeatureLayer/) representing * building footprints. The features are * symbolized with a [PolygonSymbol3D](https://developers.arcgis.com/javascript/latest/references/core/symbols/PolygonSymbol3D/) containing an ExtrudeSymbol3DLayer. * The extrusion is based on the height of buildings. * * [![renderer-vv-size-3d](https://developers.arcgis.com/javascript/latest/assets/images/samples/9-vv-size-3d.png)](https://developers.arcgis.com/javascript/latest/sample-code/visualization-vv-extrusion/) * * See [Symbol3DLayer](https://developers.arcgis.com/javascript/latest/references/core/symbols/Symbol3DLayer/) and [Symbol3D](https://developers.arcgis.com/javascript/latest/references/core/symbols/Symbol3D/) to read * more general information about 3D symbols, symbol layers and how they relate to one another. * * @since 4.0 * @see [Symbol Builder](https://developers.arcgis.com/javascript/latest/symbol-builder/) * @see [Sample - Visualize features thematically with extrusion](https://developers.arcgis.com/javascript/latest/sample-code/visualization-vv-extrusion/) * @see [Sample - Extrude building footprints based on real world heights](https://developers.arcgis.com/javascript/latest/sample-code/visualization-buildings-3d/) * @see [Symbol3DLayer](https://developers.arcgis.com/javascript/latest/references/core/symbols/Symbol3DLayer/) * @see [Symbol3D](https://developers.arcgis.com/javascript/latest/references/core/symbols/Symbol3D/) * @see [Renderer](https://developers.arcgis.com/javascript/latest/references/core/renderers/Renderer/) * @see [ArcGIS blog - Working with objects, paths, and extrusion](https://blogs.esri.com/esri/arcgis/2016/01/25/3d-visualization-working-with-objects-paths-and-extrusion/) * @see [ArcGIS blog - Using attributes to represent real-world sizes of features](https://blogs.esri.com/esri/arcgis/2016/02/01/3d-visualization-using-attributes-to-represent-real-world-sizes-of-features/) * @example * let symbol = { * type: "polygon-3d", // autocasts as new PolygonSymbol3D() * symbolLayers: [{ * type: "extrude", // autocasts as new ExtrudeSymbol3DLayer() * size: 100000, // 100,000 meters in height * material: { color: "red" } * }] * }; */ export default class ExtrudeSymbol3DLayer extends Symbol3DLayer { constructor(properties?: ExtrudeSymbol3DLayerProperties); /** * Indicates whether the symbol layer geometry casts shadows in the scene. Setting this property to `false` will * disable shadows for the symbol layer even if direct shadows are enabled in [SceneView.environment](https://developers.arcgis.com/javascript/latest/references/core/views/SceneView/#environment). * * @default true * @since 4.11 * @example * // disables shadow casting * symbolLayer.castShadows = false; */ accessor castShadows: boolean; /** * Sets the contour edges on polygons symbolized with ExtrudeSymbol3DLayer. * * @since 4.7 * @example * let symbol = { * type: "polygon-3d", // autocasts as new PolygonSymbol3D() * symbolLayers: [{ * type: "extrude", // autocasts as new ExtrudeSymbol3DLayer() * material: { * color: [244, 247, 134] * }, * edges: { * type: "solid", // autocasts as new SolidEdges3D() * color: [50, 50, 50, 0.5] * } * }] * }; */ get edges(): Edges3D | null | undefined; set edges(value: Edges3DProperties | null | undefined); /** * The material used to shade the extrusion. This property defines the extrusion's color and emissive properties. * * @example * // CSS color string * symbolLayer.material = { * color: "dodgerblue" * }; * @example * // HEX string * symbolLayer.material = { * color: "#33cc33"; * }; * @example * // array of RGBA values * symbolLayer.material = { * color: [51, 204, 51, 0.3]; * }; * @example * // object with rgba properties * symbolLayer.material = { * color: { * r: 51, * g: 51, * b: 204, * a: 0.7 * } * }; * @example * // object with emissive properties and color * symbolLayer.material: { * color: "#00E9FF", * emissive: { strength: 1, source: "color" }, * }; */ get material(): Symbol3DMaterial | null | undefined; set material(value: Symbol3DMaterialProperties | null | undefined); /** * The height of the extrusion in meters. Negative values will extrude the * polygon surface downward towards or below the ground. * * @default 1 * @example * // polygon is extruded 50,000 meters * symbolLayer.size = 50000; */ accessor size: number; /** The symbol type. */ get type(): "extrude"; /** * Creates a deep clone of the symbol layer. * * @returns A deep clone of the object that * invoked this method. * @example * // Creates a deep clone of the graphic's first symbol layer * let symLyr = graphic.symbol.symbolLayers.at(0).clone(); */ clone(): ExtrudeSymbol3DLayer; }