Angular-google-maps: Menambahkan jenis peta Gambar

Dibuat pada 15 Mei 2016  ·  35Komentar  ·  Sumber: SebastianM/angular-google-maps

Hai

Saya ingin menggunakan ubin khusus di peta google seperti contoh ini: https://developers.google.com/maps/documentation/javascript/examples/maptype-image

Saya mencoba membuat arahan baru seperti di bawah ini:
<sebm-google-map> <sebm-google-image-map-type [options]="mapImageOptions"></sebm-google-image-map-type> </sebm-google-map>

Saya hanya ingin memeriksa apakah ini pendekatan yang benar di mana semua opsi dan terkandung dalam komponen atau haruskah lebih verbose memiliki atribut untuk setiap properti?

Atau karena ini sebenarnya bukan komponen visual, seharusnya itu hanya layanan yang dimasukkan ke dalam komponen. (jadi dikonfigurasi melalui kode saja tanpa elemen html)

Apakah ada saran tentang pendekatan mana yang disempurnakan?

Terima kasih
Carl

stale feature-request

Komentar yang paling membantu

apakah fitur ini diperbarui di agm-maps?

Semua 35 komentar

Hai Carl,

Saya mencoba melakukan hal serupa, memuat beberapa overlay WMS khusus yang disajikan dari cluster MapServer eksternal, tetapi saya macet karena saya tidak tahu bagaimana mendapatkan referensi ke instance googleMap yang sebenarnya untuk menambahkan overlay saya ke overlayMapTypes koleksi).

Saya pikir perlu ada cara untuk mengakses instance peta google.map asli, dengan mengeksposnya melalui GoogleMapsAPIWrapper ?

Ini adalah pendekatan saya (sejauh ini)...di konstruktor MyComponent.ts

`var overlayMap = nol;

    // Getting a handle on the GoogleMaps api namespace
    if ((<any>window).google || (<any>window).google.maps) {
        const gm = (<any>window).google.maps;

        if (layers.length > 0) {
            var overlayMapOptions = {
                getTileUrl(coord, zoom) {
                    var url = this.loadBalanceWms() + "/mapserver.exe?Map=../mapfile/xxx.map";
                    url += "&mode=tile";
                    url += "&tile=" + coord.x + "+" + coord.y + "+" + zoom;
                    url += "&tilemode=gmap";
                    url += "&layers=" + layers; //WMS layers
                    url += "&WIDTH=256";
                    url += "&HEIGHT=256";
                    return url;

                },
                tileSize: new gm.Size(256, 256),
                isPng: true,
                name: "WMSOverlay"
            };
            overlayMap = new gm.ImageMapType(overlayMapOptions);

            // Breaks here
            this._mapsWrapper.getMap()
                .then(a => {
                        (<any>a).overlayMapTypes.push(overlayMap);
                    },
                    f => {
                        window.console.log(f);
                    });

        }

    };`

@anaratz Apakah itu berhasil seperti yang telah Anda lakukan ?? Untuk membuat peta kustom Ubin

Tidak, itu tidak berhasil...
...karena koleksi overlayMapTypes tidak ada pada antarmuka mapTypes.GoogleMap, saya juga tidak dapat menemukan cara untuk mengakses instance google.maps.Map yang mendasarinya

@anaratz jadi belum ada solusi untuk ini?

Tidak, belum

@anaratz Saya membuatnya berfungsi, tetapi saya hanya mengajukan pertanyaan di awal masalah ini tentang bagaimana menyusun kode saya, maka saya akan melakukan PR, haruskah saya melakukan PR dan melihat bagaimana kelanjutannya?

@ carl09 dapatkah Anda menunjukkan kepada kami bagaimana Anda memperbaikinya?

@carl09 ya tolong Carl.

Hai @smgjreinieren , @anaratz saya telah memperbarui PR saya dan membuat demo

http://plnkr.co/edit/OlljPTvgqdq0Na2lvZPN?p=preview

PR: https://github.com/SebastianM/angular2-google-maps/pull/345

umpan balik apa pun akan sangat bagus

@ carl09 apakah Anda juga membuatnya dalam TypeScript?

@smgjreinieren Ya, semuanya dilakukan dalam skrip ketik

@carl09 Ohhhh sekarang saya mengerti maaf! Kerja bagus! Terima kasih

Saya mengalami masalah dengan tugas " dentang: periksa ", saya hanya akan mencoba memperbarui simpul dari v4 ke v6 dan melihat apakah itu memperbaikinya, itu membuat Anda benar-benar tidak yakin saat mendorong perubahan

@ carl09 Tapi tidak ada jenis peta khusus?

@smgjreinieren saya menggunakan "Buka Peta Jalan" di plunker untuk menampilkan perubahan, apakah itu tidak berhasil untuk Anda, atau bukan itu yang Anda maksud?

Seperti contoh ini: https://developers.google.com/maps/documentation/javascript/examples/maptype-image-overlay

Saya baru saja melihat pertanyaan Anda yang lain, jadi saya mengerti apa yang Anda maksud sekarang

