Class BubbleMarkerSetting

Represent the BubbleMarkerSettings in the SfMap.

Inheritance

System.Object

BubbleMarkerSetting

Namespace: Syncfusion.UI.Xaml.Maps

Assembly: Syncfusion.SfMaps.WPF.dll

Syntax

public class BubbleMarkerSetting : DependencyObject

Remarks

BubbleMarkerSetting class is used to set setting for the bubbles in the map.This class is used to set MaxSize, MinSize, Fill, Stoke, StokeThickness and the ValuePath for the Bubble.

Examples

using Syncfusion.UI.Xaml.Maps;
using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation;


namespace MapApp
{
    public sealed partial class MainPage : Page
    {
        public MainPage()
        {
            this.InitializeComponent();
            SfMap syncMap = new SfMap();
            ViewModel viewModel = new ViewModel();
            ShapeFileLayer layer = new ShapeFileLayer();
            layer.Uri = "MapApp.world1.shp";
            layer.ItemsSource = viewModel.Models;
            layer.ShapeIDPath = "Country";
            layer.ShapeIDTableField = "NAME";
            BubbleMarkerSetting bubbleSetting = new BubbleMarkerSetting();
            bubbleSetting.AutoFillColor = true;
            bubbleSetting.Fill = new SolidColorBrush(Colors.Red);
            bubbleSetting.ValuePath = "AverageHighTemperature";
            bubbleSetting.Stroke = new SolidColorBrush(Colors.Black);
            bubbleSetting.StrokeThickness = 5;
            bubbleSetting.MaxSize = 500;
            bubbleSetting.MinSize = 100;
            layer.BubbleMarkerSetting = bubbleSetting;
            syncMap.Layers.Add(layer);


        }

    }
    public class Weather
    {

        public int CurrentTemperature { get; set; }
        public int AverageHighTemperature { get; set; }
        public int AverageLowTemperature { get; set; }
        public string Country { get; set; }
        public string Continent { get; set; }
        public string City { get; set; }
        public string WeatherDescription { get; set; }
        public int Humidity { get; set; }
        public string Longitude { get; set; }
        public string Latitude { get; set; }

        public static List<Weather> GetWeatherData()
        {
            List<Weather> weatherCollection = new List<Weather>();
            weatherCollection.Add(new Weather() { Humidity = 86, CurrentTemperature = 44, AverageHighTemperature = 63, AverageLowTemperature = 46, City = "Chicago", Continent = "North America", Country = "United States", WeatherDescription = "Partly Cloudy", Latitude = "41.8500N", Longitude = "87.6500W" });
            weatherCollection.Add(new Weather() { Humidity = 94, CurrentTemperature = 77, AverageHighTemperature = 89, AverageLowTemperature = 75, City = "Chennai", Continent = "Asia", Country = "India", WeatherDescription = "Rainy", Latitude = "12.5810N", Longitude = "76.0740E" });
            weatherCollection.Add(new Weather() { Humidity = 63, CurrentTemperature = 59, AverageHighTemperature = 66, AverageLowTemperature = 45, City = "Beiging", Continent = "Asia", Country = "China", WeatherDescription = "Partly Cloudy", Longitude = "39.9100N", Latitude = "116.4000E" });
            weatherCollection.Add(new Weather() { Humidity = 60, CurrentTemperature = 70, AverageHighTemperature = 70, AverageLowTemperature = 57, City = "Tokyo", Continent = "Asia", Country = "Japan", WeatherDescription = "Partly Cloudy", Latitude = "35.6833N", Longitude = "139.7667E" });
            weatherCollection.Add(new Weather() { Humidity = 72, CurrentTemperature = 55, AverageHighTemperature = 47, AverageLowTemperature = 38, City = "Moscow", Continent = "Asia", Country = "Russia", WeatherDescription = "Clear", Latitude = "55.7517N", Longitude = "37.6178E" });
            weatherCollection.Add(new Weather() { Humidity = 70, CurrentTemperature = 53, AverageHighTemperature = 69, AverageLowTemperature = 54, City = "Cape Town", Continent = "Africa", Country = "South Africa", WeatherDescription = "Partly Cloudy", Latitude = "33.9767S", Longitude = "18.4244E" });
            weatherCollection.Add(new Weather() { Humidity = 77, CurrentTemperature = 64, AverageHighTemperature = 69, AverageLowTemperature = 56, City = "Anchorage", Continent = "North America", Country = "United States", WeatherDescription = "Mostly Cloudy", Latitude = "61.1919N", Longitude = "149.7621W" });
            weatherCollection.Add(new Weather() { Humidity = 55, CurrentTemperature = 91, AverageHighTemperature = 95, AverageLowTemperature = 74, City = "Panama", Continent = "South America", Country = "Republic Of  Panama", WeatherDescription = "Fair", Latitude = "8.7515N", Longitude = "79.8772W" });
            weatherCollection.Add(new Weather() { Humidity = 88, CurrentTemperature = 61, AverageHighTemperature = 76, AverageLowTemperature = 59, City = "Sao Paulo", Continent = "South America", Country = "Brazil", WeatherDescription = "Fair", Latitude = "23.5000S", Longitude = "46.6167W" });
            weatherCollection.Add(new Weather() { Humidity = 83, CurrentTemperature = 70, AverageHighTemperature = 85, AverageLowTemperature = 72, City = "Cairo", Continent = "Africa", Country = "Egypt", WeatherDescription = "Mostly Cloudy", Latitude = "31.2262E", Longitude = "30.0566N" });
            weatherCollection.Add(new Weather() { Humidity = 78, CurrentTemperature = 70, AverageHighTemperature = 85, AverageLowTemperature = 72, City = "Melbourne", Continent = "Oceania", Country = "Australia", WeatherDescription = "Cloudy", Latitude = "35.0833S", Longitude = "142.0667E" });
            return weatherCollection;
        }
    }
    public class ViewModel
    {
        public List<Weather> Models
        {
            get;
            set;
        }

        public ViewModel()
        {

            this.Models = new List<Weather>();
            this.Models = Weather.GetWeatherData();

        }
    }

}

Constructors

BubbleMarkerSetting()

Initializes a new instance of the BubbleMarkerSetting class.

Declaration

public BubbleMarkerSetting()

Remarks

Initialize the object value for the BubbleMarkerSettings and it's property values.

Fields

AutoFillColorProperty

// Using a DependencyProperty as the backing store for AutoFillColor. This enables animation, styling, binding, etc...

Declaration

public static readonly DependencyProperty AutoFillColorProperty

Field Value

Type
System.Windows.DependencyProperty

BubbleTypeProperty

// Using a DependencyProperty as the backing store for BubbleType. This enables animation, styling, binding, etc...

Declaration

public static readonly DependencyProperty BubbleTypeProperty

Field Value

Type
System.Windows.DependencyProperty

ColorMappingsProperty

// Using a DependencyProperty as the backing store for ColorMappings. This enables animation, styling, binding, etc...

Declaration

public static readonly DependencyProperty ColorMappingsProperty

Field Value

Type
System.Windows.DependencyProperty

ColorValuePathProperty

// Using a DependencyProperty as the backing store for ShapeValuePath. This enables animation, styling, binding, etc...

Declaration

public static readonly DependencyProperty ColorValuePathProperty

