Visualize a Scene Layer with continuous color

Note: Support for 3D on mobile devices may vary, view the system requirements for more information.

This sample shows how to visualize a SceneLayer in 3D, using visual variables to appy a color ramp based on the SceneLayer's attributes.

Yellow features represent buildings constructed prior to 1915 and deep blue features represent a buildings built in or after 2015. The color visual variable is set on the visual variables property of the renderer. The stops property sets up a color ramp by mapping min and max values to specific colors and interpolating intermediate values. Buildings built between 1915 and 2015 will be assigned a color proportional to the provided min and max colors.

// Create the renderer and configure visual variables
var renderer = {
  type: "simple",  // autocasts as new SimpleRenderer()
  // Add a default MeshSymbol3D. The color will be determined
  // by the visual variables
  symbol: { type: "mesh-3d" },
  visualVariables: [{
    // specifies a visual variable of continuous color
    type: "color",
    // based on a field indicating the year a building was constructed
    field: "CNSTRCT_YR",
    // color ramp from yellow to aqua blue
    // buildings built between 1915 and 2015 will be
    // assigned a color proportional to the min and max colors
    // specified below
    stops: [
      { value: 1915, color: "#FBE789" },
      { value: 2015, color: "#1B90A7" }

Keep in mind that attributes used in data-driven visualizations with visual variables must be accessible to a SceneLayer's cache. Keeping the number of cached attributes to a minimum improves the performance of the SceneLayer. Therefore it is best practice to be judicious with the attributes you make available through the service cache. See the ArcGIS Pro documenation to learn how to configure cached attributes in a Scene Service.

Additional visualization samples and resources

Sample search results


There were no match results from your search criteria.