Buat peta interaktif tanpa server

8

Saya telah berhasil membangun aplikasi pemetaan web yang bagus menggunakan ubin yang dibuat dari GeoWebCache dan kisi-kisi kustom, tetapi sekarang saya perlu menambahkan overlay ke peta dasar. Satu-satunya interaktivitas yang saya butuhkan adalah jendela informasi pop-up sederhana yang hanya berasal dari salah satu atribut.

Secara default dataset overlay adalah ESRI Shapefile yang 180Mb, sejak itu saya berhasil menyederhanakan dataset menggunakan ST_SimplifyPreserverTopology yang telah menurunkan ukuran ESRI Shapefile ke 28Mb. Namun, sebagai file GeoJSON ini masih 78Mb yang terlalu besar.

Saya kemudian mencoba CartoDB dan memuat data ke dalam tabel dan kemudian menambahkan vectorlayer di openlayers tetapi volume data masih terlalu besar dan halaman HTML macet.

Saya kemudian mencoba GIS Cloud dan WMS eksternal tetapi itu terbatas pada WGS84 dan tidak memiliki opsi info fitur.

Saya kemudian mulai melihat Topojson yang menurut saya akan bekerja dengan sangat baik pada dataset saya tetapi saya tidak berpikir ada cara untuk memuat topojson ke peta di OpenLayers 2.12 yang perlu saya gunakan.

Pilihan saya yang lain adalah UTF-Grid, jadi saya memuat data ke tilemill dan mengekspor MbTiles yang bisa saya ekstrak menggunakan mbutil. Tetapi tentu saja UTF-Grid hanya mendukung EPSG: 3857 (web mercator) yang berbeda dari proyeksi saya, EPSG: 27700. Jadi semua file .json diberi nama berbeda dari ubin cache yang mendasari saya dari geowebcache.

Apakah ada cara untuk membuat Grid-UTF tetapi dalam proyeksi yang berbeda?

Jadi itulah latar belakangnya dan saya merasa telah mencoba sebagian besar opsi yang saya tahu.

Jadi secara sederhana saya memerlukan lapisan overlay interaktif dalam peta OpenLayers 2.12 tetapi saya tidak dapat menggunakan server seperti GeoServer / Mapserver atau TileStache dll dan saya tidak dapat memiliki skrip sisi server seperti PHP.

Adakah yang bisa menawarkan saran lain ??

Terima kasih

— tjmgis
sumber

topojson akan bekerja dengan baik dengan openlayers 2.10 (Anda benar-benar mengkonversi topojson ke geojson sebelum menggunakannya). Tapi itu tidak akan menyelesaikan masalah Anda karena masih akan terlalu besar untuk diproses di sebagian besar browser.

— johanvdw

coba d3js bl.ocks.org/mbostock/4965422 797M shapefile untuk area tabulasi kode pos nasional. Disederhanakan menggunakan TopoJSON (dengan -q 1e5 -s 3e-7)

— Mapperz

@Mapperz yang merupakan pengurangan ukuran yang mengesankan. Bisakah topojson berada dalam proyeksi yang berbeda dari mercator bola?

— tjmgis

@ johanvdw apakah Anda memiliki contoh topojson yang dimuat ke openlayers?

— tjmgis

Projection TopoJSON bl.ocks.org/mbostock/5557726

— Mapperz

3

Memperluas komentar asli saya:

Topojson dapat bekerja dengan baik dengan openlayers 2.10 (Anda benar-benar mengkonversi topojson ke geojson sebelum menggunakannya). Tapi saya tidak yakin itu akan menyelesaikan masalah Anda karena mungkin masih terlalu besar untuk diproses di sebagian besar browser. Contoh menggunakan topojson di openlayers 2, berdasarkan contoh openlayers geojson dan beberapa data yang saya gunakan dalam posting blog .

http://www.gisky.be/cyclists/ol-topojson.html

Bit aktual yang penting hanyalah baris kedua:

    $.getJSON('http://www.gisky.be/cyclists/f.json', function (data) {
        fusiegem = topojson.feature(data, data.objects.fusie);
        var geojson_format = new OpenLayers.Format.GeoJSON();
        var vector_layer = new OpenLayers.Layer.Vector();
        map.addLayer(vector_layer);
        vector_layer.addFeatures(geojson_format.read(fusiegem));
    });

Baris ini membangun objek geojson (fusiegem) dari objek data yang topojson.

— johanvdw
sumber

@johanvwd gagal menggunakan D3 dan topojson akan memberikan contoh. Banyak terima kasih telah menambahkan kode

— tjmgis

@ johanvwd Saya mengubah kode Anda dan berhasil membuatnya bekerja tetapi sangat lambat bahkan pada topojson dari 1.4Mb, apalagi yang perlu digunakan yaitu 8Mb. Ada pemikiran lain ??

— tjmgis

Saya kira satu-satunya hal yang tersisa untuk dilakukan adalah melakukan lebih banyak generalisasi pada skala ikhtisar dan bekerja dengan ubin untuk skala yang lebih rendah. Namun, saya tahu tidak ada alat untuk melakukan pekerjaan itu. Saya yakin mereka akan muncul dalam waktu dekat atau mungkin sudah ada.

— johanvdw

1

Ini terdengar seperti pekerjaan untuk D3 - http://bl.ocks.org/mbertrand/5218300

— ChrisInCambo
sumber

Bagaimana D3 membantu memecahkan masalah?

— johanvdw

@ChrisInCambo - terima kasih banyak untuk contoh yang tidak persis seperti apa yang saya kejar tetapi telah berjuang untuk mendapatkan D3 dan topojson saya berfungsi, jadi kirimkan pertanyaan yang berbeda

— tjmgis

Kesalahan umum dengan TopoJSON adalah tidak melihat ke dalam JSON dan memahami strukturnya ketika menggunakannya dengan D3. Jika Anda menyalin kode contoh dan mengganti TopoJSON mereka dengan kode Anda, Anda perlu memastikan bahwa objek yang dirujuk dalam TopoJSON benar-benar ada di JSON Anda juga.

— ChrisInCambo

1

Anda bisa membagi data ke file GeoJSON dan menamainya menurut ubin. Setelah peta dimuat, Anda dapat meminta ubin yang terlihat dan menggunakan nama / url / koordinatnya untuk meminta file GeoJSON yang sesuai, mencocokkan satu file per ubin.

Bagian yang sulit adalah membuat file. Untuk ini, Anda pasti perlu menggunakan alat. Setelah file dibuat, mereka dimuat sesuai kebutuhan dan dalam potongan kecil sehingga mereka tidak akan membanjiri browser. Rasa sakit lain di sini adalah berurusan dengan level zoom. Anda harus memutuskan fitur mana yang terlihat dari level mana dan membuat file Anda sesuai.

— bstempi
sumber