Field Value

Type
System.Windows.DependencyProperty

CustomTemplateProperty

// Using a DependencyProperty as the backing store for CustomTemplate. This enables animation, styling, binding, etc...

Declaration

public static readonly DependencyProperty CustomTemplateProperty

Field Value

Type
System.Windows.DependencyProperty

FillProperty

// Using a DependencyProperty as the backing store for Fill. This enables animation, styling, binding, etc...

Declaration

public static readonly DependencyProperty FillProperty

Field Value

Type
System.Windows.DependencyProperty

MaxSizeProperty

// Using a DependencyProperty as the backing store for MaxSize. This enables animation, styling, binding, etc...

Declaration

public static readonly DependencyProperty MaxSizeProperty

Field Value

Type
System.Windows.DependencyProperty

MinSizeProperty

// Using a DependencyProperty as the backing store for MinSize. This enables animation, styling, binding, etc...

Declaration

public static readonly DependencyProperty MinSizeProperty

Field Value

Type
System.Windows.DependencyProperty

OpacityProperty

// Using a DependencyProperty as the backing store for BubbleOpacity. This enables animation, styling, binding, etc...

Declaration

public static readonly DependencyProperty OpacityProperty

Field Value

Type
System.Windows.DependencyProperty

SizeRatioProperty

// Using a DependencyProperty as the backing store for ValueRatio. This enables animation, styling, binding, etc...

Declaration

public static readonly DependencyProperty SizeRatioProperty

Field Value

Type
System.Windows.DependencyProperty

StrokeProperty

// Using a DependencyProperty as the backing store for Stroke. This enables animation, styling, binding, etc...

Declaration

public static readonly DependencyProperty StrokeProperty

Field Value

Type
System.Windows.DependencyProperty

StrokeThicknessProperty

// Using a DependencyProperty as the backing store for StrokeThickness. This enables animation, styling, binding, etc...

Declaration

public static readonly DependencyProperty StrokeThicknessProperty

Field Value

Type
System.Windows.DependencyProperty

ToolTipSettingsProperty

Declaration

public static readonly DependencyProperty ToolTipSettingsProperty

Field Value

Type
System.Windows.DependencyProperty

ValuePathProperty

// Using a DependencyProperty as the backing store for ValuePath. This enables animation, styling, binding, etc...

Declaration

public static readonly DependencyProperty ValuePathProperty

Field Value

Type
System.Windows.DependencyProperty

Properties

AutoFillColor

Gets or sets a value indicating whether fill color of bubbles from "Fill" property or "ColorMapping".

Declaration

public bool AutoFillColor { get; set; }

Property Value

Type	Description
System.Boolean	Type :System.Boolean

Remarks

This property is used to determine fill of the bubble. Bubbles fill color will be determined by "Fill" property if "True" or determined by ColorMappings if "False".

Examples

using Syncfusion.UI.Xaml.Maps;
using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation;


namespace MapApp
{
    public sealed partial class MainPage : Page
    {
        public MainPage()
        {
            this.InitializeComponent();
            SfMap syncMap = new SfMap();
            ViewModel viewModel = new ViewModel();
            ShapeFileLayer layer = new ShapeFileLayer();
            layer.Uri = "MapApp.world1.shp";
            layer.ItemsSource = viewModel.Models;
            layer.ShapeIDPath = "Country";
            layer.ShapeIDTableField = "NAME";
            BubbleMarkerSetting bubbleSetting = new BubbleMarkerSetting();
            bubbleSetting.AutoFillColor = true;          
            bubbleSetting.ValuePath = "AverageHighTemperature";
            bubbleSetting.Stroke = new SolidColorBrush(Colors.Black);
            bubbleSetting.StrokeThickness = 5;
            bubbleSetting.MaxSize = 500;
            bubbleSetting.MinSize = 100;
            layer.BubbleMarkerSetting = bubbleSetting;
            syncMap.Layers.Add(layer);


        }       

    }
    public class Weather
    {

        public int CurrentTemperature { get; set; }
        public int AverageHighTemperature { get; set; }
        public int AverageLowTemperature { get; set; }
        public string Country { get; set; }
        public string Continent { get; set; }
        public string City { get; set; }
        public string WeatherDescription { get; set; }
        public int Humidity { get; set; }
        public string Longitude { get; set; }
        public string Latitude { get; set; }

        public static List<Weather> GetWeatherData()
        {
            List<Weather> weatherCollection = new List<Weather>();
            weatherCollection.Add(new Weather() { Humidity = 86, CurrentTemperature = 44, AverageHighTemperature = 63, AverageLowTemperature = 46, City = "Chicago", Continent = "North America", Country = "United States", WeatherDescription = "Partly Cloudy", Latitude = "41.8500N", Longitude = "87.6500W" });
            weatherCollection.Add(new Weather() { Humidity = 94, CurrentTemperature = 77, AverageHighTemperature = 89, AverageLowTemperature = 75, City = "Chennai", Continent = "Asia", Country = "India", WeatherDescription = "Rainy", Latitude = "12.5810N", Longitude = "76.0740E" });
            weatherCollection.Add(new Weather() { Humidity = 63, CurrentTemperature = 59, AverageHighTemperature = 66, AverageLowTemperature = 45, City = "Beiging", Continent = "Asia", Country = "China", WeatherDescription = "Partly Cloudy", Longitude = "39.9100N", Latitude = "116.4000E" });
            weatherCollection.Add(new Weather() { Humidity = 60, CurrentTemperature = 70, AverageHighTemperature = 70, AverageLowTemperature = 57, City = "Tokyo", Continent = "Asia", Country = "Japan", WeatherDescription = "Partly Cloudy", Latitude = "35.6833N", Longitude = "139.7667E" });
            weatherCollection.Add(new Weather() { Humidity = 72, CurrentTemperature = 55, AverageHighTemperature = 47, AverageLowTemperature = 38, City = "Moscow", Continent = "Asia", Country = "Russia", WeatherDescription = "Clear", Latitude = "55.7517N", Longitude = "37.6178E" });
            weatherCollection.Add(new Weather() { Humidity = 70, CurrentTemperature = 53, AverageHighTemperature = 69, AverageLowTemperature = 54, City = "Cape Town", Continent = "Africa", Country = "South Africa", WeatherDescription = "Partly Cloudy", Latitude = "33.9767S", Longitude = "18.4244E" });
            weatherCollection.Add(new Weather() { Humidity = 77, CurrentTemperature = 64, AverageHighTemperature = 69, AverageLowTemperature = 56, City = "Anchorage", Continent = "North America", Country = "United States", WeatherDescription = "Mostly Cloudy", Latitude = "61.1919N", Longitude = "149.7621W" });
            weatherCollection.Add(new Weather() { Humidity = 55, CurrentTemperature = 91, AverageHighTemperature = 95, AverageLowTemperature = 74, City = "Panama", Continent = "South America", Country = "Republic Of  Panama", WeatherDescription = "Fair", Latitude = "8.7515N", Longitude = "79.8772W" });
            weatherCollection.Add(new Weather() { Humidity = 88, CurrentTemperature = 61, AverageHighTemperature = 76, AverageLowTemperature = 59, City = "Sao Paulo", Continent = "South America", Country = "Brazil", WeatherDescription = "Fair", Latitude = "23.5000S", Longitude = "46.6167W" });
            weatherCollection.Add(new Weather() { Humidity = 83, CurrentTemperature = 70, AverageHighTemperature = 85, AverageLowTemperature = 72, City = "Cairo", Continent = "Africa", Country = "Egypt", WeatherDescription = "Mostly Cloudy", Latitude = "31.2262E", Longitude = "30.0566N" });
            weatherCollection.Add(new Weather() { Humidity = 78, CurrentTemperature = 70, AverageHighTemperature = 85, AverageLowTemperature = 72, City = "Melbourne", Continent = "Oceania", Country = "Australia", WeatherDescription = "Cloudy", Latitude = "35.0833S", Longitude = "142.0667E" });
            return weatherCollection;
        }
    }
    public class ViewModel
    {
        public List<Weather> Models
        {
            get;
            set;
        }

