Định cấu hình bản đồ

Thông tin tổng quan này mô tả cách định cấu hình bản đồ đã được thêm vào ứng dụng iOS bằng SDK Bản đồ dành cho iOS.

Tổng quan

Sau khi thêm bản đồ vào ứng dụng, bạn có thể định cấu hình các tuỳ chọn ban đầu và chế độ cài đặt thời gian chạy của bản đồ. Để biết thông tin chi tiết về cách thêm vùng chứa bản đồ, hãy xem phần Thêm bản đồ.

Chế độ cài đặt ban đầu của bản đồ bao gồm:

• Vị trí của máy ảnh, bao gồm: vị trí, thu phóng, hướng và độ nghiêng. Hãy xem phần Máy ảnh và Chế độ xem để biết thông tin chi tiết về cách định vị máy ảnh.
• Màu nền của bản đồ.
• Loại bản đồ.
• Các thành phần trên giao diện người dùng để hiển thị, chẳng hạn như nút thu phóng và la bàn.
• Cử chỉ cần bật.

Trong thời gian chạy, bạn có thể định cấu hình các chế độ cài đặt này và một số chế độ cài đặt bổ sung bằng cách cập nhật đối tượng GMSMapView.

Các tuỳ chọn về bản đồ

Khi khởi tạo chế độ xem bản đồ, các tuỳ chọn cấu hình sẽ được đặt bằng GMSMapViewOptions. Các thuộc tính tuỳ chọn bao gồm frame, camera, mapID hoặc backgroundColor.

Định cấu hình các tuỳ chọn về bản đồ

Bạn có thể đặt các thuộc tính tuỳ chọn của riêng mình hoặc truyền một GMSMapViewOptions được tạo bản sao với các giá trị mặc định trực tiếp đến GMSMapView.

let options = GMSMapViewOptions()
options.camera = GMSCameraPosition.camera(withLatitude: -33.8683, longitude: 151.2086, zoom: 6)
let mapView = GMSMapView(options:options)

GMSMapViewOptions *options = [[GMSMapViewOptions alloc] init];
options.camera = [GMSCameraPosition cameraWithLatitude:-33.8683
                                                        longitude:151.2086
                                                             zoom:6];
GMSMapView *mapView = [[GMSMapView alloc] initWithOptions:options];

Dưới đây là ví dụ về cách truyền đối tượng GMSMapViewOptions có giá trị mặc định trực tiếp đến GMSMapView.

let options = GMSMapViewOptions()
let mapView = GMSMapView(options:options) //initialized with default values

GMSMapViewOptions *options = [[GMSMapViewOptions alloc] init];
GMSMapView *mapView = [[GMSMapView alloc] initWithOptions:options]; //initialized with default values

Định cấu hình màu nền

Khi làm việc ở chế độ tối hoặc chuyển đổi giữa các chế độ xem bản đồ, bạn nên ghi đè màu nền mặc định của bản đồ. Bạn có thể thực hiện việc này bằng cách đặt thuộc tính backgroundColor của tuỳ chọn bản đồ.

let options = GMSMapViewOptions()
options.backgroundColor = UIColor.yellowColor
let mapView = GMSMapView(options:options)

GMSMapViewOptions *options = [[GMSMapViewOptions alloc] init];
options.backgroundColor = UIColor.yellowColor;
GMSMapView *mapView = [[GMSMapView alloc] initWithOptions:options];

Loại bản đồ

Bạn có thể tuỳ chỉnh bản đồ bằng một trong nhiều loại bản đồ. Loại bản đồ chi phối cách trình bày tổng thể của bản đồ. Ví dụ: một bản đồ địa lý thường chứa bản đồ chính trị tập trung vào việc thể hiện ranh giới và bản đồ đường cho thấy tất cả các con đường của một thành phố hoặc khu vực. SDK Bản đồ dành cho iOS cung cấp các loại bản đồ sau:

Thay đổi loại bản đồ

Để đặt loại bản đồ, hãy gán một giá trị mới cho thuộc tính GMSMapView.mapType. Ví dụ: để hiển thị loại bản đồ vệ tinh:

let options = GMSMapViewOptions()
options.camera = GMSCameraPosition.camera(withLatitude: -33.8683, longitude: 151.2086, zoom: 6)
let mapView = GMSMapView(options:options)
mapView.mapType = .satellite

GMSMapViewOptions *options = [[GMSMapViewOptions alloc] init];
options.camera = [GMSCameraPosition cameraWithLatitude:-33.8683
                                                  longitude:151.2086
                                                        zoom:6];
