PHP MySQL 图片点击计数器

PHP MySQL image hit counter

我是 PHP 的新手,一直在研究点击计数器。点击计数器很好用,但现在我想将数字转换成图像。

我创建了 12 张图片 0-9,一张间隔图片和一张逗号图片。

我四处搜索以寻找将数字格式转换为图像需要做什么的提示,但没有成功。到目前为止,我所发现的只是如何仅使用文件 PHP/MySQL 制作基本的点击计数器,以及如何使用 PHP/MySQL.

显示加密图像

所以问题是: 我如何告诉给定的代码显示图像来代替每个数字?

当前 PHP 结果示例:命中:2,435

我想让我的PHP得到总点击数(例子)然后把2,435替换成下面的代码:

<img src="img/2.png"><img src="img/comma.png"><img src="img/4.png"><img src="img/3.png"><img src="img/5.png">


注意:我在此处显示的代码中使用了很多注释。这样,任何新编码人员都可以更轻松地理解正在显示的脚本。我会在这个 post 的底部添加我的 final/completed 代码,这样当我找到解决方案时每个人都可以看到最终产品。
此代码作为文本点击计数器完全虚构

// Begin open SQL connection to database
$concount = mysqli_connect("site","username","password","database");
// End connection to database

// Begin update number of hits
mysqli_query($concount,"UPDATE counter SET hits = hits + 1");
// End update number of hits

// Begin get number of hits
$hits = ("SELECT SUM(hits) FROM counter");
// End get number of hits

// Begin show number of hits
$result = mysqli_query($concount,$hits);
while($row = mysqli_fetch_array($result)) {
  echo "Hits:&nbsp;" . number_format((float)$row['0']) . "&nbsp;";
}
// End show number of hits

// Begin close SQL connection
mysqli_close($con);
// End close SQL connection


编辑:下面是我的代码的最终结果。 请注意,此脚本中的数组在图像数组的开头和结尾放置了一个 '。 (参见以下示例)

Array ( [0] => ' [1] => 2 [2] => 4 [3] => 3 [4] => 5 [5] => ' )

所以除非我想在我的点击计数器的以太端有一个损坏的图像,否则我必须使用它们。我将我已经计划在两端使用的透明图像重命名为 '.png(参见以下示例)

<img src="img/'.png"><img src="img/2.png"><img src="img/4.png"><img src="img/3.png"><img src="img/5.png"><img src="img/'.png">


最终代码 此代码作为图像点击计数器完全虚构

// Begin open SQL connection to database
$concount = mysqli_connect("site","username","password","database");
// End connection to database

// Begin update number of hits
mysqli_query($concount,"UPDATE counter SET hits = hits + 1");
// End update number of hits

// Begin get number of hits
$hits = ("SELECT SUM(hits) FROM counter");
// End get number of hits

// Begin assign $hits an id
$result = mysqli_query($concount,$hits);
while($row = mysqli_fetch_array($result)) {
$totalhits=("'" . $row[0] . "'");
}
// End assign $hits an id

// Begin get id for number of hits, split the string into array, and assign id to numbers
$arr = str_split($totalhits);
$numbers = $arr;
foreach ($numbers as $value) {
// End get id for number of hits, split the string into array, and assign id to numbers

// Begin show number of hits as images
    echo "<img src=\"img/".$value.".png\">";
} 
// End show number of hits as images

// Begin close SQL connection
mysqli_close($con);
// End close SQL connection


最后说明: 我还没有尝试为更大的数字添加逗号或删除数组上的 apostrophe。如果我这样做,我会回来编辑这个。

您可以使用str_split($str)将字符串转换为字符数组。 接下来,您可以使用简单的 forforeach 循环对它们进行迭代。

编辑:

如何可视化图像有几个选项。 您可以只使用 html <img src=''> 标签或 CSS。

如果您使用 CSS,那么您可以创建 1 个包含所有单独图像的图像(即 spritemap 或 tilemap)。然后使用 CSS 将其再次拆分为单个图像。您可以通过为背景图像定义一个通用声明来完成此操作,然后让每个数值在该图像内定义一个偏移量。

.nr1 .nr2 .nr3 {    
  background: url(sprites.png) no-repeat;
}
.nr1 { background-position: 0 0 ; }
.nr2 { background-position: 0 -21px ; }
.nr3 { background-position: -21px -42px ; }

查找准确偏移量的任务可能看起来很耗时。但是有几种 免费在线工具 可以为您完成这项工作。我个人经常使用 this one。您只需将单个图像拖到您的网络浏览器,它就会创建一个图像和必要的 CSS.

使用 spritemap 的优点之一是 所有图像一起加载。如果您使用单独的图像,您会在加载图像时看到某种闪烁。

您需要将点击计数器拆分为数组,每个值包含一个数字,然后使用 for 循环附加图像。

<?php
$array = str_split($your_hit_variable_from_mysql);
if(!empty($array)){
  foreach($array as $single){
        echo '<img src="'.$single.'.jpg"'>;
  }
}else{
        echo '<img src="0.jpg"'>;
}
?>

确保您以整数格式存储数字,而不是像带逗号的 52,200 这样的字符串。

更多检查Here.

编辑: 添加了图像计数器 0 时的异常处理。