Heim >Web-Frontend >js-Tutorial >Dynamische Bildkarte basierend auf Pixelfarbe
In diesem Artikel wird beschrieben, wie Sie eine dynamische Bildkarte mit Pixelfarbe erstellen und eine schnelle und flexible Alternative zu herkömmlichen Bildkarten bieten. Die Methode vermeidet die Einschränkungen von Bereichen mit fester Größe und ermöglicht eine beliebige Form oder Größe. Jede Form oder Größe ist möglich.
code: Die folgenden Code -Codes.
jQuery:
jQuery (Dokument) .ready (Funktion ($) {$ ('#theworldmapimage'). on ('click', function (ev) {var x = $ (this) .Offset (). // x Achse erorr Margin // MOusey -= 5; // alarm (Daten); <pre class="brush:php;toolbar:false"> if (isset ($ _ _ request ['x'])) {$ x = $ _Request ['x']; $ y = $ _Request ['y']; $ im = imperiencecreatfrompng ($ domain. "/Images/weltmap-farbig.png"); $ rgb = imageColorat ($ im, $ x, $ y); $ r = ($ rgb & gt; & gt; 16) & amp; 0xff; $ g = ($ rgb & gt; & gt; 8) & amp; 0xff; $ B = $ RGB & amp; 0xff; Funktion rgb2html ($ r, $ g = -1, $ b = -1) {// ... (Funktion bleibt unverändert) ...} $ hex = rgb2html ($ r, $ g, $ b); $ debug = ("r". $ r. "g". $ g. "B". $ b. "hex =#". $ hex); $ html = ""; $ qry = "Länder aus` Ländern "wobei hex_colour = '". $ hex. "' Limit 1;"; if (mysqli_query ($ conn, $ qry)) {// Verwenden Sie MySQLi anstelle von veralteten MySQL $ result = mySQLI_Query ($ conn, $ qry); while ($ row = mysqli_fetch_assoc ($ result)) {$ country_filename = convertToFileName ($ row ['Country']); $ html = $ domain. "/". $ country_filename. "/"; $ debug. = "". $ Country_FileName; }} mysqli_close ($ conn); // Schließen Sie die MySQLi -Verbindung echo $ html; }? Stellen Sie sicher, dass Sie eine Datenbankverbindung erstellt haben (<code> $ conn </code>). <img src="https://img.php.cn/upload/article/000/000/17416265695701.jpg" alt="Dynamische Bildkarte Basierend auf Pixel Color">
Sehen Sie sich eine beliebige Dynamik. Land).
Dieser Ansatz bietet Vorteile für reaktionsschnelles Design, SEO (durch Alt -Text- und Titelattribute) und Leistungsoptimierung (Caching und Bildkomprimierung). Der FAQS -Abschnitt enthält weitere Details zu Fehlerbehandlungs- und Optimierungstechniken.
Das obige ist der detaillierte Inhalt vonDynamische Bildkarte basierend auf Pixelfarbe. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!