泡沫层
的泡沫层允许您在地理位置上创建不同类型的形状,并通过与形状相关的值计算半径。
地图组件根据数据源中可用的最大值和最小值自动计算气泡的半径。
控件定义表示形状的位置和值的数据源字段LocationField和ValueField的性质MapLayer
标签。
选项设置气泡的样式MapLayerBubbleSettings
内标签-MapLayerBubbleSettingsStyle
。
配置一个类型为Bubble的映射层:
- 添加
TelerikMap
标签。 - 设置
类型
的参数。MapLayer
来泡沫
。 - 设置
数据
参数。 - 设置
LocationField
和ValueField
参数。
下面的示例演示如何配置Map Bubble Layer。
地图气泡层配置。
这个代码片段展示了一个Bubble Layer配置的例子。*@ < MapLayerBubbleSettingsStyle> < maplayertype ="@MapLayersType。标记" Data="@MarkerData1" LocationField="@nameof(MarkerModel.LatLng)"TitleField = " @nameof (MarkerModel.Title)"> @code{公共字符串[]子域{get;设置;} = new string[] {"a", "b", "c"};公共字符串UrlTemplate {get; set; } = "https://#= subdomain #.tile.openstreetmap.org/#= zoom #/#= x #/#= y #.png"; public string Attribution { get; set; } = "© OpenStreetMap contributors"; public double[] Center { get; set; } = new double[] { 30.268107, -97.744821 }; public List MarkerData1 { get; set; } = new List() { new MarkerModel() { LatLng = new double[] { 30.268107, -97.744821 }, Title = "Austin, TX" } }; public List MarkerData2 { get; set; } = new List() { new MarkerModel() { LatLng = new double[] { 37.7749, -122.4194 }, Title = "San Francisco, CA" } }; public List BubbleData { get; set; } = new List() { new BubbleModel() { LatLng = new double[] { 37.7749, -122.4194 }, Revenue = 1000 }, new BubbleModel() { LatLng = new double[] { 41.8781, -87.6298 }, Revenue = 200 } }; public class MarkerModel { public double[] LatLng { get; set; } public string Title { get; set; } } public class BubbleModel { public double[] LatLng { get; set; } public int Revenue { get; set; } } }
上述代码片段的结果。