Tham chiếu kiểu cho SDK Bản đồ dành cho iOS

Với các lựa chọn về kiểu, bạn có thể tuỳ chỉnh cách trình bày các kiểu bản đồ tiêu chuẩn của Google, thay đổi cách hiển thị trực quan các đối tượng như đường bộ, công viên, doanh nghiệp và các điểm tham quan khác. Ngoài việc thay đổi kiểu của các đối tượng này, bạn có thể ẩn hoàn toàn các đối tượng. Điều này có nghĩa là bạn có thể nhấn mạnh các thành phần cụ thể của bản đồ hoặc làm cho bản đồ bổ sung cho kiểu của trang xung quanh.

Ví dụ

Khai báo kiểu JSON sau đây chuyển tất cả đối tượng trên bản đồ thành màu xám, sau đó tô màu xanh dương cho hình học của đường trục chính và ẩn hoàn toàn nhãn cảnh quan:

[
  {
    "featureType": "all",
    "stylers": [
      { "color": "#C0C0C0" }
    ]
  },{
    "featureType": "road.arterial",
    "elementType": "geometry",
    "stylers": [
      { "color": "#CCFFFF" }
    ]
  },{
    "featureType": "landscape",
    "elementType": "labels",
    "stylers": [
      { "visibility": "off" }
    ]
  }
]

Đối tượng JSON

Khai báo kiểu JSON bao gồm các phần tử sau:

• featureType (không bắt buộc) – các đối tượng cần chọn để sửa đổi kiểu này. Đối tượng là các đặc điểm địa lý trên bản đồ, bao gồm đường bộ, công viên, vùng nước và nhiều đối tượng khác. Nếu bạn không chỉ định đối tượng, thì tất cả đối tượng sẽ được chọn.
• elementType (không bắt buộc) – thuộc tính của đối tượng đã chỉ định cần chọn. Phần tử là các phần phụ của một đối tượng, bao gồm nhãn và hình học. Nếu bạn không chỉ định phần tử, thì tất cả phần tử của đối tượng sẽ được chọn.
• stylers – các quy tắc cần áp dụng cho các đối tượng và phần tử đã chọn. Stylers cho biết màu sắc, khả năng hiển thị và trọng số của đối tượng. Bạn có thể áp dụng một hoặc nhiều styler cho một đối tượng.

Để chỉ định một kiểu, bạn phải kết hợp một tập hợp các featureType và elementType bộ chọn và stylers của bạn vào một mảng kiểu. Bạn có thể nhắm mục tiêu đến bất kỳ tổ hợp đối tượng nào trong một mảng. Tuy nhiên, số lượng kiểu mà bạn có thể áp dụng cùng một lúc bị giới hạn. Nếu mảng kiểu của bạn vượt quá số ký tự tối đa, thì sẽ không có kiểu nào được áp dụng.

Phần còn lại của trang này có thêm thông tin về các đối tượng, phần tử và styler.

featureType

Đoạn mã JSON sau đây chọn tất cả đường bộ trên bản đồ:

{
  "featureType": "road"
}

Đối tượng hoặc loại đối tượng là các đặc điểm địa lý trên bản đồ, bao gồm đường bộ, công viên, vùng nước, doanh nghiệp và nhiều đối tượng khác.

Các đối tượng tạo thành một cây danh mục, với all là gốc. Nếu bạn không chỉ định đối tượng, thì tất cả đối tượng sẽ được chọn. Việc chỉ định đối tượng all sẽ có tác dụng tương tự.

Một số đối tượng chứa các đối tượng con mà bạn chỉ định bằng cách sử dụng ký hiệu dấu chấm. Ví dụ: landscape.natural hoặc road.local. Nếu bạn chỉ chỉ định đối tượng gốc, chẳng hạn như road, thì các kiểu mà bạn chỉ định cho đối tượng gốc sẽ áp dụng cho tất cả đối tượng con của đối tượng đó, chẳng hạn như road.local và road.highway.

Xin lưu ý rằng các đối tượng gốc có thể bao gồm một số phần tử không có trong tất cả đối tượng con của chúng.

Các đối tượng sau đây được cung cấp:

