เพิ่มแผนที่

แผนที่จะแสดงใน API โดยคลาส GMSMapView ซึ่งเป็นคลาสย่อยของ UIView แผนที่เป็นออบเจ็กต์ที่สำคัญที่สุดใน Maps SDK สำหรับ iOS และมีวิธีการที่จำเป็นสำหรับการเพิ่ม นําออก และจัดการออบเจ็กต์อื่นๆ เช่น เครื่องหมายและเส้นประกอบ

บทนำ

Maps SDK สําหรับ iOS ช่วยให้คุณแสดงแผนที่ Google ในแอปพลิเคชัน iOS ได้ แผนที่เหล่านี้มีลักษณะเหมือนกับแผนที่ที่คุณเห็นในแอป Google Maps บน iOS และ SDK จะแสดงฟีเจอร์เดียวกันหลายอย่าง

นอกจากฟังก์ชันการแมปแล้ว API ยังรองรับการโต้ตอบที่หลากหลายซึ่งสอดคล้องกับรูปแบบ UI ของ iOS ด้วย เช่น คุณสามารถตั้งค่าการโต้ตอบกับแผนที่ได้โดยกำหนดเงื่อนไขการตอบสนองที่ตอบสนองต่อท่าทางสัมผัสของผู้ใช้ เช่น การแตะและการแตะสองครั้ง

คลาสคีย์เมื่อทํางานกับออบเจ็กต์ Map คือคลาส GMSMapView GMSMapView จะจัดการการดำเนินการต่อไปนี้โดยอัตโนมัติ

• การเชื่อมต่อกับบริการ Google Maps
• กำลังดาวน์โหลดชิ้นส่วนแผนที่
• การแสดงการ์ดบนหน้าจออุปกรณ์
• แสดงการควบคุมต่างๆ เช่น การเลื่อนและซูม
• ตอบสนองต่อท่าทางสัมผัสในการเลื่อนและซูมโดยย้ายแผนที่และซูมเข้าหรือออก
  • การตอบสนองต่อท่าทางสัมผัสด้วย 2 นิ้วโดยการเอียงมุมมองแผนที่

นอกจากการดำเนินการอัตโนมัติเหล่านี้แล้ว คุณยังควบคุมลักษณะการทำงานและลักษณะที่ปรากฏของแผนที่ผ่านพร็อพเพอร์ตี้และเมธอดที่แสดงโดยคลาส GMSMapView ได้ด้วย GMSMapView ช่วยให้คุณเพิ่มและนำเครื่องหมาย การวางซ้อนพื้นดิน และเส้นประกอบออก เปลี่ยนประเภทแผนที่ที่แสดง และควบคุมสิ่งที่แสดงบนแผนที่ผ่านคลาส GMSCameraPosition ได้

สร้าง Maps ด้วย SwiftUI

SwiftUI มีวิธีเพิ่มเติมในการสร้าง UI โดยใช้แนวทางแบบประกาศ คุณบอก SwiftUI ว่าต้องการให้มุมมองมีลักษณะอย่างไร รวมถึงสถานะต่างๆ ทั้งหมดของมุมมอง แล้วระบบจะดำเนินการที่เหลือ SwiftUI จะจัดการการอัปเดตมุมมองทุกครั้งที่สถานะพื้นฐานมีการเปลี่ยนแปลงเนื่องจากเหตุการณ์หรือการดําเนินการของผู้ใช้

Maps SDK สำหรับ iOS สร้างขึ้นจาก UIKit และไม่แสดงมุมมองที่เข้ากันได้กับ SwiftUI การเพิ่มแผนที่ใน SwiftUI ต้องเป็นไปตาม UIViewRepresentable หรือ UIViewControllerRepresentable ดูข้อมูลเพิ่มเติมได้ที่ Codelab การเพิ่มแผนที่ลงในแอป iOS ด้วย SwiftUI

การเพิ่มแผนที่

ขั้นตอนพื้นฐานในการเพิ่มแผนที่มีดังนี้

1. หากต้องการรับ SDK, รับคีย์ API และเพิ่มเฟรมเวิร์กที่จำเป็น ให้ทำตามขั้นตอนใน

   1. ตั้งค่าในคอนโซล Google Cloud

   2. ใช้คีย์ API

   3. ตั้งค่าโปรเจ็กต์ Xcode

   4. ใน AppDelegate ให้ระบุคีย์ API ให้กับเมธอดคลาส provideAPIKey: ใน GMSServices

   5. สร้างหรืออัปเดต ViewController หากแผนที่แสดงขึ้นเมื่อตัวควบคุมมุมมองนี้ปรากฏขึ้น ให้สร้างแผนที่ภายในเมธอด viewDidLoad

   6. เมื่อเริ่มต้นใช้งานมุมมองแผนที่ ให้ตั้งค่าตัวเลือกการกําหนดค่าด้วย GMSMapViewOptions พร็อพเพอร์ตี้ ได้แก่ frame, camera, mapID,backgroundColor หรือ screen

   7. ตั้งค่าพร็อพเพอร์ตี้ camera ตัวเลือกแผนที่ด้วยออบเจ็กต์ GMSCameraPosition ซึ่งจะระบุจุดศูนย์กลางและระดับการซูมของแผนที่

   8. สร้างและสร้างอินสแตนซ์ของคลาส GMSMapView โดยใช้เมธอด GMSMapView options: หากต้องการใช้แผนที่นี้เป็นมุมมองเดียวของ View Controller ให้ใช้ค่าเริ่มต้นของตัวเลือกแผนที่ frame ซึ่งก็คือ CGRectZero เป็นมุมมอง frame โดยระบบจะปรับขนาดแผนที่โดยอัตโนมัติ

   9. ตั้งค่าออบเจ็กต์ GMSMapView เป็นมุมมองของตัวควบคุมมุมมอง เช่น self.view = mapView;

ตัวอย่างด้านล่างแสดงการเพิ่มแผนที่ที่กําหนดศูนย์กลางไว้ที่ย่านใจกลางเมืองสิงคโปร์ลงในแอป

import GoogleMaps

class MapObjects : UIViewController {
  override func viewDidLoad() {
    super.viewDidLoad()

    let options = GMSMapViewOptions()
    options.camera = GMSCameraPosition(latitude: 1.285, longitude: 103.848, zoom: 12)
    options.frame = self.view.bounds;

    let mapView = GMSMapView(options:options)
    self.view = mapView
  }
}

- (void)viewDidLoad {
  [super viewDidLoad];

  GMSMapViewOptions *options = [[GMSMapViewOptions alloc] init];
  options.camera = [GMSCameraPosition cameraWithLatitude:1.285
                                                        longitude:103.848
                                                             zoom:12];
  options.frame = self.view.bounds;

  GMSMapView *mapView = [[GMSMapView alloc] initWithOptions:options];
  self.view = mapView;
}

เมื่อทําตามขั้นตอนเหล่านี้แล้ว คุณสามารถกําหนดค่าGMSMapView ออบเจ็กต์เพิ่มเติมได้

ขั้นตอนถัดไป

หลังจากทําตามขั้นตอนเหล่านี้แล้ว คุณจะกําหนดค่าแผนที่ได้