        public ViewModel()
        {

            this.Models = new List<Weather>();
            this.Models = Weather.GetWeatherData();

        }
    }

}

BubbleType

Gets or Sets BubbleType

Declaration

public BubbleType BubbleType { get; set; }

Property Value

Type
BubbleType

ColorMappings

Gets or sets the list of RangeColorMapping to provide tree map like support for bubbles.

Declaration

public ObservableCollection<ColorMapping> ColorMappings { get; set; }

Property Value

Type	Description
System.Collections.ObjectModel.ObservableCollection<ColorMapping>	ObservableCollection of RangeColorMapping.

Remarks

This property contain collection of RangeColorMapping which contains Range and the Corresponding color of the Range. This property is used to provide the Tree map like support for bubbles.

Examples

using Syncfusion.UI.Xaml.Maps;
using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation;


namespace MapApp
{
    public sealed partial class MainPage : Page
    {
        public MainPage()
        {
            this.InitializeComponent();
            SfMap syncMap = new SfMap();
            ViewModel viewModel = new ViewModel();
            ShapeFileLayer layer = new ShapeFileLayer();
            layer.Uri = "MapApp.world1.shp";
            layer.ItemsSource = viewModel.Models;
            layer.ShapeIDPath = "Country";
            layer.ShapeIDTableField = "NAME";
            BubbleMarkerSetting bubbleSetting = new BubbleMarkerSetting();
            bubbleSetting.AutoFillColor = false;
            bubbleSetting.ColorMappings.Add(new RangeColorMapping { Range=0, Color=Colors.White });
            bubbleSetting.ColorMappings.Add(new RangeColorMapping { Range = 50, Color = Colors.Thistle });
            bubbleSetting.ColorMappings.Add(new RangeColorMapping { Range = 100, Color = Colors.Violet });
            bubbleSetting.ValuePath = "AverageHighTemperature";
            bubbleSetting.Stroke = new SolidColorBrush(Colors.Black);
            bubbleSetting.StrokeThickness = 5;
            bubbleSetting.MaxSize = 500;
            bubbleSetting.MinSize = 100;
            layer.BubbleMarkerSetting = bubbleSetting;
            syncMap.Layers.Add(layer);


        }       

    }
    public class Weather
    {

        public int CurrentTemperature { get; set; }
        public int AverageHighTemperature { get; set; }
        public int AverageLowTemperature { get; set; }
        public string Country { get; set; }
        public string Continent { get; set; }
        public string City { get; set; }
        public string WeatherDescription { get; set; }
        public int Humidity { get; set; }
        public string Longitude { get; set; }
        public string Latitude { get; set; }

        public static List<Weather> GetWeatherData()
        {
            List<Weather> weatherCollection = new List<Weather>();
            weatherCollection.Add(new Weather() { Humidity = 86, CurrentTemperature = 44, AverageHighTemperature = 63, AverageLowTemperature = 46, City = "Chicago", Continent = "North America", Country = "United States", WeatherDescription = "Partly Cloudy", Latitude = "41.8500N", Longitude = "87.6500W" });
            weatherCollection.Add(new Weather() { Humidity = 94, CurrentTemperature = 77, AverageHighTemperature = 89, AverageLowTemperature = 75, City = "Chennai", Continent = "Asia", Country = "India", WeatherDescription = "Rainy", Latitude = "12.5810N", Longitude = "76.0740E" });
            weatherCollection.Add(new Weather() { Humidity = 63, CurrentTemperature = 59, AverageHighTemperature = 66, AverageLowTemperature = 45, City = "Beiging", Continent = "Asia", Country = "China", WeatherDescription = "Partly Cloudy", Longitude = "39.9100N", Latitude = "116.4000E" });
            weatherCollection.Add(new Weather() { Humidity = 60, CurrentTemperature = 70, AverageHighTemperature = 70, AverageLowTemperature = 57, City = "Tokyo", Continent = "Asia", Country = "Japan", WeatherDescription = "Partly Cloudy", Latitude = "35.6833N", Longitude = "139.7667E" });
            weatherCollection.Add(new Weather() { Humidity = 72, CurrentTemperature = 55, AverageHighTemperature = 47, AverageLowTemperature = 38, City = "Moscow", Continent = "Asia", Country = "Russia", WeatherDescription = "Clear", Latitude = "55.7517N", Longitude = "37.6178E" });
            weatherCollection.Add(new Weather() { Humidity = 70, CurrentTemperature = 53, AverageHighTemperature = 69, AverageLowTemperature = 54, City = "Cape Town", Continent = "Africa", Country = "South Africa", WeatherDescription = "Partly Cloudy", Latitude = "33.9767S", Longitude = "18.4244E" });
            weatherCollection.Add(new Weather() { Humidity = 77, CurrentTemperature = 64, AverageHighTemperature = 69, AverageLowTemperature = 56, City = "Anchorage", Continent = "North America", Country = "United States", WeatherDescription = "Mostly Cloudy", Latitude = "61.1919N", Longitude = "149.7621W" });
            weatherCollection.Add(new Weather() { Humidity = 55, CurrentTemperature = 91, AverageHighTemperature = 95, AverageLowTemperature = 74, City = "Panama", Continent = "South America", Country = "Republic Of  Panama", WeatherDescription = "Fair", Latitude = "8.7515N", Longitude = "79.8772W" });
            weatherCollection.Add(new Weather() { Humidity = 88, CurrentTemperature = 61, AverageHighTemperature = 76, AverageLowTemperature = 59, City = "Sao Paulo", Continent = "South America", Country = "Brazil", WeatherDescription = "Fair", Latitude = "23.5000S", Longitude = "46.6167W" });
            weatherCollection.Add(new Weather() { Humidity = 83, CurrentTemperature = 70, AverageHighTemperature = 85, AverageLowTemperature = 72, City = "Cairo", Continent = "Africa", Country = "Egypt", WeatherDescription = "Mostly Cloudy", Latitude = "31.2262E", Longitude = "30.0566N" });
            weatherCollection.Add(new Weather() { Humidity = 78, CurrentTemperature = 70, AverageHighTemperature = 85, AverageLowTemperature = 72, City = "Melbourne", Continent = "Oceania", Country = "Australia", WeatherDescription = "Cloudy", Latitude = "35.0833S", Longitude = "142.0667E" });
            return weatherCollection;
        }
    }
    public class ViewModel
    {
        public List<Weather> Models
        {
            get;
            set;
        }