GMSMapView *mapView = [[GMSMapView alloc] initWithOptions:options];
mapView.mapType = kGMSTypeSatellite;

Bộ chọn bên dưới cho thấy bản so sánh giữa bản đồ địa hình, bản đồ pháp tuyến và bản đồ kết hợp cho cùng một vị trí:

Bản đồ trong nhà

Ở mức độ thu phóng cao, SDK Bản đồ dành cho iOS sẽ hiển thị sơ đồ mặt bằng cho các không gian trong nhà như sân bay, trung tâm mua sắm, cửa hàng bán lẻ lớn và nhà ga. Bản vẽ mặt bằng trong nhà được tích hợp vào thẻ thông tin bản đồ mặc định cho loại bản đồ "bình thường" (kGMSTypeNormal) và tự động bật khi người dùng thu phóng và mờ dần khi bản đồ được thu nhỏ.

Bạn có thể tắt bản đồ trong nhà bằng cách đặt thuộc tính indoorEnabled của GMSMapView thành NO.

mapView.isIndoorEnabled = false
      

mapView.indoorEnabled = NO;
      

Ngoài ra, bạn chỉ có thể tắt chế độ điều khiển Bộ chọn sàn.

Thêm sơ đồ mặt bằng

Bản vẽ mặt bằng có ở một số vị trí. Nếu không có dữ liệu bản vẽ mặt bằng cho một toà nhà mà bạn muốn làm nổi bật trong đơn đăng ký, bạn có thể:

• Thêm bản vẽ mặt bằng trực tiếp vào Google Maps. Nhờ đó, tất cả người dùng Google Maps đều có thể xem kế hoạch của bạn.
• Hiển thị sơ đồ tầng dưới dạng Lớp phủ mặt đất. Điều này chỉ cho phép người dùng ứng dụng của bạn xem bản vẽ mặt bằng.

Lớp lưu lượng truy cập

Bạn có thể cho phép người dùng xem bản đồ có thông tin về mật độ giao thông được phủ lên trên. Báo cáo này cung cấp thông tin tóm tắt trực quan về tình hình lưu lượng truy cập tại địa phương. Bạn có thể bật và tắt lớp thông tin về giao thông bằng cách gọi phương thức trafficEnabled. Ví dụ sau đây cho thấy cách lớp giao thông có thể xuất hiện trên bản đồ.

Hỗ trợ tiếp cận

Theo mặc định, các thành phần hỗ trợ tiếp cận trên bản đồ sẽ bị ẩn. Bạn có thể bật tính năng hỗ trợ tiếp cận bằng cách đặt thuộc tính accessibilityElementsHidden của GMSMapView thành NO. Điều này sẽ tạo ra các phần tử hỗ trợ tiếp cận cho các đối tượng lớp phủ (chẳng hạn như GMSMarker và cửa sổ thông tin, GMSPolyline, v.v.).

mapView.accessibilityElementsHidden = false
      

mapView.accessibilityElementsHidden = NO;
      

Thuộc tính này tuân theo giao thức UIAccessibility không chính thức, ngoại trừ giá trị mặc định trong SDK Bản đồ dành cho iOS là YES.

Vị trí của tôi

Theo mặc định, không có dữ liệu vị trí nào xuất hiện trên bản đồ. Bạn có thể bật chấm "Vị trí của tôi" màu xanh dương và hướng la bàn bằng cách đặt myLocationEnabled trên GMSMapView.

mapView.isMyLocationEnabled = true
      

mapView.myLocationEnabled = YES;
      

Việc bật tính năng này sẽ cung cấp vị trí hiện tại của người dùng thông qua thuộc tính myLocation. Thuộc tính này có thể không có sẵn ngay lập tức – ví dụ: nếu người dùng được iOS nhắc cho phép truy cập vào dữ liệu này. Trong trường hợp này, giá trị này là nil.

print("User's location: \(String(describing: mapView.myLocation))")
      

NSLog(@"User's location: %@", mapView.myLocation);
      

Toà nhà 3D

Khi xem cận cảnh, nhiều thành phố sẽ hiển thị các tòa nhà 3D, như trong hình ảnh của Seattle, Washington bên dưới.

Bạn có thể tắt các tòa nhà 3D bằng cách đặt thuộc tính GMSMapView tương ứng trong Swift hoặc Objective-C, như minh hoạ dưới đây:

mapView.isBuildingsEnabled = false
      