• all (mặc định) chọn tất cả đối tượng.
• administrative chọn tất cả khu vực hành chính. Việc tạo kiểu chỉ ảnh hưởng đến nhãn của các khu vực hành chính, chứ không ảnh hưởng đến đường biên giới địa lý hoặc vùng tô.
  • administrative.country chọn các quốc gia.
  • administrative.land_parcel chọn các lô đất.
  • administrative.locality chọn các địa phương.
  • administrative.neighborhood chọn các vùng lân cận.
  • administrative.province chọn các tỉnh.
• landscape chọn tất cả cảnh quan.
  • landscape.man_made chọn các đối tượng do con người tạo ra, chẳng hạn như các toà nhà và công trình khác.
  • landscape.natural chọn các đối tượng tự nhiên, chẳng hạn như núi, sông, sa mạc và sông băng.
  • landscape.natural.landcover chọn các đối tượng phủ đất, vật liệu vật lý bao phủ bề mặt trái đất, chẳng hạn như rừng, đồng cỏ, vùng đất ngập nước và đất trống.
  • landscape.natural.terrain chọn các đối tượng địa hình của bề mặt đất, chẳng hạn như độ cao, độ dốc và hướng.
• poi chọn tất cả điểm tham quan.
  • poi.attraction chọn các điểm thu hút du khách.
  • poi.business chọn các doanh nghiệp.
  • poi.government chọn các toà nhà chính phủ.
  • poi.medical chọn các dịch vụ khẩn cấp, bao gồm bệnh viện, hiệu thuốc, cảnh sát, bác sĩ và các dịch vụ khác.
  • poi.park chọn các công viên.
  • poi.place_of_worship chọn các địa điểm thờ cúng, bao gồm nhà thờ, đền, nhà thờ Hồi giáo và các địa điểm khác.
  • poi.school chọn các trường học.
  • poi.sports_complex chọn các tổ hợp thể thao.
• road chọn tất cả đường bộ.
  • road.arterial chọn các đường trục chính.
  • road.highway chọn các đường cao tốc.
  • road.highway.controlled_access chọn các đường cao tốc có kiểm soát lối ra vào.
  • road.local chọn các đường địa phương.
• transit chọn tất cả các nhà ga và tuyến phương tiện công cộng.
  • transit.line chọn các tuyến phương tiện công cộng.
  • transit.station chọn tất cả các nhà ga phương tiện công cộng.
  • transit.station.airport chọn các sân bay.
  • transit.station.bus chọn các trạm xe buýt.
  • transit.station.rail chọn các nhà ga đường sắt.
• water chọn các vùng nước.

elementType

Đoạn mã JSON sau đây chọn nhãn cho tất cả đường địa phương:

{
  "featureType": "road.local",
  "elementType": "labels"
}

Phần tử là các phân khu của một đối tượng. Ví dụ: một đường bộ bao gồm đường đồ hoạ (hình học ) trên bản đồ, cũng như văn bản biểu thị tên của đường đó (nhãn).

Các phần tử sau đây được cung cấp, nhưng xin lưu ý rằng một đối tượng cụ thể có thể không hỗ trợ, hỗ trợ một số hoặc hỗ trợ tất cả các phần tử:

Văn bản nhãn fill và màu stroke thay đổi dựa trên mức thu phóng. Để đảm bảo trải nghiệm nhất quán trên các mức thu phóng, hãy luôn xác định cả fill và stroke.

• all (mặc định) chọn tất cả phần tử của đối tượng đã chỉ định.
• geometry chọn tất cả phần tử hình học của đối tượng đã chỉ định.
  • geometry.fill chỉ chọn vùng tô của hình học của đối tượng.
  • geometry.stroke chỉ chọn đường viền của hình học của đối tượng.
• labels chọn các nhãn văn bản được liên kết với đối tượng đã chỉ định.
  • labels.icon chỉ chọn biểu tượng xuất hiện trong nhãn của đối tượng.
  • labels.text chỉ chọn văn bản của nhãn.
  • labels.text.fill chỉ chọn vùng tô của nhãn. Vùng tô của nhãn thường được hiển thị dưới dạng đường viền màu bao quanh văn bản nhãn.
  • labels.text.stroke chỉ chọn đường viền của văn bản của nhãn.

stylers

Stylers là các lựa chọn định dạng mà bạn có thể áp dụng cho các đối tượng và phần tử trên bản đồ.

Đoạn mã JSON sau đây hiển thị một đối tượng dưới dạng màu xanh lục sáng, sử dụng giá trị RGB:

"stylers": [
  { "color": "#99FF33" }
]

Đoạn mã này loại bỏ tất cả cường độ của màu của một đối tượng, bất kể màu bắt đầu của đối tượng đó là gì. Hiệu ứng là hiển thị đối tượng ở thang màu xám:

"stylers": [
  { "saturation": -100 }
]

Đoạn mã này ẩn hoàn toàn một đối tượng:

    "stylers": [
      { "visibility": "off" }
    ]

Các lựa chọn về kiểu sau đây được hỗ trợ:

• hue (chuỗi hex RGB có định dạng #RRGGBB) cho biết màu cơ bản.

  Lưu ý: Lựa chọn này đặt sắc độ trong khi vẫn giữ độ rực màu và độ sáng được chỉ định trong kiểu mặc định của Google (hoặc trong các lựa chọn về kiểu khác mà bạn xác định trên bản đồ). Màu kết quả tương ứng với kiểu của bản đồ cơ sở. Nếu Google thực hiện bất kỳ thay đổi nào đối với kiểu bản đồ cơ sở, thì những thay đổi đó ảnh hưởng đến các đối tượng trên bản đồ của bạn được tạo kiểu bằng hue. Bạn nên sử dụng styler color tuyệt đối nếu có thể.

• lightness (giá trị dấu phẩy động từ -100 và 100) cho biết tỷ lệ phần trăm thay đổi về độ sáng của phần tử. Giá trị âm làm tăng độ tối (trong đó -100 chỉ định màu đen) trong khi giá trị dương làm tăng độ sáng (trong đó +100 chỉ định màu trắng).

  Lưu ý: Lựa chọn này đặt độ sáng trong khi vẫn giữ độ rực màu và sắc độ được chỉ định trong kiểu mặc định của Google (hoặc trong các lựa chọn về kiểu khác mà bạn xác định trên bản đồ). Màu kết quả tương ứng với kiểu của bản đồ cơ sở. Nếu Google thực hiện bất kỳ thay đổi nào đối với kiểu bản đồ cơ sở, thì những thay đổi đó ảnh hưởng đến các đối tượng trên bản đồ của bạn được tạo kiểu bằng lightness. Bạn nên sử dụng styler color tuyệt đối nếu có thể.

• saturation (giá trị dấu phẩy động từ -100 và 100) cho biết tỷ lệ phần trăm thay đổi về cường độ của màu cơ bản cần áp dụng cho phần tử.

  Lưu ý: Lựa chọn này đặt độ rực màu trong khi vẫn giữ sắc độ và độ sáng được chỉ định trong kiểu mặc định của Google (hoặc trong các lựa chọn về kiểu khác mà bạn xác định trên bản đồ). Màu kết quả tương ứng với kiểu của bản đồ cơ sở. Nếu Google thực hiện bất kỳ thay đổi nào đối với kiểu bản đồ cơ sở, thì những thay đổi đó ảnh hưởng đến các đối tượng trên bản đồ của bạn được tạo kiểu bằng saturation. Bạn nên sử dụng styler color tuyệt đối nếu có thể.

• gamma (giá trị dấu phẩy động từ 0.01 đến 10.0, trong đó 1.0 không áp dụng điều chỉnh) cho biết mức điều chỉnh gamma cần áp dụng cho phần tử. Các điều chỉnh gamma sửa đổi độ sáng của màu theo cách phi tuyến tính, trong khi không ảnh hưởng đến giá trị màu trắng hoặc màu đen. Điều chỉnh gamma thường được dùng để sửa đổi độ tương phản của nhiều phần tử. Ví dụ: bạn có thể sửa đổi gamma để tăng hoặc giảm độ tương phản giữa các cạnh và phần bên trong của các phần tử.

  Lưu ý: Lựa chọn này điều chỉnh độ sáng tương ứng với kiểu mặc định của Google kiểu, sử dụng đường cong gamma. Nếu Google thực hiện bất kỳ thay đổi nào đối với kiểu bản đồ cơ sở thì những thay đổi đó sẽ ảnh hưởng đến các đối tượng trên bản đồ của bạn được tạo kiểu bằng gamma. Bạn nên sử dụng styler color tuyệt đối nếu có thể.

• invert_lightness (nếu true) đảo ngược độ sáng hiện có. Ví dụ: điều này hữu ích để nhanh chóng chuyển sang bản đồ tối hơn với văn bản màu trắng.

  Lưu ý: Lựa chọn này chỉ đảo ngược kiểu mặc định của Google. Nếu Google thực hiện bất kỳ thay đổi nào đối với kiểu bản đồ cơ sở, thì những thay đổi đó sẽ ảnh hưởng đến các đối tượng trên bản đồ của bạn được tạo kiểu bằng invert_lightness. Bạn nên sử dụng styler color tuyệt đối nếu có thể.

• visibility (on, off, hoặc simplified) cho biết liệu và cách phần tử xuất hiện trên bản đồ. Chế độ hiển thị simplified sẽ loại bỏ một số đối tượng kiểu khỏi các đối tượng bị ảnh hưởng; ví dụ: đường bộ được đơn giản hoá thành các đường mỏng hơn không có đường viền, trong khi công viên mất văn bản nhãn nhưng vẫn giữ lại biểu tượng nhãn.
• color (chuỗi hex RGB có định dạng #RRGGBB) đặt màu của đối tượng.
• weight (giá trị số nguyên, lớn hơn hoặc bằng 0) đặt trọng số của đối tượng, tính bằng pixel. Việc đặt trọng số thành giá trị cao có thể dẫn đến việc cắt gần đường viền ô.

Các quy tắc về kiểu được áp dụng theo thứ tự mà bạn chỉ định. Đừng kết hợp nhiều thao tác thành một thao tác kiểu duy nhất. Thay vào đó, hãy xác định từng thao tác dưới dạng một mục riêng biệt trong mảng kiểu.

Lưu ý: Thứ tự rất quan trọng, vì một số thao tác không có tính giao hoán. Các đối tượng và/hoặc phần tử được sửa đổi thông qua các thao tác kiểu (thường) đã có các kiểu hiện có. Các thao tác sẽ hoạt động trên những kiểu hiện có đó, nếu có.

Mô hình sắc độ, độ rực màu, độ sáng

Bản đồ phong cách riêng sử dụng mô hình sắc độ, độ rực màu, độ sáng (HSL) để biểu thị màu trong các thao tác bộ định kiểu. Sắc độ cho biết màu cơ bản, độ rực màu cho biết cường độ của màu đó và độ sáng cho biết lượng màu trắng hoặc màu đen tương đối trong màu thành phần.

Điều chỉnh gamma sửa đổi độ sáng trên không gian màu, thường là để tăng hoặc giảm độ tương phản. Ngoài ra, mô hình HSL xác định màu trong không gian toạ độ, trong đó hue cho biết hướng trong bánh xe màu, trong khi độ rực màu và độ sáng cho biết biên độ dọc theo các trục khác nhau. Sắc độ được đo trong không gian màu RGB, tương tự như hầu hết các không gian màu RGB, ngoại trừ việc không có các sắc thái màu trắng và màu đen.

Mặc dù hue lấy giá trị màu hex HTML, nhưng chỉ sử dụng giá trị này để xác định màu cơ bản – tức là hướng của màu đó xung quanh bánh xe màu, chứ không phải độ rực màu hoặc độ sáng của màu đó. Các giá trị này được biểu thị riêng dưới dạng các thay đổi phần trăm.

Ví dụ: bạn có thể xác định sắc độ cho màu xanh lục thuần khiết là hue:0x00ff00 hoặc hue:0x000100. Cả hai sắc độ đều giống hệt nhau. Cả hai giá trị đều chỉ đến màu xanh lục thuần khiết trong mô hình màu HSL.

Bánh xe màu RGB

Các giá trị RGB hue bao gồm các phần bằng nhau của màu đỏ, màu xanh lục và màu xanh dương không cho biết sắc độ, vì không có giá trị nào trong số đó cho biết hướng trong không gian toạ độ HSL. Ví dụ: "#000000" (màu đen), "#FFFFFF" (màu trắng), và tất cả các sắc thái thuần khiết của màu xám. Để biểu thị màu đen, màu trắng hoặc màu xám, bạn phải xoá tất cả saturation (đặt giá trị thành -100) và điều chỉnh lightness thay thế.

Ngoài ra, khi sửa đổi các đối tượng hiện có đã có bảng phối màu, việc thay đổi giá trị như hue sẽ không thay đổi saturation hoặc lightness hiện có.