Seperti apa kartu online? Bagaimana cara mengetahui alamat server kartu yang Anda minati? Bagaimana cara membuat file pengaturan yang memungkinkan navigator di smartphone terhubung ke peta ini?
Konten:
1 - Pendahuluan. Peta raster standar
2 - Lanjutan. Menulis rasterizer sederhana untuk peta vektor
3 - Kasus khusus. Kami menghubungkan kartu OverpassTurbo
Entri
Di antara aplikasi navigasi untuk smartphone, ada yang dirancang untuk pariwisata dan semua jenis kegiatan pinggiran kota. Di antara yang paling terkenal adalah OsmAnd, Locus dan GuruMaps. Semuanya dibedakan oleh sejumlah besar fungsi khusus yang dapat berguna di sepanjang jalan. Dan juga jumlah yang lebih besar dari semua jenis pengaturan (terkadang sangat membingungkan). Tapi sekarang kami paling tertarik pada satu hal: kemampuan untuk menambahkan kartu tambahan dan dengan cepat beralih di antara mereka.
Saya perhatikan bahwa ini adalah fitur yang sangat berguna. Lagi pula, satu dan area yang sama dari suatu medan dapat digambarkan dengan sangat berbeda pada peta-peta dari tipe yang berbeda . Dan karena itu, sebelum mengatasi daerah-daerah yang sulit, ada baiknya untuk memeriksa masing-masing. Namun, jika untuk ini diperlukan untuk menjalankan beberapa aplikasi terpisah pada smartphone, ini akan sangat merepotkan. Performa memburuk, dan baterai dikonsumsi lebih cepat. Jadi, sangat bagus bahwa ada peluang untuk bertahan hanya dengan satu aplikasi: semacam agregator kartografi dengan antarmuka yang nyaman yang dirancang khusus untuk pergantian cepat antar kartu.
Jadi disini. Sebagai aturan, menambahkan kartu baru relatif sederhana. Folder aplikasi memiliki subfolder dengan preset . Yaitu, dengan menyimpan file, di mana pengaturan untuk mengunduh kartu tertentu ditunjukkan. Mari kita lihat apa itu.
Saya perhatikan bahwa untuk semua aplikasi, preset kurang lebih sama. Jadi, sebagai contoh, kami akan mempertimbangkan GuruMaps, karena itu baik untuk Android dan iOS. Jadi, mari kita bayangkan bahwa kita masuk ke folder dengan preset-nya, menemukan ada file bernama openstreetmaps.ms , dan kemudian membukanya menggunakan editor teks biasa.
<?xml version="1.0" encoding="UTF-8"?> <customMapSource> <name>OpenStreetMaps</name> <minZoom>0</minZoom> <maxZoom>18</maxZoom> <url>http://{$serverpart}.tile.openstreetmap.org/{$z}/{$x}/{$y}.png</url> <serverParts>ab c</serverParts> </customMapSource>
Bahkan, kami hanya memiliki daftar beberapa nilai. Mari kita pertimbangkan mereka secara berurutan:
name - Nama peta yang akan ditampilkan dalam aplikasi
minZoom - Dari level zoom berapa peta ini akan ditampilkan
maxZoom - Hingga tingkat zoom apa yang akan ditampilkan peta ini
url - Templat untuk mengakses file peta
serverParts - Jika server tempat file peta disimpan memiliki beberapa mirror, maka Anda perlu mencantumkan namanya
Sebelum pindah, saya perhatikan bahwa untuk penyimpanan di server, kartu besar dipecah menjadi potongan-potongan kecil. Biasanya ini adalah gambar png dengan ukuran 256x256 piksel. Fragmen-fragmen ini disebut ubin .
Sekarang mari kita melihat lebih dekat pada template url.
http://{$serverpart}.tile.openstreetmap.org /{$z}/{$x}/{$y}.png
Navigator secara otomatis mengganti kata-kata dalam kurung kurawal dengan "koordinat" fragmen peta yang saat ini diperlukan. Inilah yang tepatnya akan diganti untuk bertopik:
{$ serverpart} - Salah satu nilai serverParts akan diganti di sini.
{$ z} - Level zoom tempat Anda ingin mengunduh fragmen peta
{$ x} - Jumlah horisontal fragmen peta
{$ y} - Jumlah fragmen peta secara vertikal
Setelah mengganti nilainya, navigator akan menerima tautan, yang kemudian mengunduh file dengan fragmen peta yang diperlukan. Sebagai contoh, ini:
http://a.tile.openstreetmap.org /12/2478/1265.png
Saat unduhan selesai, ubin yang diunduh akan ditampilkan di layar ponsel cerdas.
Tambahkan kartu Anda
Jadi, katakanlah Anda menemukan di Internet kartu yang menarik bagi Anda dan bahwa Anda benar-benar ingin terhubung ke ponsel cerdas Anda. Ayo kita coba. Pertama, menggunakan browser di komputer Anda, buka situs dengan jendela untuk melihat peta ini. Misalnya yang ini .
Buka panel dengan alat pengembang (Ctrl + Alt + I untuk Google Chrome)
Di panel yang terbuka, buka tab Sumber.
Kami membuka semua folder secara berurutan sampai kami menemukan folder dengan gambar irisan peta yang ditampilkan.
Klik kanan pada nama file. Di menu yang terbuka, pilih Salin alamat tautan
Misalnya, kami mendapat tautan seperti itu
http://anygis.herokuapp.com/Combo_Best_Genshtab/1242/639/11
Anda perlu memahami apa sebenarnya angka-angka ini. Kami memeriksa dari kartu referensi kami - OpenStreetMaps.
http://a.tile.openstreetmap.org/1242/639/11.png
Tidak memuat. Mari kita coba menukar angkanya.
http://a.tile.openstreetmap.org/11/1242/639.png
Dimuat! Sekarang bandingkan ubin yang diperoleh dengan tautan pertama dan kedua:
Kami memastikan bahwa ubin kedua kartu ini menunjukkan tempat yang sama. Dan yang paling penting, tidak ada offset. Jadi peta yang kami temukan dibuat dalam proyeksi standar dan cocok untuk koneksi.
Nah, dan sekarang, mengetahui dalam urutan apa koordinat OpenStreetMaps berjalan - z, x, y - kita dapat dengan yakin mengatakan di mana mereka pergi di peta kita.
http://anygis.herokuapp.com/Combo_Best_Genshtab/{$x}/{$y}/{$z}
Sekarang perbesar dan perkecil peta di viewport. Jadi kami mengetahui bahwa kartu hanya dimuat dari zoom 0 dan 15.
Lebih lanjut, jika url dimulai dengan satu huruf atau angka, maka akan mungkin untuk mengganti nilai-nilai lain di sana. Tetapi biasanya ada a, b, c atau 0,1,2,3 .
Jadi, sekarang kami telah menemukan semua parameter yang diperlukan dan dapat membuat preset untuk peta baru kami.
<?xml version="1.0" encoding="UTF-8"?> <customMapSource> <name>. </name> <minZoom>0</minZoom> <maxZoom>15</maxZoom> <url>http://anygis.herokuapp.com/Combo_Best_Genshtab/{$x}/{$y}/{$z}</url> </customMapSource>
Tetap menyimpan file dengan nama baru dan menambahkannya ke aplikasi navigasi Anda. Untuk iOS - cukup seret dan jatuhkan file ke folder aplikasi (via iTunes). Untuk Android - salin file ke direktori berikut:
Android\data\com.bodunov.GalileoPro\files\Imported
Sekarang, ketika Anda membuka navigator, apa yang telah Anda lakukan muncul di daftar peta. Selamat!
Seperti yang Anda lihat, itu sangat sederhana. Dan yang terbaik dari semuanya, seluruh prosesnya kurang lebih sama untuk semua navigator di atas. Cepat, serbaguna, lintas platform.
Tentu saja, ada kartu dalam proyeksi non-standar. Atau dengan penomoran non-standar. Pada artikel ini, saya menjelaskan cara mengatasi masalah ini. Namun demikian, sebagian besar kartu yang ditemukan di Internet terhubung dengan mudah dan tanpa masalah tambahan.
Ngomong-ngomong, di situs web AnyGIS saya, Anda dapat mengunduh preset yang sudah jadi. Mereka secara otomatis dihasilkan dalam format semua navigator di atas berdasarkan database yang saya kumpulkan. Dan diperbarui secara berkala. Jadi, jika perlu, unduh dan gunakan.
Nah, sudah berakhir dengan pengantar. Pada artikel selanjutnya saya akan memberi tahu Anda cara menghubungkan peta online vektor.