[mapView setBuildingsEnabled:NO];
      

Khoảng đệm bản đồ

Google Maps được thiết kế để lấp đầy toàn bộ khu vực do GMSMapView xác định. Một số khía cạnh về cách bản đồ xuất hiện và hoạt động được xác định theo kích thước của thành phần hiển thị:

• Mục tiêu của máy ảnh phản ánh tâm của vùng đệm.
• Các nút điều khiển trên bản đồ được đặt tương ứng với các cạnh của bản đồ.
• Thông tin pháp lý, chẳng hạn như tuyên bố bản quyền hoặc biểu trưng Google sẽ xuất hiện ở cạnh dưới cùng của bản đồ.

Bạn có thể thêm khoảng đệm xung quanh các cạnh của bản đồ bằng cách sử dụng GMSMapView.Thuộc tính padding. Bản đồ tiếp tục lấp đầy toàn bộ vùng chứa, nhưng vị trí văn bản và điều khiển, cử chỉ trên bản đồ và chuyển động của máy ảnh hoạt động như thể được đặt trong một không gian nhỏ hơn. Điều này dẫn đến các thay đổi sau:

• Các chuyển động của máy ảnh bằng cách sử dụng lệnh gọi API hoặc thao tác nhấn nút (ví dụ: la bàn, vị trí của tôi) đều liên quan đến vùng đệm.
• GMSMapView.projection trả về một phép chiếu chỉ bao gồm vùng được đệm.
• Các thành phần điều khiển trên giao diện người dùng được dịch chuyển so với cạnh của vùng chứa theo số điểm đã chỉ định.

Khoảng đệm có thể hữu ích khi thiết kế giao diện người dùng trùng lặp một số phần của bản đồ. Ví dụ: trong hình ảnh, bản đồ được thêm khoảng đệm dọc theo cạnh trên cùng và cạnh phải. Các nút điều khiển bản đồ hiển thị và văn bản pháp lý hiển thị dọc theo các cạnh của vùng đệm, hiển thị bằng màu xanh lục, trong khi bản đồ tiếp tục lấp đầy toàn bộ vùng chứa, hiển thị bằng màu xanh dương. Trong ví dụ này, bạn có thể thả nổi một trình đơn ở phía bên phải của bản đồ mà không che khuất các nút điều khiển bản đồ.

Để thêm khoảng đệm vào bản đồ, hãy tạo một đối tượng UIEdgeInsets và truyền đối tượng đó vào GMSMapView.Thuộc tính padding.

// Insets are specified in this order: top, left, bottom, right
let mapInsets = UIEdgeInsets(top: 100.0, left: 0.0, bottom: 0.0, right: 300.0)
mapView.padding = mapInsets
      

// Insets are specified in this order: top, left, bottom, right
UIEdgeInsets mapInsets = UIEdgeInsetsMake(100.0, 0.0, 0.0, 300.0);
mapView.padding = mapInsets;
      

Bản đồ phối màu

Đối với bản đồ loại thông thường và địa hình, bạn có thể đặt bảng phối màu bản đồ thành tối, sáng hoặc sử dụng chế độ cài đặt hệ thống hiện tại. Ví dụ: bạn có thể làm tối hoặc làm sáng bảng phối màu của bản đồ dựa trên thời gian trong ngày hoặc việc sử dụng thiết bị trong nhà hoặc ngoài trời.

Sử dụng GMSMapView overrideUserInterfaceStyle: để đặt và cập nhật bảng phối màu của bản đồ.

let options = GMSMapViewOptions()
// Map is init to use light mode by default.
let mapView = GMSMapView(options: options)
// Set map to use dark mode.
mapView.overrideUserInterfaceStyle = .dark
// Set map to use light mode.
mapView.overrideUserInterfaceStyle = .light
// Set map to use dark/light mode based on the value of traitCollection.userInterfaceStyle
mapView.overrideUserInterfaceStyle = .unspecified

GMSMapViewOptions *options = [[GMSMapViewOptions alloc] init];
// Map is init to always use light mode.
GMSMapView *mapView = [[GMSMapView alloc] initWithOptions:options];
// Set map to use dark mode.
mapView.overrideUserInterfaceStyle = UIUserInterfaceStyleDark;
// Set map to use light mode.
mapView.overrideUserInterfaceStyle = UIUserInterfaceStyleLight;
// Set map to use dark/light mode based on the value of traitCollection.userInterfaceStyle
mapView.overrideUserInterfaceStyle = UIUserInterfaceStyleUnspecified;