Thêm bản đồ bằng điểm đánh dấu

Hướng dẫn này cho bạn biết cách thêm bản đồ của Google vào ứng dụng iOS của bạn. Bản đồ bao gồm một điểm đánh dấu, còn được gọi là ghim, để cho biết vị trí cụ thể.

Lấy mã

Sao chép hoặc tải kho lưu trữ mẫu Google Maps dành cho iOS xuống từ GitHub.

Thiết lập dự án phát triển của bạn

Làm theo các bước sau để cài đặt SDK Maps dành cho iOS:

  1. Tải và cài đặt Xcode phiên bản 13.0 trở lên.
  2. Nếu bạn chưa có CocoaPods, hãy cài đặt vào macOS bằng cách chạy lệnh sau từ thiết bị đầu cuối:
    sudo gem install cocoapods
  3. Sao chép hoặc tải xuống kho lưu trữ mẫu iOS của Google Maps.
  4. Chuyển đến thư mục tutorials/map-with-marker.
  5. Chạy lệnh pod install. Thao tác này sẽ cài đặt các API được chỉ định trong Podfile, cùng với mọi phần phụ thuộc mà các API đó có thể có.
  6. Mở (nhấp đúp) tệp map-with-mark.xcworkspace của dự án để mở tệp đó trong Xcode. Bạn phải sử dụng tệp .xcworkspace để mở dự án.

Lấy khoá API và bật các API cần thiết

Để hoàn tất hướng dẫn này, bạn cần có khoá API của Google được phép sử dụng SDK Maps dành cho iOS. Nhấp vào nút bên dưới để lấy khoá và kích hoạt API.

Bắt đầu

Để biết thêm thông tin, hãy xem bài viết Nhận khoá API.

Thêm khoá API vào ứng dụng

Swift

Thêm khoá API vào AppDelegate.swift của bạn như sau:

  1. Lưu ý rằng câu lệnh nhập sau đã được thêm vào tệp:
    import GoogleMaps
  2. Chỉnh sửa dòng sau trong phương thức application(_:didFinishLaunchingWithOptions:) của bạn, thay thế YOUR_API_KEY bằng khoá API:
    GMSServices.provideAPIKey("YOUR_API_KEY")

Objective-C

Thêm khoá API vào AppDelegate.m của bạn như sau:

  1. Lưu ý rằng câu lệnh nhập sau đã được thêm vào tệp:
    @import GoogleMaps;
  2. Chỉnh sửa dòng sau trong phương thức application(_:didFinishLaunchingWithOptions:) của bạn, thay thế YOUR_API_KEY bằng khoá API:
    [GMSServices provideAPIKey:@"YOUR_API_KEY"];

Xây dựng và chạy ứng dụng

  1. Kết nối thiết bị iOS với máy tính hoặc chọn một trình mô phỏng trong trình đơn bật lên Giao thức Xcode.
  2. Nếu bạn đang sử dụng một thiết bị, hãy nhớ bật dịch vụ vị trí. Nếu bạn đang sử dụng trình mô phỏng, hãy chọn một vị trí trong trình đơn Tính năng.
  3. Trong Xcode, hãy nhấp vào tuỳ chọn trình đơn Sản phẩm/Chạy (hoặc biểu tượng nút phát).

Xcode xây dựng ứng dụng, sau đó chạy ứng dụng trên thiết bị hoặc trên trình mô phỏng.

Bạn sẽ thấy bản đồ có một điểm đánh dấu tập trung ở Sydney ở bờ đông Úc, tương tự như hình ảnh trên trang này.

Khắc phục sự cố:

  • Nếu không thấy bản đồ, hãy kiểm tra xem bạn đã lấy khoá API và thêm khoá đó vào ứng dụng hay chưa, theo mô tả ở trên. Kiểm tra bảng điều khiển gỡ lỗi của Xcode để biết thông báo lỗi về khoá API.
  • Nếu bạn đã hạn chế khoá API theo giá trị nhận dạng gói iOS, hãy chỉnh sửa khoá này để thêm giá trị nhận dạng gói cho ứng dụng: com.google.examples.map-with-marker.
  • Đảm bảo rằng bạn có kết nối Wi-Fi hoặc GPS tốt.
  • Dùng các công cụ gỡ lỗi Xcode để xem nhật ký và gỡ lỗi ứng dụng.

Hiểu mã

  1. Tạo bản đồ và đặt bản đồ làm chế độ xem trong loadView().

    Swift

    // Create a GMSCameraPosition that tells the map to display the
    // coordinate -33.86,151.20 at zoom level 6.
    let camera = GMSCameraPosition.camera(withLatitude: -33.86, longitude: 151.20, zoom: 6.0)
    let mapView = GMSMapView.map(withFrame: CGRect.zero, camera: camera)
    view = mapView
          

    Objective-C

    // Create a GMSCameraPosition that tells the map to display the
    // coordinate -33.86,151.20 at zoom level 6.
    GMSCameraPosition *camera = [GMSCameraPosition cameraWithLatitude:-33.86
                                                            longitude:151.20
                                                                 zoom:6.0];
    GMSMapView *mapView = [[GMSMapView alloc] initWithFrame: CGRectZero camera:camera];
    self.view = mapView;
          
  2. Thêm điểm đánh dấu vào bản đồ trong loadView().

    Swift

    // Creates a marker in the center of the map.
    let marker = GMSMarker()
    marker.position = CLLocationCoordinate2D(latitude: -33.86, longitude: 151.20)
    marker.title = "Sydney"
    marker.snippet = "Australia"
    marker.map = mapView
          

    Objective-C

    // Creates a marker in the center of the map.
    GMSMarker *marker = [[GMSMarker alloc] init];
    marker.position = CLLocationCoordinate2DMake(-33.86, 151.20);
    marker.title = @"Sydney";
    marker.snippet = @"Australia";
    marker.map = mapView;
          

Theo mặc định, SDK bản đồ dành cho iOS hiển thị nội dung của cửa sổ thông tin khi người dùng nhấn vào một điểm đánh dấu. Bạn không cần thêm trình nghe lượt nhấp cho điểm đánh dấu nếu đã sẵn sàng sử dụng hành vi mặc định.

Chúc mừng bạn! Bạn đã tạo một ứng dụng iOS hiển thị bản đồ của Google có điểm đánh dấu để cho biết một vị trí cụ thể. Bạn cũng đã tìm hiểu cách sử dụng SDK Maps dành cho iOS.

Các bước tiếp theo

Tìm hiểu thêm về đối tượng bản đồ và những việc bạn có thể làm với các điểm đánh dấu.