PHP MySQL 图像命中计数器答案

【问题标题】：PHP MySQL image hit counterPHP MySQL 图像命中计数器
【发布时间】：2015-07-20 04:18:38
【问题描述】：

我是 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">

注意：我在这里展示的代码中使用了很多注释。这样，任何新的编码人员都可以更轻松地理解正在显示的脚本。我将在这篇文章的底部添加我的最终/完成的代码，以便在我找到解决方案时每个人都可以看到最终产品。

此代码完全是虚构的文本命中计数器

// 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

最后说明：我还没有尝试在更大的数字上添加逗号或删除数组上的撇号。如果我这样做了，我会回来编辑。

【问题讨论】：

通常使用图像作为数字是不明智的。您应该在 html 中使用带有酷炫 CSS 的数字。
@jQuery.PHP.Magento.com 我同意将图像用于数字或任何文本等并不好，但 CSS 更好。因为我不知道如何在某些智能手机上安装字体，或者因为某些人可能会阻止此类下载，所以我选择使用图像。一切都设置为特定大小，以防止失真等。
总之你不能在你的整个网站中使用自定义字体吗？酷！
OP，想看看答案吗？
@jQuery.PHP.Magento.com 我是 PHP 新手。我仍在努力获得结果。我还没有答案。

标签： php mysql image hitcounter

【解决方案1】：

您需要将命中计数器拆分为每个值包含单个数字的数组，然后使用 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 时的异常处理。

【讨论】：

jQuery.PHP.Magento.com 和 @bvdb 提供的答案帮助我找到了最终答案。谢谢你。我选择了 jQuery 的答案，因为他回答了我的问题并且没有向我提供我没有要求的信息。我仍然感谢 bvdb 的回复。

【解决方案2】：

您可以使用str_split($str) 将字符串转换为字符数组。接下来，您可以使用简单的for 或foreach 循环对其进行迭代。

编辑：

关于如何可视化图像有多种选择。您可以只使用 html <img src=''> 标签或 CSS。

如果您使用 CSS，则可以创建 1 个包含所有单独图像的图像（即精灵图或平铺图）。然后使用 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 的优点之一是所有图像都一起加载。如果您使用单个图像，您会在图像加载时看到某种闪烁。

【讨论】：