你当前正在访问 Microsoft Azure Global Edition 技术文档网站。 如果需要访问由世纪互联运营的 Microsoft Azure 中国技术文档网站,请访问 https://docs.azure.cn

在 iOS SDK(预览版)中向地图添加多边形挤压层

本文介绍如何使用多边形挤压层将 PolygonMultiPolygon 特征几何体的面积呈现为挤压形状。

注意

Azure Maps iOS SDK 停用

适用于 iOS 的 Azure Maps 本机 SDK 现已弃用,将于 2025 年 3 月 31 日停用。 为了避免服务中断,请在 2025 年 3 月 31 日之前迁移到 Azure Maps Web SDK。 有关详细信息,请参阅 Azure Maps iOS SDK 迁移指南

使用多边形挤压层

将多边形挤压层连接到数据源。 然后,将其加载到地图中。 多边形挤压层会将 PolygonMultiPolygon 特征的区域呈现为挤压形状。 多边形挤压层的 heightbase 属性定义了与挤压形状的地面和高度的基准距离(以米为单位)。 下面的代码演示如何创建一个多边形,如何将其添加到数据源中,以及如何使用多边形挤压层类进行呈现。

// Create a data source and add it to the map.
let source = DataSource()
map.sources.add(source)

// Create a rectangular polygon.
source.add(geometry: Polygon([
    CLLocationCoordinate2D(latitude: 40.800279, longitude: -73.958383),
    CLLocationCoordinate2D(latitude: 40.768459, longitude: -73.981547),
    CLLocationCoordinate2D(latitude: 40.767761, longitude: -73.981246),
    CLLocationCoordinate2D(latitude: 40.764616, longitude: -73.973618),
    CLLocationCoordinate2D(latitude: 40.765128, longitude: -73.973060),
    CLLocationCoordinate2D(latitude: 40.764908, longitude: -73.972599),
    CLLocationCoordinate2D(latitude: 40.796584, longitude: -73.949446),
    CLLocationCoordinate2D(latitude: 40.797088, longitude: -73.949661),
    CLLocationCoordinate2D(latitude: 40.800523, longitude: -73.957815),
    CLLocationCoordinate2D(latitude: 40.800279, longitude: -73.958383)
]))

// Create and add a polygon extrusion layer to the map below the labels so that they are still readable.
map.layers.insertLayer(
    PolygonExtrusionLayer(source: source, options: [
        .fillColor(.red),
        .fillOpacity(0.7),
        .height(500)
    ]),
    below: "labels"
)

以下屏幕截图显示了上述使用多边形挤压层呈现垂直拉伸的多边形的代码。

图中显示了上述使用多边形挤压层呈现垂直拉伸的多边形的代码。

添加数据驱动多边形

可以使用多边形挤压层来呈现分级统计图。 将挤压层的 heightfillColor 属性设置为 PolygonMultiPolygon 特征几何形状中统计变量的度量。 下面的代码示例根据状态的人口密度度量值显示美国的挤压分级统计图。

// Create a data source and add it to the map.
let source = DataSource()

// Import the geojson data and add it to the data source.
source.importData(fromURL: Bundle.main.url(forResource: "US_States_Population_Density", withExtension: "json")!)

map.sources.add(source)

// Create and add a polygon extrusion layer to the map below the labels so that they are still readable.
let densityColorSteps: [Int: UIColor] = [
    0: UIColor(red: 0, green: 1, blue: 0.5, alpha: 1),
    10: UIColor(red: 9 / 255, green: 224 / 255, blue: 118 / 255, alpha: 1),
    20: UIColor(red: 11 / 255, green: 191 / 255, blue: 103 / 255, alpha: 1),
    50: UIColor(red: 247 / 255, green: 227 / 255, blue: 5 / 255, alpha: 1),
    100: UIColor(red: 247 / 255, green: 199 / 255, blue: 7 / 255, alpha: 1),
    200: UIColor(red: 247 / 255, green: 130 / 255, blue: 5 / 255, alpha: 1),
    500: UIColor(red: 247 / 255, green: 94 / 255, blue: 5 / 255, alpha: 1),
    1000: UIColor(red: 247 / 255, green: 37 / 255, blue: 5 / 255, alpha: 1)
]
let colorExpression = NSExpression(
    forAZMStepping: NSExpression(forKeyPath: "density"),
    from: NSExpression(forConstantValue: UIColor(red: 0, green: 1, blue: 0.5, alpha: 1)),
    stops: NSExpression(forConstantValue: densityColorSteps)
)

let densityHeightSteps: [Int: Int] = [
    0: 100,
    1200: 960_000
]
let heightExpression = NSExpression(
    forAZMInterpolating: NSExpression(forKeyPath: "density"),
    curveType: .linear,
    parameters: nil,
    stops: NSExpression(forConstantValue: densityHeightSteps)
)

map.layers.insertLayer(
    PolygonExtrusionLayer(source: source, options: [
        .fillOpacity(0.7),
        .fillColor(from: colorExpression),
        .height(from: heightExpression)
    ]),
    below: "labels"
)

下面的屏幕截图显示了美国的分级统计图,该图已着色并根据人口密度垂直拉伸成挤压多边形。

美国的分级统计图,该图已着色并根据人口密度垂直拉伸成挤压多边形。

其他信息

有关可向地图添加的更多代码示例,请参阅以下文章: