Bagikan melalui


Membuat gaya kustom untuk peta dalam ruangan (pratinjau)

Catatan

Penghentian Pembuat Azure Maps

Layanan peta dalam ruangan Azure Maps Creator sekarang tidak digunakan lagi dan akan dihentikan pada 30/9/25. Untuk informasi selengkapnya, lihat Pengumuman Akhir Masa Pakai Pembuat Azure Maps.

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

Prasyarat

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.

Cuplikan layar menu terbuka di editor gaya visual.

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.

Cuplikan layar kotak dialog terbuka di editor gaya visual.

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

Cuplikan layar kotak dialog gaya terbuka di editor gaya visual dengan daftar drop-down Pilih konfigurasi peta disorot.

Catatan

Jika konfigurasi peta dibuat sebagai bagian dari gaya kustom dan memiliki alias yang disediakan pengguna, alias tersebut muncul di daftar drop-down konfigurasi peta, jika tidak, hanya muncul mapConfigurationId . ID konfigurasi peta default untuk tileset tertentu dapat ditemukan dengan menggunakan tileset mendapatkan permintaan HTTP dan meneruskan ID tileset:

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

mapConfigurationId dikembalikan dalam isi respons, misalnya:

"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

Cuplikan layar kotak dialog Buka Gaya di editor gaya visual, dengan setiap bidang edit bernomor, setiap angka berkorelasi dengan angka dalam tabel berikut.

# Deskripsi
1 Kunci langganan akun Azure Maps Anda
2 Pilih geografi akun Azure Maps.
3 Daftar ID dan alias konfigurasi peta.
4 Daftar gaya yang terkait dengan konfigurasi peta yang dipilih.

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.

Cuplikan layar kotak dialog pop-up lapisan unit di editor gaya visual.

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

Cuplikan layar palet warna di editor gaya visual.

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.

Cuplikan layar daftar drop-down peta dasar di toolbar editor visual.

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.

Cuplikan layar menu simpan di editor gaya visual.

Ini memunculkan kotak dialog Unggah gaya & konfigurasi peta:

Cuplikan layar gaya unggah dan kotak dialog konfigurasi peta di editor gaya visual.

Tabel berikut ini menjelaskan empat bidang yang disajikan.

Properti Deskripsi
Deskripsi gaya Deskripsi yang ditentukan pengguna untuk gaya ini.
Deskripsi konfigurasi peta Deskripsi yang ditentukan pengguna untuk konfigurasi peta ini.
Alias konfigurasi peta Alias yang digunakan untuk mereferensikan konfigurasi peta ini.
Saat mereferensikan secara terprogram, konfigurasi peta dirujuk oleh ID konfigurasi peta jika tidak ada alias yang disediakan.

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.

Peringatan

Alias duplikat tidak diperbolehkan. Jika alias konfigurasi peta yang ada digunakan, konfigurasi peta yang ditunjuk alias akan ditimpa dan konfigurasi peta yang ada akan dihapus dan referensi ke ID tersebut akan mengakibatkan kesalahan. Untuk informasi selengkapnya, lihat memetakan konfigurasi di artikel konsep.

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.

Cuplikan layar kotak dialog unggahan selesai di editor gaya visual memperlihatkan nilai untuk ID Gaya, ID konfigurasi Peta, dan alias konfigurasi peta.

Tip

Catat nilai alias konfigurasi peta, itu akan diperlukan saat Anda Membuat Instans Pengelola Dalam Ruangan objek Peta saat mengembangkan aplikasi di Azure Maps. Selain itu, catat ID Gaya, id gaya dapat digunakan kembali untuk tileset lainnya.

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.

Cuplikan layar memperlihatkan nama kategori kustom dalam manifes.

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.

Cuplikan layar memperlihatkan perbedaan lapisan yang muncul setelah mengubah nama kategori dalam manifes.

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.

Cuplikan layar tombol duplikat di panel lapisan di toolbar editor visual, bersama dengan ID lapisan yang menunjukkan nama lapisan baru yang sama dengan lapisan asli dengan salinan tanda hubung ditambahkan ke akhir.

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.

Cuplikan layar menu pop-up yang memperlihatkan lapisan baru muncul saat unit telepon 11 dipilih.

Langkah berikutnya