Php 生成带有两个标记和一个弧的静态地图图像，中间为服务器端

我的问题类似于“”，但我希望将映射生成为静态图像服务器端（PHP或NodeJS），以便可以在脱机环境中使用

简而言之，我有两组纬度和经度，我想在它们上面放置标记，并在它们之间绘制一条非测地弧，然后将地图保存为图像。谷歌地图不是一项要求

这基本上就是我想要实现的目标：

使用PHP（需要ImageMagick）和Open Street Map（通过curl）完成

请注意：在实施此解决方案之前，您必须了解使用Open Street Map的许可证和条款，以确保其可供您使用

TODO:改善两点之间的贝塞尔曲线

TODO:检查来自磁贴服务器的响应，以确保它是一个映像

<?php
/**
 * adapted from https://wiki.openstreetmap.org/wiki/ProxySimplePHP
 * get the map tile and save as png
 *
 * @param float   $lat1  Latitude in degrees
 * @param float   $lng1  Longitude in degrees
 * @param float   $lat2  Latitude in degrees
 * @param float   $lng2  Longitude in degrees
 * @param integer $zoom Zoom level 0-20
 *
 * @throws Exception
 */
function createMap($lat1, $lng1, $lat2, $lng2, $zoom)
{
  //from https://wiki.openstreetmap.org/wiki/Slippy_map_tilenames#X_and_Y
  //convert lat/lng to x/y tile coords
  $x1 = floor((($lng1 + 180) / 360) * pow(2, $zoom));
  $y1 = floor((1 - log(tan(deg2rad($lat1)) + 1 / cos(deg2rad($lat1))) / pi()) / 2 * pow(2, $zoom));

  $x2 = floor((($lng2 + 180) / 360) * pow(2, $zoom));
  $y2 = floor((1 - log(tan(deg2rad($lat2)) + 1 / cos(deg2rad($lat2))) / pi()) / 2 * pow(2, $zoom));

  $startX = min($x1,$x2)-1;
  $startY = min($y1,$y2)-1;

  if($startX<0)
  {
    $startX = 0;
  }
  if($startY<0)
  {
    $startY = 0;
  }

  $endX = max($x1,$x2)+1;
  $endY = max($y1,$y2)+1;

  if($endX>(pow(2,$zoom))-1)
  {
    $endX = (pow(2,$zoom))-1;
  }
  if($endY>(pow(2,$zoom))-1)
  {
    $endY = (pow(2,$zoom))-1;
  }

  if(($endX-$startX+1)*($endY-$startY+1)>=50)
  {
    //https://operations.osmfoundation.org/policies/tiles/#bulk-downloading
    //terms of use state: In particular, downloading an area of over 250 tiles at zoom level 13 or higher for offline or later usage is forbidden
    //we're going to be a lot more strict here
    throw new Exception('Zoom level is too high, please reduce');
  }

  if(!is_dir(__DIR__."/tiles"))
  {
    mkdir(__DIR__."/tiles",0755);
  }

  for($x=$startX;$x<=$endX;$x++)
  {
    for($y=$startY;$y<=$endY;$y++)
    {
      $file = "tiles/${zoom}_${x}_${y}.png";
      if(!is_file($file) || filemtime($file) < time() - (86400 * 30))
      {
        $server = array();
        $server[] = 'a.tile.openstreetmap.org';
        $server[] = 'b.tile.openstreetmap.org';
        $server[] = 'c.tile.openstreetmap.org';

        $url = 'http://'.$server[array_rand($server)];
        $url .= "/".$zoom."/".$x."/".$y.".png";

        $ch = curl_init($url);
        $fp = fopen($file, 'wb');
        curl_setopt($ch, CURLOPT_FILE, $fp);
        curl_setopt($ch, CURLOPT_HEADER, 0);
        global $userAgent;
        if(empty($userAgent))
        {
          throw new Exception('User agent required');
        }
        curl_setopt($ch,CURLOPT_USERAGENT,$userAgent);
        curl_exec($ch);
        curl_close($ch);
        fflush($fp);    // need to insert this line for proper output when tile is first requested
        fclose($fp);
      }
    }
  }

  //now stitch all tiles into 1 image
  $tileWidth = 0;
  $tileHeight = 0;

  $map = new Imagick();
  $cols = array();
  for($x=$startX;$x<=$endX;$x++)
  {
    $col = new Imagick();
    for($y = $startY; $y <= $endY; $y ++)
    {
      $col->readImage("tiles/${zoom}_${x}_${y}.png");
      if($tileWidth===0)
      {
        $tileWidth = $col->getImageWidth();
        $tileHeight = $col->getImageHeight();
      }
    }
    $col->resetIterator();
    $cols[] = $col->appendImages(true);
  }
  foreach($cols as $col)
  {
    $map->addImage($col);
  }
  $map->resetIterator();
  $map = $map->appendImages(false);

  //calculate the pixel point of the lat lng
  $x1 = $tileWidth*(((($lng1 + 180) / 360) * pow(2, $zoom))-$startX);
  $y1 = $tileHeight*(((1 - log(tan(deg2rad($lat1)) + 1 / cos(deg2rad($lat1))) / pi()) / 2 * pow(2, $zoom))-$startY);
  $x2 = $tileWidth*(((($lng2 + 180) / 360) * pow(2, $zoom))-$startX);
  $y2 = $tileHeight*(((1 - log(tan(deg2rad($lat2)) + 1 / cos(deg2rad($lat2))) / pi()) / 2 * pow(2, $zoom))-$startY);

  $draw = new ImagickDraw();
  $draw->setFillAlpha(0);
  $draw->setStrokeColor(new ImagickPixel('black'));
  $draw->setStrokeWidth(2);
  $draw->bezier(array(array('x'=>$x1,'y'=>$y1),array('x'=>$x1+(($x2-$x1)/2)+50,'y'=>$y1+(($y2-$y1)/2)-50),array('x'=>$x2,'y'=>$y2)));
  $map->drawImage($draw);

  if(file_exists('map-marker.png'))
  {
    $icon = new Imagick('map-marker.png');
    $icon->scaleImage(30,30,true);
    $markerX = $x1-($icon->getImageWidth()/2);
    $markerY = $y1-$icon->getImageHeight();
    $map->compositeImage($icon->clone(),$icon::COMPOSITE_DEFAULT,$markerX,$markerY);

    $markerX = $x2-($icon->getImageWidth()/2);
    $markerY = $y2-$icon->getImageHeight();
    $map->compositeImage($icon->clone(),$icon::COMPOSITE_DEFAULT,$markerX,$markerY);
  }

  $map->setImageFormat('png');
  $map->writeImage('base_map.png');
}

