Hasilkan ubin untuk hamparan peta google

Saya mencoba menampilkan beberapa informasi di Google Maps yang akan berbentuk lapisan lingkaran tembus cahaya. Masalahnya adalah bahwa beberapa lingkaran tumpang tindih, yang menghasilkan peningkatan opacity dan campuran warna jika lingkaran memiliki warna yang berbeda. Saya mencari banyak dan sampai pada kesimpulan bahwa tidak ada cara yang mungkin untuk menghindari pencampuran warna.

Solusi alternatif yang saya rekomendasikan adalah membuat ubin png di server saya dan menampilkannya atau memutuskan warna setiap piksel di sisi server dan menggunakan kanvas HTML5 dan membuat setiap piksel. Saya banyak mencari tetapi tidak menemukan cara untuk melakukannya. Akan sangat membantu jika seseorang bisa mengarahkan saya ke arah yang benar.

Saya mengulangi pertanyaan saya di bawah ini agar lebih jelas dan ringkas

Saya harus menampilkan lingkaran di peta. Radius dan warna lingkaran ini menggambarkan wilayah pengaruh dan jenis pengaruhnya. Lingkaran-lingkaran ini tembus tetapi tumpang tindih hanya akan menghasilkan yang teratas yang terlihat tanpa campuran. Bagaimana cara menghasilkan ubin untuk informasi ini?

Mungkin saya tidak jelas jadi saya menambahkan rincian lebih lanjut.

Periksa jsFiddle ini http://jsfiddle.net/Dv4UT/ . Ada dua lingkaran hijau yang tumpang tindih (zIndex: 10) dan merah (zIndex: 11) dengan opacity .5. Bagian yang tumpang tindih adalah campuran merah dan hijau saat aku mau bagian yang tumpang tindih menjadi atas warna dengan opacity yang sama yaitu: merah. Jika ini dimungkinkan menggunakan overlay peta maka itu akan menjadi besar. akhirnya saya harus kembali menghasilkan ubin di sisi server dan menggunakannya sebagai overlay. Saya tidak punya ide untuk membuat ubin dan itu akan sangat membantu, jika seseorang bisa mengarahkan saya ke arah yang benar. Saya memasang tangkapan layar dari trulia commute map, periksa apakah lingkaran di bawah ditimpa oleh yang teratas. Saya membutuhkan visualisasi yang serupa.

contoh gambar

— arun chaudhary
sumber

Sudahkah Anda mencoba menggunakan CartoDb? www.cartodb.com

— EZMapdesign

Diperiksa. Itu tidak akan menyelesaikan masalah saya. Saya tidak dapat menemukan cara apa pun di sana untuk menghasilkan ubin.

— arun chaudhary

jadi lingkaran dengan opacity akan selalu memadukan warna? Anda dapat mengontrol opacity untuk setiap lingkaran - jsfiddle.net/8GaZ5/1 gmaps v3

— Mapperz

Terima kasih Mappers atas waktu Anda. Saya pikir saya tidak jelas sehingga saya telah menambahkan rincian lebih lanjut untuk pertanyaan ini . Periksa jsfiddle jsfiddle.net/Dv4UT ini . Bagian yang tumpang tindih berwarna coklat dan saya mencoba untuk menghindari hal itu. Saya ingin bagian yang tumpang tindih dengan warna lingkaran di atas yaitu: merah dalam kasus ini.

— arun chaudhary

Jawaban:

buat overlay offline (tetapi dinamis) menggunakan bahasa pemrograman yang Anda pilih. itu akan sedikit rumit tetapi kode pseudo dasar adalah:

browser javascript send request url for overlay
acquire gis bounds for tile server side
gather all points and sort by their relevance
create image(transparent)
for each point: (least relevant first)
   draw new circle (will 'overwrite' any overlap areas)
stream image to browser
display image as overlay

tergantung pada seberapa besar area Anda, Anda dapat membuat raster offline dan kemudian menyajikannya dengan server peta atau program pengiriman pemetaan gratis lainnya. membuat raster Anda sendiri akan memastikan tampilan sesuai keinginan Anda.

— pengguna1269942
sumber

Saya akan melakukan hal berikut:

Pertahankan opacity lingkaran sangat rendah (jadi masalah blending jangan menjadi arus utama)
Pada mouse melayang-layang, ubah opacity untuk mengatasinya dari lingkaran berpotongan

Dengan cara ini, saya akan dapat menampilkan data tanpa campur tangan yang diinduksi gangguan warna utama dan menyoroti lingkaran tertentu saat pengguna melayang di atasnya.

— ujjwalesri
sumber

Itu tidak akan berhasil. Pertama di beberapa tempat sebanyak 10 lingkaran mungkin berpotongan. Lingkaran kedua mungkin dari warna yang berbeda yaitu: lingkaran hijau yang tumpang tindih dengan lingkaran merah. .Mouse melayang tidak akan menyelesaikan apa pun karena pencampuran hanya terjadi pada bagian yang tumpang tindih daripada seluruh lingkaran.

— arun chaudhary