Skip To Content ArcGIS for Developers Sign In Dashboard

ArcGIS Runtime SDK for .NET

Raster hillshade renderer

This code sample is available for these platforms:
View Sample on GitHub

Use a hillshade renderer on a raster.


How to use the sample

Configure the options for rendering, then click 'Apply hillshade'.

How it works

  1. The parameters provided by the user are passed to HillshadeRender at instantiation: new HillshadeRenderer(mAltitude, mAzimuth, mZFactor, mSlopeType, mPixelSizeFactor, mPixelSizePower, mOutputBitDepth); which returns a RasterRenderer. The RasterRenderer is then added to the RasterLayer.

Offline data

This sample downloads the following items from ArcGIS Online automatically:


Visualization, hillshade, raster, shadow, slope

Sample Code

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage x:Class="ArcGISRuntime.Samples.RasterHillshade.RasterHillshade"
             Title="Raster hillshade">
            <RowDefinition Height="180"/>
        <esriUI:MapView x:Name="MyMapView"
        <Grid Grid.Row="0"
              HorizontalOptions="CenterAndExpand" VerticalOptions="Start"
                    <ColumnDefinition Width="2*"/>
                <Label Grid.Row="0" Grid.Column="0"
                       Text="Slope type:"/>
                <Picker x:Name="SlopeTypePicker"
                        Grid.Row="0" Grid.Column="1"
                <Label Grid.Row="1" Grid.Column="0"
                       HorizontalTextAlignment="End" VerticalOptions="Center"
                <Slider x:Name="AltitudeSlider"
                        Grid.Row="1" Grid.Column="1"
                        Minimum="0" Maximum="90"/>
                <Label Grid.Row="2" Grid.Column="0"
                       HorizontalTextAlignment="End" VerticalOptions="Center"
                <Slider x:Name="AzimuthSlider"
                        Grid.Row="2" Grid.Column="1"
                        Minimum="0" Maximum="360"/>
                <Button x:Name="ApplyHillshadeButton"
                        Grid.Row="3" Grid.ColumnSpan="2"
                        VerticalOptions="Center" HorizontalOptions="CenterAndExpand"
                        Text="Apply hillshade"
// Copyright 2018 Esri.
// Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License.
// You may obtain a copy of the License at:
// Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an
// "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific
// language governing permissions and limitations under the License.

using Esri.ArcGISRuntime.Mapping;
using Esri.ArcGISRuntime.Rasters;
using ArcGISRuntime.Samples.Managers;
using System;
using Xamarin.Forms;
using System.Collections.Generic;

namespace ArcGISRuntime.Samples.RasterHillshade
        "Raster hillshade renderer",
        "This sample demonstrates how to use a hillshade renderer on a raster layer. Hillshade renderers can adjust a grayscale raster (usually of terrain) according to a hypothetical sun position (azimuth and altitude).",
    public partial class RasterHillshade : ContentPage
        // Constant to store a z-factor (conversion constant) applied to the hillshade.
        // If needed, this can be used to convert z-values to the same unit as the x/y coordinates or to apply a vertical exaggeration.
        private const double ZFactor = 1.0;

        // Constants to store the Pixel Size Power and Pixel Size Factor values.
        // Use these to account for altitude changes (scale) as the viewer zooms in and out (recommended when using worldwide datasets).
        private const double PixelSizePower = 1.0;
        private const double PixelSizeFactor = 1.0;

        // Constant to store the bit depth (pixel depth), which determines the range of values that the hillshade raster can store.
        private const int PixelBitDepth = 8;

        // Store a reference to the layer
        private RasterLayer _rasterLayer;

        // Store a dictionary of slope types
        private Dictionary<string, SlopeType> _slopeTypeValues = new Dictionary<string, SlopeType>();

        public RasterHillshade()

            // Call a function to set up the map

        private async void Initialize()
            // Create a map with a streets basemap
            Map map = new Map(Basemap.CreateStreets());

            // Get the file name for the local raster dataset
            string filepath = GetRasterPath();

            // Load the raster file
            Raster rasterFile = new Raster(filepath);

                // Create and load a new raster layer to show the image
                _rasterLayer = new RasterLayer(rasterFile);
                await _rasterLayer.LoadAsync();

                // Enable the apply renderer button when the layer loads.
                ApplyHillshadeButton.IsEnabled = true;

                // Create a viewpoint with the raster's full extent
                Viewpoint fullRasterExtent = new Viewpoint(_rasterLayer.FullExtent);

                // Set the initial viewpoint for the map
                map.InitialViewpoint = fullRasterExtent;

                // Add the layer to the map

                // Add the map to the map view
                MyMapView.Map = map;

                // Add slope type values to the dictionary and picker
                foreach (object slope in Enum.GetValues(typeof(SlopeType)))
                    _slopeTypeValues.Add(slope.ToString(), (SlopeType)slope);

                // Select the "Scaled" slope type enum
                SlopeTypePicker.SelectedIndex = 2;
            catch (Exception e)
                await Application.Current.MainPage.DisplayAlert("Error", e.ToString(), "OK");

        private void ApplyHillshadeButton_Click(object sender, EventArgs e)
            // Get the current parameter values
            double altitude = AltitudeSlider.Value;
            double azimuth = AzimuthSlider.Value;
            SlopeType typeOfSlope = _slopeTypeValues[SlopeTypePicker.SelectedItem.ToString()];

            // Create a hillshade renderer that uses the values selected by the user
            HillshadeRenderer hillshadeRenderer = new HillshadeRenderer(altitude, azimuth, ZFactor, typeOfSlope, PixelSizeFactor, PixelSizePower, PixelBitDepth);

            // Apply the new renderer to the raster layer
            _rasterLayer.Renderer = hillshadeRenderer;

        private static string GetRasterPath()
            return DataManager.GetDataFolder("134d60f50e184e8fa56365f44e5ce3fb", "srtm-hillshade", "srtm.tiff");