//https://operations.osmfoundation.org/policies/tiles/#technical-usage-requirements
//You MUST provide a valid "user agent". For example the application name and a contact email address
//If you violate the terms of use the tiles will not be images but html
$userAgent = '';
createMap(23.634501, - 102.552783, 17.987557, - 92.929147, 5);

---

您可以在ImageMagick中绘制两点bezier曲线，如下所示，改变圆弧半径

p1=172,197
p2=483,231











这是我的NodeJS使用静态谷歌地图来实现它：。只需更换
GMAPS\u API\u键

初步结果如下


还需要进行一些测地校正。尽管如此，这应该会让你走上正确的道路。。。路径。
看一看，然后您可以使用它将其转换为画布，最终保存图像。PHP或NodeJS是一个严格的要求吗？基于这个问题，我不完全确定这种使用是否符合Google Maps API的条款，其中规定：“免费、公开地访问您的Maps API实现。”由于OP的预期用途是用于离线应用程序，而地图是在服务器端生成的，因此可能存在漏洞：。我误解了这个问题——离线当然不适用于GMAP！
convert map.png -fill none -stroke red -strokewidth 2 -draw "path 'M $p1   A 1,1  0  0,1 $p2'" map_arc1.png

convert map.png -fill none -stroke red -strokewidth 2 -draw "path 'M $p1   A 3,2  0  0,1 $p2'" map_arc2.png

convert map.png -fill none -stroke red -strokewidth 2 -draw "path 'M $p1   A 4,2  0  0,1 $p2'" map_arc3.png