        public ViewModel()
        {

            this.Models = new List<Weather>();
            this.Models = Weather.GetWeatherData();

        }
    }

}

ColorValuePath

ColorValuePath

Declaration

public string ColorValuePath { get; set; }

Property Value

Type
System.String

CustomTemplate

Gets or Sets CustomTemplate for Bubble

Declaration

public DataTemplate CustomTemplate { get; set; }

Property Value

Type
System.Windows.DataTemplate

Fill

Gets or sets the fill color of the bubbles when "AutoFillColor" of the BubbleMarkerSetting is True.

Declaration

public Brush Fill { get; set; }

Property Value

Type
System.Windows.Media.Brush

Remarks

Use this property to set the fill color for the bubble when need not Tree map like support to the bubble fill. "AutoFillColor" of the BubbleMarkerSetting must set as true.

Examples

using Syncfusion.UI.Xaml.Maps;
using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation;


namespace MapApp
{
    public sealed partial class MainPage : Page
    {
        public MainPage()
        {
            this.InitializeComponent();
            SfMap syncMap = new SfMap();
            ViewModel viewModel = new ViewModel();
            ShapeFileLayer layer = new ShapeFileLayer();
            layer.Uri = "MapApp.world1.shp";
            layer.ItemsSource = viewModel.Models;
            layer.ShapeIDPath = "Country";
            layer.ShapeIDTableField = "NAME";
            BubbleMarkerSetting bubbleSetting = new BubbleMarkerSetting();
            bubbleSetting.AutoFillColor = true;          
            bubbleSetting.ValuePath = "AverageHighTemperature";
            bubbleSetting.Stroke = new SolidColorBrush(Colors.Black);
            bubbleSetting.StrokeThickness = 5;
            bubbleSetting.MaxSize = 500;
            bubbleSetting.MinSize = 100;
            layer.BubbleMarkerSetting = bubbleSetting;
            syncMap.Layers.Add(layer);


        }       

    }
    public class Weather
    {

        public int CurrentTemperature { get; set; }
        public int AverageHighTemperature { get; set; }
        public int AverageLowTemperature { get; set; }
        public string Country { get; set; }
        public string Continent { get; set; }
        public string City { get; set; }
        public string WeatherDescription { get; set; }
        public int Humidity { get; set; }
        public string Longitude { get; set; }
        public string Latitude { get; set; }

        public static List<Weather> GetWeatherData()
        {
            List<Weather> weatherCollection = new List<Weather>();
            weatherCollection.Add(new Weather() { Humidity = 86, CurrentTemperature = 44, AverageHighTemperature = 63, AverageLowTemperature = 46, City = "Chicago", Continent = "North America", Country = "United States", WeatherDescription = "Partly Cloudy", Latitude = "41.8500N", Longitude = "87.6500W" });
            weatherCollection.Add(new Weather() { Humidity = 94, CurrentTemperature = 77, AverageHighTemperature = 89, AverageLowTemperature = 75, City = "Chennai", Continent = "Asia", Country = "India", WeatherDescription = "Rainy", Latitude = "12.5810N", Longitude = "76.0740E" });
            weatherCollection.Add(new Weather() { Humidity = 63, CurrentTemperature = 59, AverageHighTemperature = 66, AverageLowTemperature = 45, City = "Beiging", Continent = "Asia", Country = "China", WeatherDescription = "Partly Cloudy", Longitude = "39.9100N", Latitude = "116.4000E" });
            weatherCollection.Add(new Weather() { Humidity = 60, CurrentTemperature = 70, AverageHighTemperature = 70, AverageLowTemperature = 57, City = "Tokyo", Continent = "Asia", Country = "Japan", WeatherDescription = "Partly Cloudy", Latitude = "35.6833N", Longitude = "139.7667E" });
            weatherCollection.Add(new Weather() { Humidity = 72, CurrentTemperature = 55, AverageHighTemperature = 47, AverageLowTemperature = 38, City = "Moscow", Continent = "Asia", Country = "Russia", WeatherDescription = "Clear", Latitude = "55.7517N", Longitude = "37.6178E" });
            weatherCollection.Add(new Weather() { Humidity = 70, CurrentTemperature = 53, AverageHighTemperature = 69, AverageLowTemperature = 54, City = "Cape Town", Continent = "Africa", Country = "South Africa", WeatherDescription = "Partly Cloudy", Latitude = "33.9767S", Longitude = "18.4244E" });
            weatherCollection.Add(new Weather() { Humidity = 77, CurrentTemperature = 64, AverageHighTemperature = 69, AverageLowTemperature = 56, City = "Anchorage", Continent = "North America", Country = "United States", WeatherDescription = "Mostly Cloudy", Latitude = "61.1919N", Longitude = "149.7621W" });
            weatherCollection.Add(new Weather() { Humidity = 55, CurrentTemperature = 91, AverageHighTemperature = 95, AverageLowTemperature = 74, City = "Panama", Continent = "South America", Country = "Republic Of  Panama", WeatherDescription = "Fair", Latitude = "8.7515N", Longitude = "79.8772W" });
            weatherCollection.Add(new Weather() { Humidity = 88, CurrentTemperature = 61, AverageHighTemperature = 76, AverageLowTemperature = 59, City = "Sao Paulo", Continent = "South America", Country = "Brazil", WeatherDescription = "Fair", Latitude = "23.5000S", Longitude = "46.6167W" });
            weatherCollection.Add(new Weather() { Humidity = 83, CurrentTemperature = 70, AverageHighTemperature = 85, AverageLowTemperature = 72, City = "Cairo", Continent = "Africa", Country = "Egypt", WeatherDescription = "Mostly Cloudy", Latitude = "31.2262E", Longitude = "30.0566N" });
            weatherCollection.Add(new Weather() { Humidity = 78, CurrentTemperature = 70, AverageHighTemperature = 85, AverageLowTemperature = 72, City = "Melbourne", Continent = "Oceania", Country = "Australia", WeatherDescription = "Cloudy", Latitude = "35.0833S", Longitude = "142.0667E" });
            return weatherCollection;
        }
    }
    public class ViewModel
    {
        public List<Weather> Models
        {
            get;
            set;
        }

        public ViewModel()
        {

            this.Models = new List<Weather>();
            this.Models = Weather.GetWeatherData();

        }
    }

}

MaxSize

Gets or sets the Maximum size of the bubble in the map.

Declaration

public double MaxSize { get; set; }

Property Value

Type
System.Double

Remarks

MaxSize property set the Maximum height and width for the bubble which a bubble has maximum "BubbleValue" in the map.

Examples

using Syncfusion.UI.Xaml.Maps;
using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation;


namespace MapApp
{
    public sealed partial class MainPage : Page
    {
        public MainPage()
        {
            this.InitializeComponent();
            SfMap syncMap = new SfMap();
            ViewModel viewModel = new ViewModel();
            ShapeFileLayer layer = new ShapeFileLayer();
            layer.Uri = "MapApp.world1.shp";
            layer.ItemsSource = viewModel.Models;
            layer.ShapeIDPath = "Country";
            layer.ShapeIDTableField = "NAME";
            BubbleMarkerSetting bubbleSetting = new BubbleMarkerSetting();
            bubbleSetting.AutoFillColor = true;          
            bubbleSetting.ValuePath = "AverageHighTemperature";
            bubbleSetting.Stroke = new SolidColorBrush(Colors.Black);
            bubbleSetting.StrokeThickness = 5;
            bubbleSetting.MaxSize = 500;
            bubbleSetting.MinSize = 100;
            layer.BubbleMarkerSetting = bubbleSetting;
            syncMap.Layers.Add(layer);


        }       

    }
    public class Weather
    {

