Membuat gaya kustom untuk peta dalam ruangan (pratinjau)

Saat Anda membuat peta dalam ruangan menggunakan Azure Maps Creator, gaya default diterapkan. Artikel ini membahas cara menyesuaikan elemen gaya ini.

Prasyarat

• Memahami konsep Pembuat.
• Tileset Pembuat Azure Maps.

Membuat gaya kustom menggunakan editor visual Pembuat

Meskipun dimungkinkan untuk memodifikasi gaya peta dalam ruangan Anda menggunakan Creators Rest API, Creator juga menawarkan editor gaya visual untuk membuat gaya kustom yang tidak memerlukan pengkodian. Artikel ini berfokus secara eksklusif pada pembuatan gaya kustom menggunakan editor gaya ini.

Buka gaya

Saat peta dalam ruangan dibuat di layanan Azure Maps Creator Anda, gaya default secara otomatis dibuat untuk Anda. Untuk menyesuaikan elemen gaya peta dalam ruangan Anda, buka gaya default tersebut.

Buka editor gaya dan pilih tombol Buka toolbar.

Kotak dialog Buka Gaya terbuka.

Masukkan kunci langganan Anda di bidang Masukkan kunci langganan Azure Maps Anda.

Selanjutnya, pilih geografi yang terkait dengan kunci langganan Anda di daftar drop-down.

Pilih tombol Dapatkan daftar konfigurasi peta untuk mendapatkan daftar setiap konfigurasi peta yang terkait dengan sumber daya Pembuat aktif.

https://{geography}.atlas.microsoft.com/tilesets/{tilesetId}?2023-03-01-preview

"defaultMapConfigurationId": "68d74ad9-4f84-99ce-06bb-19f487e8e692"

Setelah konfigurasi peta yang diinginkan dipilih, daftar drop-down gaya akan muncul.

Setelah Anda memilih gaya yang diinginkan, pilih tombol Muat gaya yang dipilih.

Tentang dialog gaya terbuka

Ubah gaya

Setelah gaya Anda terbuka di editor visual, Anda dapat mulai memodifikasi berbagai elemen peta dalam ruangan Anda seperti mengubah warna latar belakang ruang konferensi, kantor, atau kamar kecil. Anda juga dapat mengubah ukuran font untuk label seperti nomor office dan menentukan apa yang muncul pada tingkat pembesaran tampilan yang berbeda.

Ubah warna latar belakang

Untuk mengubah warna latar belakang untuk semua unit di lapisan yang ditentukan, letakkan penunjuk mouse Anda ke unit yang diinginkan dan pilih menggunakan tombol mouse kiri. Anda disajikan dengan menu popup yang menunjukkan lapisan yang terkait dengan kategori yang dikaitkan dengan unit. Setelah Anda memilih lapisan yang ingin Anda perbarui properti gayanya, lapisan tersebut siap untuk diperbarui di panel kiri.

Buka palet warna dan pilih warna yang ingin Anda ubah unit yang dipilih.

Peta dasar

Daftar drop-down peta dasar pada toolbar editor visual menyajikan daftar gaya peta dasar yang memengaruhi atribut gaya peta dasar tempat peta dalam ruangan Anda menjadi bagian. Ini tidak memengaruhi elemen gaya peta dalam ruangan Anda tetapi memungkinkan Anda untuk melihat bagaimana peta dalam ruangan Anda terlihat dengan berbagai peta dasar.

Menyimpan gaya kustom

Setelah Anda membuat perubahan yang diinginkan pada gaya Anda, simpan perubahan ke sumber daya Pembuat Anda. Anda dapat menimpa gaya Anda dengan perubahan atau membuat gaya baru.

Untuk menyimpan perubahan Anda, pilih tombol Simpan pada toolbar.

Ini memunculkan kotak dialog Unggah gaya & konfigurasi peta:

Tabel berikut ini menjelaskan empat bidang yang disajikan.

Beberapa hal penting yang perlu diketahui tentang alias:

1. Dapat diberi nama menggunakan karakter alfanumerik (0-9, a-z, A-Z), tanda hubung (-) dan garis bawah (_).
2. Dapat digunakan untuk mereferensikan konfigurasi peta yang mendasar, sebagai pengganti ID objek tersebut. Ini sangat penting karena konfigurasi peta tidak dapat diperbarui, yang berarti setiap kali setiap perubahan disimpan, ID baru dihasilkan, tetapi alias dapat tetap sama, sehingga merujuknya lebih sedikit rawan kesalahan setelah dimodifikasi beberapa kali.

