เพิ่มแผนที่

เลือกแพลตฟอร์ม แอนดรอยด์ iOS JavaScript

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

บทนำ

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

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

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

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

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

สร้างแผนที่ด้วย SwiftUI

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

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

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

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

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

    1. ตั้งค่าใน Google Cloud Console

    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: วิธี หากจะใช้แผนที่นี้เป็นตัวควบคุมการดู มุมมองเท่านั้น ตัวเลือกแผนที่ frame ค่าเริ่มต้น CGRectZero สามารถเป็น ใช้เป็นมุมมอง frame — แผนที่จะถูกปรับขนาดโดยอัตโนมัติ

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

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

Swift

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
  }
}

Objective-C

- (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 เพิ่มเติมได้ ออบเจ็กต์

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

หลังจากทำตามขั้นตอนเหล่านี้เสร็จแล้ว คุณสามารถกำหนดค่าแผนที่ได้ การตั้งค่า