レイヤの処理
スタイルにはレイヤーを使用して、データの特定のサブセットにスタイリング規則を追加する。(例えば、マップ上のあらゆる川をピンクにすれば、スタイルには該当なレイヤーを作成する)。レイヤーには、スタイルを定義しているデータへの参照および適用されるスタイリング規則の両方がある。
iOS
iOS Mapbox SDKでは、マップを表示・カスタマイズするためのレイヤースタイルのいくつかのオブジェクトを提供する。
• MGLForegroundStyleLayer
MGLForegroundStyleLayerは、コンテンツがMGLSourceオブジェクトによって定義される各スタイルレイヤーの抽象スーパークラスである。
• MGLBackgroundStyleLayer
MGLBackgroundStyleLayerはマップ全体を覆うスタイルレイヤーである。背景のスタイルレイヤーを使用して、マップ上のコンテンツに表示する色またはパターンを設定する。 スタイルの他のレイヤーがMapbox Streetsソースを使用すれば、背景のスタイルレイヤーは土地を描画して、海洋およびその他の水域はMGLFillStyleLayerオブジェクトで描画される。
背景のスタイルレイヤーはスタイル全体の一番下のレイヤーで、マップ全体を覆い、その下のレイヤーを遮る。 したがって、MGLStyle.layers配列の最後項目を取得することでアクセスできる。
背景スタイルのレイヤーが透明で設定、またはスタイルされていない場合は、マップビュー上の他のスタイルでスタイルされていない部分も透明になる。
• MGLRasterStyleLayer
MGLRasterStyleLayerは、ジオリファレンスされたラスター画像、特にラスタータイルをマップ上にレンダリングするスタイルレイヤーである。
• MGLVectorStyleLayer
MGLVectorStyleLayerは、コンテンツがMGLShapeSourceまたはMGLVectorTileSourceオブジェクトによって定義されるスタイルレイヤーの抽象スーパークラスである。
• MGLCircleStyleLayer
MGLCircleStyleLayerは、1つ以上の塗りつぶし円をマップ上にレンダリングするスタイルレイヤーである。
• MGLFillStyleLayer
MGLFillStyleLayerは、1つ以上の塗りつぶしポリゴン(および任意でストローク付き)をマップ上にレンダリングするスタイルレイヤーである。
• MGLFillExtrusionStyleLayer
MGLFillExtrusionStyleLayerは、1つ以上の3D押し出しポリゴンをマップ上にレンダリングするスタイルレイヤーである。
• MGLHeatmapStyleLayer
MGLHeatmapStyleLayerは、ヒートマップをレンダリングするスタイルレイヤーである。
• MGLHillshadeStyleLayer
MGLHillshadeStyleLayerは、ラスターデジタルの標高モデル(DEM)タイルをマップ上にレンダリングするスタイルレイヤーである。
• MGLLineStyleLayer
MGLLineStyleLayerは、1つ以上のストローク付きポリラインをマップ上にレンダリングするスタイルレイヤーである。
• MGLSymbolStyleLayer
MGLSymbolStyleLayerは、地図上の各ポイントまたは線に沿うアイコンとテキストラベルをレンダリングするスタイルレイヤーである。
備考: 参照資料へのリンクは以下である。 https://docs.mapbox.com/ios/api/maps/4.9.0/Style%20Layers.html
上記のレイヤオブジェクトを使用すると、地図上のレイヤを簡単に操作できる。
例
1. import Mapbox
2.
3. class ViewController: UIViewController, MGLMapViewDelegate {
4. var mapView: MGLMapView!
5. var contoursLayer: MGLStyleLayer?
6.
7. override func viewDidLoad() {
8. super.viewDidLoad()
9.
10. mapView = MGLMapView(frame: view.bounds)
11. mapView.autoresizingMask = [.flexibleWidth, .flexibleHeight]
12.
13. mapView.setCenter(CLLocationCoordinate2D(latitude: 37.745395, longitude: -119.594421), zoomLevel: 11, animated: false)
14. view.addSubview(mapView)
15.
16. addToggleButton()
17.
18. mapView.delegate = self
19. }
20.
21. // Wait until the style is loaded before modifying the map style
22. func mapView(_ mapView: MGLMapView, didFinishLoading style: MGLStyle) {
23. addLayer(to: style)
24. }
25.
26. func addLayer(to style: MGLStyle) {
27. let source = MGLVectorTileSource(identifier: "contours", configurationURL: NSURL(string: "mapbox://mapbox.mapbox-terrain-v2")! as URL)
28.
29. let layer = MGLLineStyleLayer(identifier: "contours", source: source)
30. layer.sourceLayerIdentifier = "contour"
31. layer.lineJoin = NSExpression(forConstantValue: "round")
32. layer.lineCap = NSExpression(forConstantValue: "round")
33. layer.lineColor = NSExpression(forConstantValue: UIColor.brown)
34. layer.lineWidth = NSExpression(forConstantValue: 1.0)
35.
36. style.addSource(source)
37. if let water = style.layer(withIdentifier: "water") {
38. // You can insert a layer below an existing style layer
39. style.insertLayer(layer, below: water)
40. } else {
41. // or you can simply add it above all layers
42. style.addLayer(layer)
43. }
44.
45. self.contoursLayer = layer
46.
47. showContours()
48. }
49.
50. @objc func toggleLayer(sender: UIButton) {
51. sender.isSelected = !sender.isSelected
52. if sender.isSelected {
53. showContours()
54. } else {
55. hideContours()
56. }
57. }
58.
59. func showContours() {
60. self.contoursLayer?.isVisible = true
61. }
62.
63. func hideContours() {
64. self.contoursLayer?.isVisible = false
65. }
66.
67. func addToggleButton() {
68. let button = UIButton(type: .system)
69. button.setTitle("Toggle Contours", for: .normal)
70. button.isSelected = true
71. button.sizeToFit()
72. button.center.x = self.view.center.x
73. button.frame = CGRect(origin: CGPoint(x: button.frame.origin.x, y: self.view.frame.size.height - button.frame.size.height - 5), size: button.frame.size)
74. button.addTarget(self, action: #selector(toggleLayer(sender:)), for: .touchUpInside)
75. self.view.addSubview(button)
76.
77. if #available(iOS 11.0, *) {
78. let safeArea = view.safeAreaLayoutGuide
79. button.translatesAutoresizingMaskIntoConstraints = false
80. let constraints = [
81. button.bottomAnchor.constraint(equalTo: safeArea.bottomAnchor, constant: -5),
82. button.centerXAnchor.constraint(equalTo: safeArea.centerXAnchor)
83. ]
84.
85. NSLayoutConstraint.activate(constraints)
86. } else {
87. button.autoresizingMask = [.flexibleTopMargin, .flexibleLeftMargin, .flexibleRightMargin]
88. }
89. }
90. }