Peta imej dinamik berdasarkan warna piksel

Butir artikel ini bagaimana untuk membuat peta imej dinamik menggunakan warna piksel, menawarkan alternatif yang cepat dan fleksibel kepada peta imej tradisional. Kaedah ini mengelakkan batasan kawasan bersaiz tetap dan membolehkan apa-apa bentuk atau saiz.

Kelebihan utama:

• apa -apa bentuk atau saiz yang mungkin.
• Kesederhanaan: Tidak perlu mengetahui kawasan imej mana yang sesuai dengan pautan yang mana.

Bagaimana ia berfungsi: src = "https://img.php.cn/upload/article/000/000/000/1741622265246661.jpg" alt = "peta imej dinamik berdasarkan warna piksel"/ Koordinat dihantar ke skrip PHP melalui Ajax.

Skrip PHP mengambil warna piksel pada koordinat tersebut. Pelaksanaan:

Penyelesaian ini memerlukan tiga komponen: imej, pangkalan data, dan kod. Img src = "https://img.php.cn/upload/article/000/000/000/1741622265497198.jpg" alt = "peta imej dinamik berdasarkan warna piksel"/ Komponen. ev.pagey -y; function(data){ //alert(data); if (data != '') { //alert(data " " "x=" mouseX " y=" mouseY); window.location.replace(data); //load the url of the clicked country } else { //alert("no data"); } }); }); });

PHP:

 if (isset ($ _ request ['x'])) {$ x = $ _Request ['x']; $ y = $ _request ['y']; $ im = imageCreatefrompng ($ domain. "/Images/WorldMap-coloured.png"); $ rgb = ImageColorat ($ im, $ x, $ y); $ r = ($ rgb & gt; & gt; 16) & amp; 0xff; $ g = ($ rgb & gt; & gt; 8) & amp; 0xff; $ b = $ rgb & amp; 0xff; fungsi rgb2html ($ r, $ g = -1, $ b = -1) {// ... (fungsi tetap tidak berubah) ...} $ hex = rgb2html ($ r, $ g, $ b); $ debug = ("r". $ r. "g". $ g. "b". $ b. "hex =#". $ hex); $ html = ""; $ qry = "Pilih negara dari` negara` di mana hex_colour = '". $ hex."' had 1; "; jika (mysqli_query ($ conn, $ qry)) {// Gunakan mysqli dan bukannya mysql $ result = mysqli_query ($ conn, $ qry); sementara ($ row = mysqli_fetch_assoc ($ hasil)) {$ country_filename = convertToFileName ($ row ['country']); $ html = $ domain. "/". $ country_filename. "/"; $ debug. = "". $ country_filename; }} mysqli_close ($ conn); // Tutup sambungan mysqli echo $ html; }? & gt; 

NOTA: Kod PHP telah dikemas kini untuk menggunakan MySQLI untuk interaksi pangkalan data, menggantikan fungsi yang tidak disengajakan. Pastikan anda mempunyai sambungan pangkalan data yang ditubuhkan ( $ conn ).

Hasil akhir: Peta imej dinamik yang dihasilkan.

Pendekatan ini menawarkan manfaat untuk reka bentuk responsif, SEO (melalui teks Alt dan atribut tajuk), dan pengoptimuman prestasi (caching dan mampatan imej). Bahagian Soalan Lazim memberikan butiran lanjut mengenai pengendalian ralat dan teknik pengoptimuman.

Atas ialah kandungan terperinci Peta imej dinamik berdasarkan warna piksel. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!