        public int CurrentTemperature { get; set; }
        public int AverageHighTemperature { get; set; }
        public int AverageLowTemperature { get; set; }
        public string Country { get; set; }
        public string Continent { get; set; }
        public string City { get; set; }
        public string WeatherDescription { get; set; }
        public int Humidity { get; set; }
        public string Longitude { get; set; }
        public string Latitude { get; set; }

        public static List<Weather> GetWeatherData()
        {
            List<Weather> weatherCollection = new List<Weather>();
            weatherCollection.Add(new Weather() { Humidity = 86, CurrentTemperature = 44, AverageHighTemperature = 63, AverageLowTemperature = 46, City = "Chicago", Continent = "North America", Country = "United States", WeatherDescription = "Partly Cloudy", Latitude = "41.8500N", Longitude = "87.6500W" });
            weatherCollection.Add(new Weather() { Humidity = 94, CurrentTemperature = 77, AverageHighTemperature = 89, AverageLowTemperature = 75, City = "Chennai", Continent = "Asia", Country = "India", WeatherDescription = "Rainy", Latitude = "12.5810N", Longitude = "76.0740E" });
            weatherCollection.Add(new Weather() { Humidity = 63, CurrentTemperature = 59, AverageHighTemperature = 66, AverageLowTemperature = 45, City = "Beiging", Continent = "Asia", Country = "China", WeatherDescription = "Partly Cloudy", Longitude = "39.9100N", Latitude = "116.4000E" });
            weatherCollection.Add(new Weather() { Humidity = 60, CurrentTemperature = 70, AverageHighTemperature = 70, AverageLowTemperature = 57, City = "Tokyo", Continent = "Asia", Country = "Japan", WeatherDescription = "Partly Cloudy", Latitude = "35.6833N", Longitude = "139.7667E" });
            weatherCollection.Add(new Weather() { Humidity = 72, CurrentTemperature = 55, AverageHighTemperature = 47, AverageLowTemperature = 38, City = "Moscow", Continent = "Asia", Country = "Russia", WeatherDescription = "Clear", Latitude = "55.7517N", Longitude = "37.6178E" });
            weatherCollection.Add(new Weather() { Humidity = 70, CurrentTemperature = 53, AverageHighTemperature = 69, AverageLowTemperature = 54, City = "Cape Town", Continent = "Africa", Country = "South Africa", WeatherDescription = "Partly Cloudy", Latitude = "33.9767S", Longitude = "18.4244E" });
            weatherCollection.Add(new Weather() { Humidity = 77, CurrentTemperature = 64, AverageHighTemperature = 69, AverageLowTemperature = 56, City = "Anchorage", Continent = "North America", Country = "United States", WeatherDescription = "Mostly Cloudy", Latitude = "61.1919N", Longitude = "149.7621W" });
            weatherCollection.Add(new Weather() { Humidity = 55, CurrentTemperature = 91, AverageHighTemperature = 95, AverageLowTemperature = 74, City = "Panama", Continent = "South America", Country = "Republic Of  Panama", WeatherDescription = "Fair", Latitude = "8.7515N", Longitude = "79.8772W" });
            weatherCollection.Add(new Weather() { Humidity = 88, CurrentTemperature = 61, AverageHighTemperature = 76, AverageLowTemperature = 59, City = "Sao Paulo", Continent = "South America", Country = "Brazil", WeatherDescription = "Fair", Latitude = "23.5000S", Longitude = "46.6167W" });
            weatherCollection.Add(new Weather() { Humidity = 83, CurrentTemperature = 70, AverageHighTemperature = 85, AverageLowTemperature = 72, City = "Cairo", Continent = "Africa", Country = "Egypt", WeatherDescription = "Mostly Cloudy", Latitude = "31.2262E", Longitude = "30.0566N" });
            weatherCollection.Add(new Weather() { Humidity = 78, CurrentTemperature = 70, AverageHighTemperature = 85, AverageLowTemperature = 72, City = "Melbourne", Continent = "Oceania", Country = "Australia", WeatherDescription = "Cloudy", Latitude = "35.0833S", Longitude = "142.0667E" });
            return weatherCollection;
        }
    }
    public class ViewModel
    {
        public List<Weather> Models
        {
            get;
            set;
        }

        public ViewModel()
        {

            this.Models = new List<Weather>();
            this.Models = Weather.GetWeatherData();

        }
    }

}

MinSize

Gets or sets the Minimum size of the bubble in the map.

Declaration

public double MinSize { get; set; }

Property Value

Type
System.Double

Remarks

MaxSize property set the Minimum height and width for the bubble which a bubble has minimum "BubbleValue" in the map.

Examples

using Syncfusion.UI.Xaml.Maps;
using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation;


namespace MapApp
{
    public sealed partial class MainPage : Page
    {
        public MainPage()
        {
            this.InitializeComponent();
            SfMap syncMap = new SfMap();
            ViewModel viewModel = new ViewModel();
            ShapeFileLayer layer = new ShapeFileLayer();
            layer.Uri = "MapApp.world1.shp";
            layer.ItemsSource = viewModel.Models;
            layer.ShapeIDPath = "Country";
            layer.ShapeIDTableField = "NAME";
            BubbleMarkerSetting bubbleSetting = new BubbleMarkerSetting();
            bubbleSetting.AutoFillColor = true;          
            bubbleSetting.ValuePath = "AverageHighTemperature";
            bubbleSetting.Stroke = new SolidColorBrush(Colors.Black);
            bubbleSetting.StrokeThickness = 5;
            bubbleSetting.MaxSize = 500;
            bubbleSetting.MinSize = 100;
            layer.BubbleMarkerSetting = bubbleSetting;
            syncMap.Layers.Add(layer);


        }       

    }
    public class Weather
    {

        public int CurrentTemperature { get; set; }
        public int AverageHighTemperature { get; set; }
        public int AverageLowTemperature { get; set; }
        public string Country { get; set; }
        public string Continent { get; set; }
        public string City { get; set; }
        public string WeatherDescription { get; set; }
        public int Humidity { get; set; }
        public string Longitude { get; set; }
        public string Latitude { get; set; }

