是否可以增加地图的比例但仍然可以有效地悬停？ [使用 PHP GD]

Posted 2023-02-25

【中文标题】是否可以增加地图的比例但仍然可以有效地悬停？ [使用 PHP GD]

【英文标题】：Is it possible to increase scale of map but still can be hovered efficiently? [Using PHP GD]

【发布时间】：2011-05-10 08:04:55

【问题描述】：

我向你们简要介绍一下我的项目。我正在开发一个 Web 应用程序，它是 一个仓库管理系统。基本上，我使用 php GD 来绘制工厂布局图的图像，其中包含每层楼的货架和托盘。 当您将鼠标悬停在货架或托盘上时，您将能够看到它的详细信息。

因为使用GD，为了能够绘制每个货架或托盘，它需要一个特定的x和y坐标，以及它的宽度和高度。我使用标签创建区域，以便它可以使用 jquery 进行悬停。

我被要求制作具有给定比例的比例图像，但我不知道该怎么做。所以我想你们可以帮帮我。

在这方面真的需要帮助。

这是我的代码的一些示例

while($row = mysql_fetch_array($RecordsetZone))

        $n = substr($row['name'], 4);
    $font = 2;
    $textColor = imagecolorallocate ($source,0,0,0);
    if($row['zonetype']=="Rack")
        imagerectangle($source, $row['xcord'], $row['ycord'] , $row['width']+($row['xcord']), $row['height']+$row['ycord'], $black);
        imagefilltoborder($source, ($row['xcord'])+1, $row['ycord']+1, $black , $limegreen);
        imagestring ($source, $font, ($row['xcord'])+2, $row['ycord']+5, $n, $textColor);
    
    elseif($row['zonetype']=="Pallet")
        imagerectangle($source, $row['xcord'], $row['ycord'] , $row['width']+($row['xcord']), $row['height']+$row['ycord'], $black);
        imagefilltoborder($source, ($row['xcord'])+1, $row['ycord']+1, $black , $dodgerblue);
        imagestring ($source, $font, ($row['xcord'])+5, $row['ycord']+2, $n, $textColor);
    

这就是我通过从数据库中获取 x、y 来绘制图像的方式

<map name="testmap" id="testmap">
  <?php $RecordsetZone = mysql_query($query, $cakewms) or die(mysql_error()); 
  while($row = mysql_fetch_array($RecordsetZone))?>
   <area id=<?php echo '"'. $row['name']. '"';?> shape="rect" coords=<?php echo '"'. $row['xcord']. ','.$row['ycord']. 
    ',' . ($row['width']+$row['xcord']) . ',' . ($row['height']+$row['ycord']) . '"';?> href="#"  />
  <?php ?>
</map>

之后使用地图创建悬停区域

如果我改变了比例，我仍然可以将鼠标悬停在正确的区域吗？

【参考方案1】：

您可以使用特殊的 JQuery 插件ImageMapster。

它允许调整图像地图的大小，同时它们仍然保留在正确标记的活动区域中。

因此，您需要生成一次图像映射，然后重新计算 onresize 将是此插件的任务。

它在使用图像映射的其他情况下也很有帮助。