自定义地图标记图标与动态生成的数字

时间:2011-06-24 06:24:24

标签: php javascript google-maps

我想为我的谷歌地图编制地图标记,目前我正在使用Google Charts API方法动态创建编号标记。但是,我无法使用自己的图标。

有没有办法使用我自己的自定义地图标记图标,然后覆盖/上面有数字?

或者,是否可以快速创建从11000的1000个.PNG标记?就像Photoshop中的批处理一样

2 个答案:

答案 0 :(得分:5)

我从我写的一篇文章中借用了这段代码并稍微调整了一下。您应该下载this image,在Photoshop中稍微编辑它并将其放在与PHP脚本相同的目录中。调整脚本中的数字,直到你得到一些体面的东西。

<?php
define("FONT_SIZE", 6);                            // font size in points
define("FONT_PATH", "c:/windows/fonts/arial.ttf"); // path to a ttf font file
define("FONT_COLOR", 0x00000000);                  // 4 byte color
                                                   // alpha  -- 0x00 thru 0x7F; solid thru transparent
                                                   // red    -- 0x00 thru 0xFF
                                                   // greeen -- 0x00 thru 0xFF
                                                   // blue -- 0x00 thru 0xFF
$text = $_GET["text"];
$gdimage = imagecreatefrompng("marker.png");
imagesavealpha($gdimage, true);
list($x0, $y0, , , $x1, $y1) = imagettfbbox(FONT_SIZE, 0, FONT_PATH, $text);
$imwide = imagesx($gdimage);
$imtall = imagesy($gdimage) - 14;                  // adjusted to exclude the "tail" of the marker
$bbwide = abs($x1 - $x0);
$bbtall = abs($y1 - $y0);
$tlx = ($imwide - $bbwide) >> 1; $tlx -= 1;        // top-left x of the box
$tly = ($imtall - $bbtall) >> 1; $tly -= 1;        // top-left y of the box
$bbx = $tlx - $x0;                                 // top-left x to bottom left x + adjust base point
$bby = $tly + $bbtall - $y0;                       // top-left y to bottom left y + adjust base point
imagettftext($gdimage, FONT_SIZE, 0, $bbx, $bby, FONT_COLOR, FONT_PATH, $text);
header("Content-Type: image/png");
header("Expires: " . gmdate("D, d M Y H:i:s", time() + 60 * 60 * 24 * 180) . " GMT");
imagepng($gdimage);
?>

我系统上的示例输出:

/marker.php?text=9 /marker.php?text=99 /marker.php?text=999 /marker.php?text=AA

答案 1 :(得分:1)

您现在可以使用Google Charts执行此操作。以下是一个示例语法:

(scale|rotation|color|fontsize|bold(b) or normal(_)|text[|line2]
https://chart.googleapis.com/chart?chst=d_map_spin&chld=1.0|0|FF8844|12|_|221B

这是the documentation