        public static List<Weather> GetWeatherData()
        {
            List<Weather> weatherCollection = new List<Weather>();
            weatherCollection.Add(new Weather() { Humidity = 86, CurrentTemperature = 44, AverageHighTemperature = 63, AverageLowTemperature = 46, City = "Chicago", Continent = "North America", Country = "United States", WeatherDescription = "Partly Cloudy", Latitude = "41.8500N", Longitude = "87.6500W" });
            weatherCollection.Add(new Weather() { Humidity = 94, CurrentTemperature = 77, AverageHighTemperature = 89, AverageLowTemperature = 75, City = "Chennai", Continent = "Asia", Country = "India", WeatherDescription = "Rainy", Latitude = "12.5810N", Longitude = "76.0740E" });
            weatherCollection.Add(new Weather() { Humidity = 63, CurrentTemperature = 59, AverageHighTemperature = 66, AverageLowTemperature = 45, City = "Beiging", Continent = "Asia", Country = "China", WeatherDescription = "Partly Cloudy", Longitude = "39.9100N", Latitude = "116.4000E" });
            weatherCollection.Add(new Weather() { Humidity = 60, CurrentTemperature = 70, AverageHighTemperature = 70, AverageLowTemperature = 57, City = "Tokyo", Continent = "Asia", Country = "Japan", WeatherDescription = "Partly Cloudy", Latitude = "35.6833N", Longitude = "139.7667E" });
            weatherCollection.Add(new Weather() { Humidity = 72, CurrentTemperature = 55, AverageHighTemperature = 47, AverageLowTemperature = 38, City = "Moscow", Continent = "Asia", Country = "Russia", WeatherDescription = "Clear", Latitude = "55.7517N", Longitude = "37.6178E" });
            weatherCollection.Add(new Weather() { Humidity = 70, CurrentTemperature = 53, AverageHighTemperature = 69, AverageLowTemperature = 54, City = "Cape Town", Continent = "Africa", Country = "South Africa", WeatherDescription = "Partly Cloudy", Latitude = "33.9767S", Longitude = "18.4244E" });
            weatherCollection.Add(new Weather() { Humidity = 77, CurrentTemperature = 64, AverageHighTemperature = 69, AverageLowTemperature = 56, City = "Anchorage", Continent = "North America", Country = "United States", WeatherDescription = "Mostly Cloudy", Latitude = "61.1919N", Longitude = "149.7621W" });
            weatherCollection.Add(new Weather() { Humidity = 55, CurrentTemperature = 91, AverageHighTemperature = 95, AverageLowTemperature = 74, City = "Panama", Continent = "South America", Country = "Republic Of  Panama", WeatherDescription = "Fair", Latitude = "8.7515N", Longitude = "79.8772W" });
            weatherCollection.Add(new Weather() { Humidity = 88, CurrentTemperature = 61, AverageHighTemperature = 76, AverageLowTemperature = 59, City = "Sao Paulo", Continent = "South America", Country = "Brazil", WeatherDescription = "Fair", Latitude = "23.5000S", Longitude = "46.6167W" });
            weatherCollection.Add(new Weather() { Humidity = 83, CurrentTemperature = 70, AverageHighTemperature = 85, AverageLowTemperature = 72, City = "Cairo", Continent = "Africa", Country = "Egypt", WeatherDescription = "Mostly Cloudy", Latitude = "31.2262E", Longitude = "30.0566N" });
            weatherCollection.Add(new Weather() { Humidity = 78, CurrentTemperature = 70, AverageHighTemperature = 85, AverageLowTemperature = 72, City = "Melbourne", Continent = "Oceania", Country = "Australia", WeatherDescription = "Cloudy", Latitude = "35.0833S", Longitude = "142.0667E" });
            return weatherCollection;
        }
    }
    public class ViewModel
    {
        public List<Weather> Models
        {
            get;
            set;
        }

        public ViewModel()
        {

            this.Models = new List<Weather>();
            this.Models = Weather.GetWeatherData();

        }
    }

}

Opacity

Gets or Sets Opacity of Bubble

Declaration

public double Opacity { get; set; }

Property Value

Type
System.Double

SizeRatio

Gets the Size ratio for the bubbles based on the MinSize and MaxSize

Declaration

public double SizeRatio { get; }

Property Value

Type
System.Double

Remarks

This read only property get the ratio for the bubbles size. Ratio will be determined based on MinSize and MaxSize of the BubbleMarkerSetting.

Stroke

Gets or set the border color of the bubbles.

Declaration

public Brush Stroke { get; set; }

Property Value

Type	Description
System.Windows.Media.Brush	Type :System.Windows.Media.Brush

Remarks

Use this property to set the border color of the bubbles in the map.

Examples

using Syncfusion.UI.Xaml.Maps;
using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation;


namespace MapApp
{
    public sealed partial class MainPage : Page
    {
        public MainPage()
        {
            this.InitializeComponent();
            SfMap syncMap = new SfMap();
            ViewModel viewModel = new ViewModel();
            ShapeFileLayer layer = new ShapeFileLayer();
            layer.Uri = "MapApp.world1.shp";
            layer.ItemsSource = viewModel.Models;
            layer.ShapeIDPath = "Country";
            layer.ShapeIDTableField = "NAME";
            BubbleMarkerSetting bubbleSetting = new BubbleMarkerSetting();
            bubbleSetting.AutoFillColor = true;          
            bubbleSetting.ValuePath = "AverageHighTemperature";
            bubbleSetting.Stroke = new SolidColorBrush(Colors.Black);
            bubbleSetting.StrokeThickness = 5;
            bubbleSetting.MaxSize = 500;
            bubbleSetting.MinSize = 100;
            layer.BubbleMarkerSetting = bubbleSetting;
            syncMap.Layers.Add(layer);


        }       

    }
    public class Weather
    {

        public int CurrentTemperature { get; set; }
        public int AverageHighTemperature { get; set; }
        public int AverageLowTemperature { get; set; }
        public string Country { get; set; }
        public string Continent { get; set; }
        public string City { get; set; }
        public string WeatherDescription { get; set; }
        public int Humidity { get; set; }
        public string Longitude { get; set; }
        public string Latitude { get; set; }