Setelah Anda memasukkan nilai ke setiap bidang yang diperlukan, pilih tombol Unggah konfigurasi peta untuk menyimpan gaya dan memetakan data konfigurasi ke sumber daya Pembuat Anda.

Setelah berhasil mengunggah gaya kustom, Anda akan melihat dialog Unggah selesai yang menunjukkan nilai untuk ID Gaya, ID konfigurasi Peta, dan alias konfigurasi peta. Untuk informasi selengkapnya, lihat gaya kustom dan konfigurasi peta.

Kategori kustom

Pembuat Azure Maps telah menentukan daftar kategori. Saat membuat manifes, Anda mengaitkan setiap unit di fasilitas Anda ke salah satu kategori ini di objek unitProperties .

Mungkin ada kalanya Anda ingin membuat kategori baru. Misalnya, Anda mungkin ingin kemampuan untuk menerapkan atribut gaya yang berbeda ke semua kamar dengan akomodasi khusus untuk penyandang disabilitas seperti ruang telepon dengan ponsel yang memiliki layar yang menunjukkan apa yang dikatakan pemanggil untuk orang dengan gangguan pendengaran.

Untuk melakukan ini, masukkan nilai yang categoryName diinginkan dalam untuk yang diinginkan unitName dalam manifes JSON sebelum mengunggah paket gambar Anda.

Nama kategori tidak terkait dengan lapisan apa pun saat dilihat di editor visual dan tidak memiliki gaya default. Untuk menerapkan gaya ke dalamnya, buat lapisan baru dan tambahkan kategori baru ke dalamnya.

Untuk membuat lapisan baru, pilih tombol duplikat pada lapisan yang ada. Ini membuat salinan lapisan yang dipilih yang dapat Anda ubah sesuai kebutuhan. Selanjutnya, ganti nama lapisan dengan mengetikkan nama baru ke bidang ID . Untuk contoh ini, kami memasukkan indoor_unit_room_accessible.

Setelah membuat lapisan baru, Anda perlu mengaitkan nama kategori baru Anda dengannya. Ini dilakukan dengan mengedit lapisan yang disalin untuk menghapus kategori yang ada dan menambahkan yang baru.

Misalnya, JSON mungkin terlihat seperti ini:

{
  "id": "indoor_unit_room_accessible",
  "type": "fill",
  "filter": [
    "all",
    ["has", "floor0"],
    [
      "any",
      [
        "case",
        [
          "==",
          [
            "typeof",
            ["get", "categoryName"]
          ],
          "string"
        ],
        [
          "==",
          ["get", "categoryName"],
          "room.accessible.phone"
        ],
        false
      ]
    ]
  ],
  "layout": {"visibility": "visible"},
  "metadata": {
    "microsoft.maps:layerGroup": "unit"
  },
  "minzoom": 16,
  "paint": {
    "fill-antialias": true,
    "fill-color": [
      "string",
      ["feature-state", "color"],
      "rgba(230, 230, 230, 1)"
    ],
    "fill-opacity": 1,
    "fill-outline-color": "rgba(120, 120, 120, 1)"
  },
  "source-layer": "Indoor unit",
  "source": "{tilesetId}"
}

Hanya fitur yang cocok dengan filter yang ditampilkan di peta. Anda perlu mengedit filter untuk menghapus kategori apa pun yang tidak ingin Anda tampilkan di peta dan menambahkan kategori baru.

Misalnya, filter JSON mungkin terlihat seperti ini:

[
  "all",
  ["has", "floor0"],
  [
    "any",
    [
      "case",
      [
        "==",
        [
          "typeof",
          ["get", "categoryName"]
        ],
        "string"
      ],
      [
        "==",
        ["get", "categoryName"],
        "room.accessible.phone"
      ],
      false
    ]
  ]
]

Sekarang ketika Anda memilih unit tersebut di peta, menu pop-up memiliki ID lapisan baru, yang jika mengikuti contoh ini adalah indoor_unit_room_accessible. Setelah dipilih, Anda dapat melakukan pengeditan gaya.

Langkah berikutnya