当前位置：首页 > news >正文

网站自定义错误页面模板石家庄关键词排名提升

news 2025/7/18 23:13:21

网站自定义错误页面模板,石家庄关键词排名提升,免费图片素材网站推荐,做算法题网站因此，今天我创建了一个html图像映射，该映射根据用户单击的像素的颜色创建动态链接。之所以创建它，是因为该地图是世界的矢量地图，并且您知道所有国家/地区的尺寸都不同，因此无法创建基于法线/点的图像地图……存储和…

因此，今天我创建了一个html图像映射，该映射根据用户单击的像素的颜色创建动态链接 。之所以创建它，是因为该地图是世界的矢量地图，并且您知道所有国家/地区的尺寸都不同，因此无法创建基于法线/点的图像地图……存储和存储起来太大了。加载时间太长。

此方法的专业人士

加载速度非常快
无需知道链接的内容覆盖了图像的哪些区域
图像区域可以是任何形状或大小

怎么运行的

dynamic-image-map-process

用户单击图像上的任何位置
jQuery捕获用户单击位置的x和y坐标
通过Ajax发送到PHP控制脚本的x和y坐标
PHP脚本在本地获取图像，并在x和y坐标处选择像素颜色
PHP脚本获取与十六进制颜色值匹配的国家
PHP脚本发回该国家/地区的页面网址
jQuery重定向到通过Ajax调用返回的页面

有关如何设置的说明：

创建具有唯一十六进制值的图像（我将Adobe illustrator与基于免费矢量的图像一起使用）。

vector-map-illustrator

存储数据库中每个国家/地区范围内包含的像素的十六进制颜色值。

database-hex-codes

jQuery代码：

jQuery(document).ready(function($) {$('#theworldmapimage').live('click', function(ev) {var X = $(this).offset().left;var Y = $(this).offset().top;mouseX = ev.pageX - X;mouseY = ev.pageY - Y;//FIX X AXIS ERORR MARGIN//	mouseY -= 5;if (mouseX > 500) { mouseX -= 13; }//alert("x="+mouseX+" y="+mouseY);$.get("../php/php-functions/phpfunc-imagemap.php",{x: mouseX ,y: mouseY}, 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代码：

< ?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 >> 16) & 0xFF;$g = ($rgb >> 8) & 0xFF;$b = $rgb & 0xFF;function rgb2html($r, $g=-1, $b=-1){if (is_array($r) && sizeof($r) == 3)list($r, $g, $b) = $r;$r = intval($r); $g = intval($g);$b = intval($b);$r = dechex($r<0?0:($r>255?255:$r));$g = dechex($g<0?0:($g>255?255:$g));$b = dechex($b<0?0:($b>255?255:$b));$color = (strlen($r) < 2?'0':'').$r;$color .= (strlen($g) < 2?'0':'').$g;$color .= (strlen($b) < 2?'0':'').$b;return $color;}$hex = rgb2html($r, $g, $b);//echo ("R".$r." G".$g." B".$b."  hex=#".$hex);$debug = ("R".$r." G".$g." B".$b."  hex=#".$hex);$html = "";$qry = "SELECT country FROM `countries` WHERE hex_colour= '".$hex."' LIMIT 1;";if (mysql_query($qry)) {$result = mysql_query($qry);while ($row = mysql_fetch_array($result,MYSQL_ASSOC)){$country_filename = convertToFileName($row{'country'});$html = $domain."/".$country_filename."/";$debug .= " " . $country_filename;}}mysql_close($dbh);echo $html;
}
?>

最终图像如下所示：

worldmap