        public static List<Weather> GetWeatherData()
        {
            List<Weather> weatherCollection = new List<Weather>();
            weatherCollection.Add(new Weather() { Humidity = 86, CurrentTemperature = 44, AverageHighTemperature = 63, AverageLowTemperature = 46, City = "Chicago", Continent = "North America", Country = "United States", WeatherDescription = "Partly Cloudy", Latitude = "41.8500N", Longitude = "87.6500W" });
            weatherCollection.Add(new Weather() { Humidity = 94, CurrentTemperature = 77, AverageHighTemperature = 89, AverageLowTemperature = 75, City = "Chennai", Continent = "Asia", Country = "India", WeatherDescription = "Rainy", Latitude = "12.5810N", Longitude = "76.0740E" });
            weatherCollection.Add(new Weather() { Humidity = 63, CurrentTemperature = 59, AverageHighTemperature = 66, AverageLowTemperature = 45, City = "Beiging", Continent = "Asia", Country = "China", WeatherDescription = "Partly Cloudy", Longitude = "39.9100N", Latitude = "116.4000E" });
            weatherCollection.Add(new Weather() { Humidity = 60, CurrentTemperature = 70, AverageHighTemperature = 70, AverageLowTemperature = 57, City = "Tokyo", Continent = "Asia", Country = "Japan", WeatherDescription = "Partly Cloudy", Latitude = "35.6833N", Longitude = "139.7667E" });
            weatherCollection.Add(new Weather() { Humidity = 72, CurrentTemperature = 55, AverageHighTemperature = 47, AverageLowTemperature = 38, City = "Moscow", Continent = "Asia", Country = "Russia", WeatherDescription = "Clear", Latitude = "55.7517N", Longitude = "37.6178E" });
            weatherCollection.Add(new Weather() { Humidity = 70, CurrentTemperature = 53, AverageHighTemperature = 69, AverageLowTemperature = 54, City = "Cape Town", Continent = "Africa", Country = "South Africa", WeatherDescription = "Partly Cloudy", Latitude = "33.9767S", Longitude = "18.4244E" });
            weatherCollection.Add(new Weather() { Humidity = 77, CurrentTemperature = 64, AverageHighTemperature = 69, AverageLowTemperature = 56, City = "Anchorage", Continent = "North America", Country = "United States", WeatherDescription = "Mostly Cloudy", Latitude = "61.1919N", Longitude = "149.7621W" });
            weatherCollection.Add(new Weather() { Humidity = 55, CurrentTemperature = 91, AverageHighTemperature = 95, AverageLowTemperature = 74, City = "Panama", Continent = "South America", Country = "Republic Of  Panama", WeatherDescription = "Fair", Latitude = "8.7515N", Longitude = "79.8772W" });
            weatherCollection.Add(new Weather() { Humidity = 88, CurrentTemperature = 61, AverageHighTemperature = 76, AverageLowTemperature = 59, City = "Sao Paulo", Continent = "South America", Country = "Brazil", WeatherDescription = "Fair", Latitude = "23.5000S", Longitude = "46.6167W" });
            weatherCollection.Add(new Weather() { Humidity = 83, CurrentTemperature = 70, AverageHighTemperature = 85, AverageLowTemperature = 72, City = "Cairo", Continent = "Africa", Country = "Egypt", WeatherDescription = "Mostly Cloudy", Latitude = "31.2262E", Longitude = "30.0566N" });
            weatherCollection.Add(new Weather() { Humidity = 78, CurrentTemperature = 70, AverageHighTemperature = 85, AverageLowTemperature = 72, City = "Melbourne", Continent = "Oceania", Country = "Australia", WeatherDescription = "Cloudy", Latitude = "35.0833S", Longitude = "142.0667E" });
            return weatherCollection;
        }
    }
    public class ViewModel
    {
        public List<Weather> Models
        {
            get;
            set;
        }

        public ViewModel()
        {

            this.Models = new List<Weather>();
            this.Models = Weather.GetWeatherData();

        }
    }

}

StrokeThickness

Gets or set the border thickness of the bubbles.

Declaration

public double StrokeThickness { get; set; }

Property Value

Type	Description
System.Double	Type :System.Double

Remarks

Use this property to set the border thickness of the bubbles in the map.

Examples

using Syncfusion.UI.Xaml.Maps;
using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation;


namespace MapApp
{
    public sealed partial class MainPage : Page
    {
        public MainPage()
        {
            this.InitializeComponent();
            SfMap syncMap = new SfMap();
            ViewModel viewModel = new ViewModel();
            ShapeFileLayer layer = new ShapeFileLayer();
            layer.Uri = "MapApp.world1.shp";
            layer.ItemsSource = viewModel.Models;
            layer.ShapeIDPath = "Country";
            layer.ShapeIDTableField = "NAME";
            BubbleMarkerSetting bubbleSetting = new BubbleMarkerSetting();
            bubbleSetting.AutoFillColor = true;          
            bubbleSetting.ValuePath = "AverageHighTemperature";
            bubbleSetting.Stroke = new SolidColorBrush(Colors.Black);
            bubbleSetting.StrokeThickness = 5;
            bubbleSetting.MaxSize = 500;
            bubbleSetting.MinSize = 100;
            layer.BubbleMarkerSetting = bubbleSetting;
            syncMap.Layers.Add(layer);


        }       

    }
    public class Weather
    {

        public int CurrentTemperature { get; set; }
        public int AverageHighTemperature { get; set; }
        public int AverageLowTemperature { get; set; }
        public string Country { get; set; }
        public string Continent { get; set; }
        public string City { get; set; }
        public string WeatherDescription { get; set; }
        public int Humidity { get; set; }
        public string Longitude { get; set; }
        public string Latitude { get; set; }

        public static List<Weather> GetWeatherData()
        {
            List<Weather> weatherCollection = new List<Weather>();
            weatherCollection.Add(new Weather() { Humidity = 86, CurrentTemperature = 44, AverageHighTemperature = 63, AverageLowTemperature = 46, City = "Chicago", Continent = "North America", Country = "United States", WeatherDescription = "Partly Cloudy", Latitude = "41.8500N", Longitude = "87.6500W" });
            weatherCollection.Add(new Weather() { Humidity = 94, CurrentTemperature = 77, AverageHighTemperature = 89, AverageLowTemperature = 75, City = "Chennai", Continent = "Asia", Country = "India", WeatherDescription = "Rainy", Latitude = "12.5810N", Longitude = "76.0740E" });
            weatherCollection.Add(new Weather() { Humidity = 63, CurrentTemperature = 59, AverageHighTemperature = 66, AverageLowTemperature = 45, City = "Beiging", Continent = "Asia", Country = "China", WeatherDescription = "Partly Cloudy", Longitude = "39.9100N", Latitude = "116.4000E" });
            weatherCollection.Add(new Weather() { Humidity = 60, CurrentTemperature = 70, AverageHighTemperature = 70, AverageLowTemperature = 57, City = "Tokyo", Continent = "Asia", Country = "Japan", WeatherDescription = "Partly Cloudy", Latitude = "35.6833N", Longitude = "139.7667E" });
            weatherCollection.Add(new Weather() { Humidity = 72, CurrentTemperature = 55, AverageHighTemperature = 47, AverageLowTemperature = 38, City = "Moscow", Continent = "Asia", Country = "Russia", WeatherDescription = "Clear", Latitude = "55.7517N", Longitude = "37.6178E" });
            weatherCollection.Add(new Weather() { Humidity = 70, CurrentTemperature = 53, AverageHighTemperature = 69, AverageLowTemperature = 54, City = "Cape Town", Continent = "Africa", Country = "South Africa", WeatherDescription = "Partly Cloudy", Latitude = "33.9767S", Longitude = "18.4244E" });
            weatherCollection.Add(new Weather() { Humidity = 77, CurrentTemperature = 64, AverageHighTemperature = 69, AverageLowTemperature = 56, City = "Anchorage", Continent = "North America", Country = "United States", WeatherDescription = "Mostly Cloudy", Latitude = "61.1919N", Longitude = "149.7621W" });
            weatherCollection.Add(new Weather() { Humidity = 55, CurrentTemperature = 91, AverageHighTemperature = 95, AverageLowTemperature = 74, City = "Panama", Continent = "South America", Country = "Republic Of  Panama", WeatherDescription = "Fair", Latitude = "8.7515N", Longitude = "79.8772W" });
            weatherCollection.Add(new Weather() { Humidity = 88, CurrentTemperature = 61, AverageHighTemperature = 76, AverageLowTemperature = 59, City = "Sao Paulo", Continent = "South America", Country = "Brazil", WeatherDescription = "Fair", Latitude = "23.5000S", Longitude = "46.6167W" });
            weatherCollection.Add(new Weather() { Humidity = 83, CurrentTemperature = 70, AverageHighTemperature = 85, AverageLowTemperature = 72, City = "Cairo", Continent = "Africa", Country = "Egypt", WeatherDescription = "Mostly Cloudy", Latitude = "31.2262E", Longitude = "30.0566N" });
            weatherCollection.Add(new Weather() { Humidity = 78, CurrentTemperature = 70, AverageHighTemperature = 85, AverageLowTemperature = 72, City = "Melbourne", Continent = "Oceania", Country = "Australia", WeatherDescription = "Cloudy", Latitude = "35.0833S", Longitude = "142.0667E" });
            return weatherCollection;
        }
    }
    public class ViewModel
    {
        public List<Weather> Models
        {
            get;
            set;
        }