@ carl09 Saya ingin menetapkan gambar sendiri sebagai jenis Peta, adalah "Buka Peta Jalan" Gambar yang membuat jenis peta khusus

@smgjreinieren apakah Anda memiliki gambar berkode geografis? atau hanya file gambar standar?

Anda dapat menggunakan alat seperti http://www.qgis.org/en/site/ yang mana dan gambar kode geo, dan juga membuat ubin sehingga Anda dapat menggunakannya untuk peta google

@carl09 Hmm sepertinya saya tidak bisa menggunakannya! Bisakah Anda mengonversi gambar untuk saya?

Dan mengapa pengaturan dasar Anda atau mengenali MapTypeId dari 'angular2-google-maps/core'? Mungkin karena tidak memiliki inti yang saya lihat, tetapi bagaimana cara mengimpornya daripada dari pengaturan Anda: https://github.com/carl09/angular2-google-maps-example

Hai @smgjreinieren Saya memperbarui kode sampel saya di repo itu jika Anda ingin memperbaruinya.
editnya pake editor apa? saya menggunakan Kode VS dan sepertinya mengetahui referensi jika itu membantu

@carl09 Terima kasih sobat! Tapi masih tidak bisa membuat qgis bekerja untuk mac! Bisakah saya mengirimkan gambarnya kepada Anda, itu hanya sebagian kecil dari peta dunia, apakah itu juga mungkin?

Seperti ini: http://postimg.org/image/6okpwebsb/

@ carl09 apakah mungkin menggunakan gambar dari folder lokal? alih-alih online

Hai

Ya Anda bisa, Anda dapat meng-host mereka di instance node Anda, sama seperti Anda meng-hosting file css dan js Anda, tetapi saya kira Anda juga bisa menggunakan file:// dan mengarahkannya secara lokal, tetapi tidak yakin seberapa baik ini akan bekerja

Apakah mungkin untuk menonaktifkan DefaultUI di konstruktor? Karena tidak mengenalinya seperti ini:

constructor(){ this.imageMapOptions = { getTileUrl: (coord: ImageMapTypeCoord, zoom: number) => { return http://www.sylvanreinieren.com/tiles/ ${zoom}/${coord.x}/${coord.y}.png }, tileSize: { height: 256, width: 256 }, maxZoom: 16, minZoom: 12, radius: 1738000, name: 'linZ', disableDefaultUI: true, alt: 'LINZ Topo Maps' }; }

Ada kemajuan pada fitur ini? Saya baru saja mulai melihat angular2-google-maps beberapa hari yang lalu dan sepertinya itu akan menyelesaikan apa yang ingin saya tambahkan di aplikasi saya, tetapi saya benar-benar perlu mengganti peta Google Maps dengan beberapa peta yang lebih detail dari bahasa Norwegia " Kartverket".

@ carl09 maaf atas jawaban yang terlambat ... begitu banyak yang harus dilakukan saat ini. Agar konsisten dengan elemen lain, kita harus menggunakan atribut terpisah yang dapat Anda ikat, jadi tidak ada [opsi] tunggal. Apakah Anda baik-baik saja dengan itu?

+1 benjolan, akan senang menggunakan fitur ini

Apakah fitur lapisan WMS khusus ini telah dimasukkan ke dalam AGM baru?

Jadi tidak ada cara untuk mengambil gambar dari URL dan menampilkannya di peta?

@sneckelmann kami telah mencoba banyak tetapi pada akhirnya sekarang menggunakan svgs yang disandikan dasar untuk spidol .. bukan solusi terbaik tetapi berhasil

apakah fitur ini diperbarui di agm-maps?

@SebastianM
Sama seperti plunkr ini
http://plnkr.co/edit/OlljPTvgqdq0Na2lvZPN?p=preview

apakah overlay peta diimplementasikan di AGM?

@ carl09 ketika saya mengganti openstreetmap dengan openweathermap API, ubinnya menggantikan ubin peta. Bisakah kita mengubah ubin itu?

Saya ingin menerapkan hal semacam itu dengan AGM

https://jsfiddle.net/601oqwq2/221/

@SebastianM fitur ini tertunda untuk waktu yang lama, dapatkah kami mendapatkan ide tentang referensi instance google map internal, sehingga kami dapat melakukan setidaknya beberapa solusi hingga fitur tersebut mendapat pembaruan dari pihak Anda?

Saya menemukan sesuatu di #1423, biarkan saya juga memikirkan sesuatu ;P

@SebastianM
Solusi solusi untuk skenario di atas

https://github.com/er-shrey/AGM-Openweather-Integration

@carl09 lihat di atasnya

Saya pikir permintaan fitur harus ditutup karena ada solusi sederhana untuk itu.

Masalah ini secara otomatis ditandai sebagai basi karena tidak ada aktivitas terbaru. Ini akan ditutup jika tidak ada aktivitas lebih lanjut yang terjadi. Terima kasih atas kontribusi Anda.

Apakah halaman ini membantu?
0 / 5 - 0 peringkat