menu

MAUI

  • User Guide
  • Demos
  • Support
  • Forums
  • Download
Class RangeColorMapping - MAUI API Reference | Syncfusion

    Show / Hide Table of Contents

    Class RangeColorMapping

    Represents the range color mapping.

    Inheritance
    System.Object
    ColorMapping
    RangeColorMapping
    Inherited Members
    ColorMapping.Color
    ColorMapping.ColorProperty
    ColorMapping.Text
    ColorMapping.TextProperty
    Namespace: Syncfusion.Maui.Maps
    Assembly: Syncfusion.Maui.Maps.dll
    Syntax
    public class RangeColorMapping : ColorMapping
    Examples
    • XAML
    • C#
    <map:SfMaps>
       <map:SfMaps.Layer>
          <map:MapShapeLayer x:Name="layer"
                             ShapesSource="https://cdn.syncfusion.com/maps/map-data/world-map.json"
                             ShapeFill="Gray"
                             ShapeStroke="White"
                             ShapeStrokeThickness="2"
                             DataSource="{Binding WorldPopulationDensity}"
                             ShapeDataField="name"
                             PrimaryValuePath="CountryName"
                             ShapeColorValuePath="Density">
    
             <map:MapShapeLayer.ColorMappings>
                 <map:RangeColorMapping Color="#809fff" From="0" To="100" Text="0-100" />
                 <map:RangeColorMapping Color="#3366ff" From="100" To="500" Text="100-500" />
                 <map:RangeColorMapping Color="#0039e6" From="500" To="1000" Text="500-1000" />
                 <map:RangeColorMapping Color="#002db3" From="1000" To="5000" Text="1000-5000" />
                 <map:RangeColorMapping Color="#001a66" From="5000" To="50000" Text="5000-50000" />
             </map:MapShapeLayer.ColorMappings>
    
          </map:MapShapeLayer>
       </map:SfMaps.Layer>
    </map:SfMaps>
    SfMaps maps = new SfMaps();
    MapShapeLayer layer = new MapShapeLayer();
    RangeViewModel rangeViewModel = new RangeViewModel();
    this.BindingContext = new RangeViewModel();
    layer.ShapesSource = MapSource.FromUri(new Uri("https://cdn.syncfusion.com/maps/map-data/world-map.json"));
    layer.ShapeFill = Colors.Gray;
    layer.ShapeStroke = Colors.White;
    layer.ShapeStrokeThickness = 2;
    layer.DataSource = rangeViewModel.WorldPopulationDensity;
    layer.ShapeDataField = "name";
    layer.PrimaryValuePath="CountryName";
    layer.ShapeColorValuePath="Density";
    RangeColorMapping colorMapping1 = new RangeColorMapping();
    colorMapping1.Color = Color.FromRgb(128, 159, 255);
    colorMapping1.From = 0;
    colorMapping1.To = 100;
    colorMapping1.Text = "0-100";
    RangeColorMapping colorMapping2 = new RangeColorMapping();
    colorMapping2.Color = Color.FromRgb(51, 102, 255);
    colorMapping2.From = 100;
    colorMapping2.To = 500;
    colorMapping2.Text = "100-500";
    RangeColorMapping colorMapping3 = new RangeColorMapping();
    colorMapping3.Color = Color.FromRgb(0, 57, 230);
    colorMapping3.From = 500;
    colorMapping3.To = 1000;
    colorMapping3.Text = "500-1000";
    RangeColorMapping colorMapping4 = new RangeColorMapping();
    colorMapping4.Color = Color.FromRgb(0, 45, 179);
    colorMapping4.From = 1000;
    colorMapping4.To = 5000;
    colorMapping4.Text = "1000-5000";
    RangeColorMapping colorMapping5 = new RangeColorMapping();
    colorMapping5.Color = Color.FromRgb(0, 26, 102);
    colorMapping5.From = 5000;
    colorMapping5.To = 50000;
    colorMapping5.Text = "5000-50000";
    layer.ColorMappings.Add(colorMapping1);
    layer.ColorMappings.Add(colorMapping2);
    layer.ColorMappings.Add(colorMapping3);
    layer.ColorMappings.Add(colorMapping4);
    layer.ColorMappings.Add(colorMapping5);
    maps.Layer = layer;
    this.Content = maps;

    Constructors

    RangeColorMapping()

    Declaration
    public RangeColorMapping()

    Fields

    FromProperty

    Identifies the From bindable property.

    Declaration
    public static readonly BindableProperty FromProperty
    Field Value
    Type Description
    Microsoft.Maui.Controls.BindableProperty

    The identifier for From bindable property.

    ToProperty

    Identifies the To bindable property.

    Declaration
    public static readonly BindableProperty ToProperty
    Field Value
    Type Description
    Microsoft.Maui.Controls.BindableProperty

    The identifier for To bindable property.

    Properties

    From

    Gets or sets the start range for the color mapping.

    Declaration
    public double From { get; set; }
    Property Value
    Type Description
    System.Double

    The start range for the color mapping. The default is 0.

    Examples
    • XAML
    • C#
    <map:SfMaps>
       <map:SfMaps.Layer>
          <map:MapShapeLayer x:Name="layer"
                             ShapesSource="https://cdn.syncfusion.com/maps/map-data/world-map.json"
                             ShapeFill="Gray"
                             ShapeStroke="White"
                             ShapeStrokeThickness="2"
                             DataSource="{Binding WorldPopulationDensity}"
                             ShapeDataField="name"
                             PrimaryValuePath="CountryName"
                             ShapeColorValuePath="Density">
    
             <map:MapShapeLayer.ColorMappings>
                 <map:RangeColorMapping Color="#809fff" From="0" To="100" Text="0-100" />
                 <map:RangeColorMapping Color="#3366ff" From="100" To="500" Text="100-500" />
                 <map:RangeColorMapping Color="#0039e6" From="500" To="1000" Text="500-1000" />
                 <map:RangeColorMapping Color="#002db3" From="1000" To="5000" Text="1000-5000" />
                 <map:RangeColorMapping Color="#001a66" From="5000" To="50000" Text="5000-50000" />
             </map:MapShapeLayer.ColorMappings>
    
          </map:MapShapeLayer>
       </map:SfMaps.Layer>
    </map:SfMaps>
    SfMaps maps = new SfMaps();
    MapShapeLayer layer = new MapShapeLayer();
    RangeViewModel rangeViewModel = new RangeViewModel();
    this.BindingContext = new RangeViewModel();
    layer.ShapesSource = MapSource.FromUri(new Uri("https://cdn.syncfusion.com/maps/map-data/world-map.json"));
    layer.ShapeFill = Colors.Gray;
    layer.ShapeStroke = Colors.White;
    layer.ShapeStrokeThickness = 2;
    layer.DataSource = rangeViewModel.WorldPopulationDensity;
    layer.ShapeDataField = "name";
    layer.PrimaryValuePath="CountryName";
    layer.ShapeColorValuePath="Density";
    RangeColorMapping colorMapping1 = new RangeColorMapping();
    colorMapping1.Color = Color.FromRgb(128, 159, 255);
    colorMapping1.From = 0;
    colorMapping1.To = 100;
    colorMapping1.Text = "0-100";
    RangeColorMapping colorMapping2 = new RangeColorMapping();
    colorMapping2.Color = Color.FromRgb(51, 102, 255);
    colorMapping2.From = 100;
    colorMapping2.To = 500;
    colorMapping2.Text = "100-500";
    RangeColorMapping colorMapping3 = new RangeColorMapping();
    colorMapping3.Color = Color.FromRgb(0, 57, 230);
    colorMapping3.From = 500;
    colorMapping3.To = 1000;
    colorMapping3.Text = "500-1000";
    RangeColorMapping colorMapping4 = new RangeColorMapping();
    colorMapping4.Color = Color.FromRgb(0, 45, 179);
    colorMapping4.From = 1000;
    colorMapping4.To = 5000;
    colorMapping4.Text = "1000-5000";
    RangeColorMapping colorMapping5 = new RangeColorMapping();
    colorMapping5.Color = Color.FromRgb(0, 26, 102);
    colorMapping5.From = 5000;
    colorMapping5.To = 50000;
    colorMapping5.Text = "5000-50000";
    layer.ColorMappings.Add(colorMapping1);
    layer.ColorMappings.Add(colorMapping2);
    layer.ColorMappings.Add(colorMapping3);
    layer.ColorMappings.Add(colorMapping4);
    layer.ColorMappings.Add(colorMapping5);
    maps.Layer = layer;
    this.Content = maps;

    To

    Gets or sets the end range for the color mapping.

    Declaration
    public double To { get; set; }
    Property Value
    Type Description
    System.Double

    The end range for the color mapping. The default is 0.

    Examples
    • XAML
    • C#
    <map:SfMaps>
       <map:SfMaps.Layer>
          <map:MapShapeLayer x:Name="layer"
                             ShapesSource="https://cdn.syncfusion.com/maps/map-data/world-map.json"
                             ShapeFill="Gray"
                             ShapeStroke="White"
                             ShapeStrokeThickness="2"
                             DataSource="{Binding WorldPopulationDensity}"
                             ShapeDataField="name"
                             PrimaryValuePath="CountryName"
                             ShapeColorValuePath="Density">
    
             <map:MapShapeLayer.ColorMappings>
                 <map:RangeColorMapping Color="#809fff" From="0" To="100" Text="0-100" />
                 <map:RangeColorMapping Color="#3366ff" From="100" To="500" Text="100-500" />
                 <map:RangeColorMapping Color="#0039e6" From="500" To="1000" Text="500-1000" />
                 <map:RangeColorMapping Color="#002db3" From="1000" To="5000" Text="1000-5000" />
                 <map:RangeColorMapping Color="#001a66" From="5000" To="50000" Text="5000-50000" />
             </map:MapShapeLayer.ColorMappings>
    
          </map:MapShapeLayer>
       </map:SfMaps.Layer>
    </map:SfMaps>
    SfMaps maps = new SfMaps();
    MapShapeLayer layer = new MapShapeLayer();
    RangeViewModel rangeViewModel = new RangeViewModel();
    this.BindingContext = new RangeViewModel();
    layer.ShapesSource = MapSource.FromUri(new Uri("https://cdn.syncfusion.com/maps/map-data/world-map.json"));
    layer.ShapeFill = Colors.Gray;
    layer.ShapeStroke = Colors.White;
    layer.ShapeStrokeThickness = 2;
    layer.DataSource = rangeViewModel.WorldPopulationDensity;
    layer.ShapeDataField = "name";
    layer.PrimaryValuePath="CountryName";
    layer.ShapeColorValuePath="Density";
    RangeColorMapping colorMapping1 = new RangeColorMapping();
    colorMapping1.Color = Color.FromRgb(128, 159, 255);
    colorMapping1.From = 0;
    colorMapping1.To = 100;
    colorMapping1.Text = "0-100";
    RangeColorMapping colorMapping2 = new RangeColorMapping();
    colorMapping2.Color = Color.FromRgb(51, 102, 255);
    colorMapping2.From = 100;
    colorMapping2.To = 500;
    colorMapping2.Text = "100-500";
    RangeColorMapping colorMapping3 = new RangeColorMapping();
    colorMapping3.Color = Color.FromRgb(0, 57, 230);
    colorMapping3.From = 500;
    colorMapping3.To = 1000;
    colorMapping3.Text = "500-1000";
    RangeColorMapping colorMapping4 = new RangeColorMapping();
    colorMapping4.Color = Color.FromRgb(0, 45, 179);
    colorMapping4.From = 1000;
    colorMapping4.To = 5000;
    colorMapping4.Text = "1000-5000";
    RangeColorMapping colorMapping5 = new RangeColorMapping();
    colorMapping5.Color = Color.FromRgb(0, 26, 102);
    colorMapping5.From = 5000;
    colorMapping5.To = 50000;
    colorMapping5.Text = "5000-50000";
    layer.ColorMappings.Add(colorMapping1);
    layer.ColorMappings.Add(colorMapping2);
    layer.ColorMappings.Add(colorMapping3);
    layer.ColorMappings.Add(colorMapping4);
    layer.ColorMappings.Add(colorMapping5);
    maps.Layer = layer;
    this.Content = maps;
    Back to top Generated by DocFX
    Copyright © 2001 - 2025 Syncfusion Inc. All Rights Reserved