        public ViewModel()
        {

            this.Models = new List<Weather>();
            this.Models = Weather.GetWeatherData();

        }
    }

}

ToolTipSettings

Gets or sets the tooltip settings for Bubbles.

Declaration

public ToolTipSetting ToolTipSettings { get; set; }

Property Value

Type
ToolTipSetting

ValuePath

Gets or sets the property name from the Item of ItemsSource in ShapeFileLayer for bubble value.

Declaration

public string ValuePath { get; set; }

Property Value

Type	Description
System.String	Type :System.String

Remarks

Use this ValuePath to determine the under bound value for the bubbles. The property value with the name of "ValuePath" will be fetched from Item of ItemsSource in ShapeFileLayer.

Examples

using Syncfusion.UI.Xaml.Maps;
using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation;


namespace MapApp
{
    public sealed partial class MainPage : Page
    {
        public MainPage()
        {
            this.InitializeComponent();
            SfMap syncMap = new SfMap();
            ViewModel viewModel = new ViewModel();
            ShapeFileLayer layer = new ShapeFileLayer();
            layer.Uri = "MapApp.world1.shp";
            layer.ItemsSource = viewModel.Models;
            layer.ShapeIDPath = "Country";
            layer.ShapeIDTableField = "NAME";
            BubbleMarkerSetting bubbleSetting = new BubbleMarkerSetting();
            bubbleSetting.AutoFillColor = true;          
            bubbleSetting.ValuePath = "AverageHighTemperature";
            bubbleSetting.Stroke = new SolidColorBrush(Colors.Black);
            bubbleSetting.StrokeThickness = 5;
            bubbleSetting.MaxSize = 500;
            bubbleSetting.MinSize = 100;
            layer.BubbleMarkerSetting = bubbleSetting;
            syncMap.Layers.Add(layer);


        }       

    }
    public class Weather
    {

        public int CurrentTemperature { get; set; }
        public int AverageHighTemperature { get; set; }
        public int AverageLowTemperature { get; set; }
        public string Country { get; set; }
        public string Continent { get; set; }
        public string City { get; set; }
        public string WeatherDescription { get; set; }
        public int Humidity { get; set; }
        public string Longitude { get; set; }
        public string Latitude { get; set; }

        public static List<Weather> GetWeatherData()
        {
            List<Weather> weatherCollection = new List<Weather>();
            weatherCollection.Add(new Weather() { Humidity = 86, CurrentTemperature = 44, AverageHighTemperature = 63, AverageLowTemperature = 46, City = "Chicago", Continent = "North America", Country = "United States", WeatherDescription = "Partly Cloudy", Latitude = "41.8500N", Longitude = "87.6500W" });
            weatherCollection.Add(new Weather() { Humidity = 94, CurrentTemperature = 77, AverageHighTemperature = 89, AverageLowTemperature = 75, City = "Chennai", Continent = "Asia", Country = "India", WeatherDescription = "Rainy", Latitude = "12.5810N", Longitude = "76.0740E" });
            weatherCollection.Add(new Weather() { Humidity = 63, CurrentTemperature = 59, AverageHighTemperature = 66, AverageLowTemperature = 45, City = "Beiging", Continent = "Asia", Country = "China", WeatherDescription = "Partly Cloudy", Longitude = "39.9100N", Latitude = "116.4000E" });
            weatherCollection.Add(new Weather() { Humidity = 60, CurrentTemperature = 70, AverageHighTemperature = 70, AverageLowTemperature = 57, City = "Tokyo", Continent = "Asia", Country = "Japan", WeatherDescription = "Partly Cloudy", Latitude = "35.6833N", Longitude = "139.7667E" });
            weatherCollection.Add(new Weather() { Humidity = 72, CurrentTemperature = 55, AverageHighTemperature = 47, AverageLowTemperature = 38, City = "Moscow", Continent = "Asia", Country = "Russia", WeatherDescription = "Clear", Latitude = "55.7517N", Longitude = "37.6178E" });
            weatherCollection.Add(new Weather() { Humidity = 70, CurrentTemperature = 53, AverageHighTemperature = 69, AverageLowTemperature = 54, City = "Cape Town", Continent = "Africa", Country = "South Africa", WeatherDescription = "Partly Cloudy", Latitude = "33.9767S", Longitude = "18.4244E" });
            weatherCollection.Add(new Weather() { Humidity = 77, CurrentTemperature = 64, AverageHighTemperature = 69, AverageLowTemperature = 56, City = "Anchorage", Continent = "North America", Country = "United States", WeatherDescription = "Mostly Cloudy", Latitude = "61.1919N", Longitude = "149.7621W" });
            weatherCollection.Add(new Weather() { Humidity = 55, CurrentTemperature = 91, AverageHighTemperature = 95, AverageLowTemperature = 74, City = "Panama", Continent = "South America", Country = "Republic Of  Panama", WeatherDescription = "Fair", Latitude = "8.7515N", Longitude = "79.8772W" });
            weatherCollection.Add(new Weather() { Humidity = 88, CurrentTemperature = 61, AverageHighTemperature = 76, AverageLowTemperature = 59, City = "Sao Paulo", Continent = "South America", Country = "Brazil", WeatherDescription = "Fair", Latitude = "23.5000S", Longitude = "46.6167W" });
            weatherCollection.Add(new Weather() { Humidity = 83, CurrentTemperature = 70, AverageHighTemperature = 85, AverageLowTemperature = 72, City = "Cairo", Continent = "Africa", Country = "Egypt", WeatherDescription = "Mostly Cloudy", Latitude = "31.2262E", Longitude = "30.0566N" });
            weatherCollection.Add(new Weather() { Humidity = 78, CurrentTemperature = 70, AverageHighTemperature = 85, AverageLowTemperature = 72, City = "Melbourne", Continent = "Oceania", Country = "Australia", WeatherDescription = "Cloudy", Latitude = "35.0833S", Longitude = "142.0667E" });
            return weatherCollection;
        }
    }
    public class ViewModel
    {
        public List<Weather> Models
        {
            get;
            set;
        }

        public ViewModel()
        {

            this.Models = new List<Weather>();
            this.Models = Weather.GetWeatherData();

        }
    }

}

Methods

add_SizeChanged(SizeChangingEventHandler)

Declaration

public void add_SizeChanged(SizeChangingEventHandler value)

Parameters

Type	Name	Description
SizeChangingEventHandler	value

remove_SizeChanged(SizeChangingEventHandler)

Declaration

public void remove_SizeChanged(SizeChangingEventHandler value)

Parameters

Type	Name	Description
SizeChangingEventHandler	value

Events

SizeChanged

SizeChangingEventHandler

Declaration

public event SizeChangingEventHandler SizeChanged

Event Type

Type
SizeChangingEventHandler