3

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

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

4

2 回答 2

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 ; }

找到确切偏移量的任务可能看起来很耗时。但是有几个免费的在线工具可以为您做到这一点。我个人经常使用这个。您只需将单个图像拖动到您的网络浏览器，它就会创建一个图像和必要的 CSS。

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

于 2015-05-09T08:09:48.933 回答
2

您需要将命中计数器拆分为每个值包含单个数字的数组，然后使用 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 这样带逗号的字符串。

更多检查这里。

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

于 2015-05-09T08:11:49.137 回答