使用 PHP 将 SVG 图像转换为 PNG [英] Convert SVG image to PNG with PHP

问题描述

我正在开展一个网络项目，该项目涉及动态生成的美国地图，根据一组数据为不同的州着色.

这个 SVG 文件给了我一张很好的美国空白地图，而且很容易改变每个州的颜色.困难在于 IE 浏览器不支持 SVG，因此为了让我使用 svg 提供的方便语法，我需要将其转换为 JPG.

理想情况下，我只想使用 GD2 库来执行此操作，但也可以使用 ImageMagick.我完全不知道如何做到这一点.

任何允许我动态更改美国地图上各州颜色的解决方案都将被考虑.关键是很容易动态更改颜色，并且它是跨浏览器的.请仅使用 PHP/Apache 解决方案.

解决方案

你问这个问题很有趣，我最近刚为我的工作网站做了这个，我想我应该写一个教程......这是如何做到的使用 PHP/Imagick，它使用 ImageMagick:

$usmap = '/path/to/blank/us-map.svg';$im = new Imagick();$svg = file_get_contents($usmap);/* 循环根据需要为每个状态着色，例如*/$idColorArray = 数组(AL"=>339966",AK"=>0099FF"...,WI"=>FF4B00",WY"=>A3609B");foreach($idColorArray as $state => $color){//其中 $color 是一个 RRGGBB 十六进制值$svg = preg_replace('/id="'.$state.'" style="fill:#([0-9a-f]{6})/', 'id="'.$state.'" style="fill:#'.$color, $svg);}$im->readImageBlob($svg);/*png 设置*/$im->setImageFormat("png24");$im->resizeImage(720, 445, imagick::FILTER_LANCZOS, 1);/*可选，如果你需要调整大小*//*JPEG*/$im->setImageFormat("jpeg");$im->adaptiveResizeImage(720, 445);/*可选，如果你需要调整大小*/$im->writeImage('/path/to/colored/us-map.png');/*(或.jpg)*/$im->clear();$im->destroy();

正则表达式颜色替换的步骤可能会因 svg 路径 xml 以及您的 id & 方式而异.颜色值被存储.如果你不想在服务器上存储文件，你可以像

一样将图像输出为base 64

<?php echo '<img src="data:image/jpg;base64,' .base64_encode($im) .'"/>';?>

(在使用 clear/destroy 之前)但 IE 有问题，PNG 为 base64，因此您可能必须将 base64 输出为 jpeg

您可以在此处查看我为前雇主的销售区域地图所做的示例:

开始:https://upload.wikimedia.org/wikipedia/commons/1/1a/Blank_US_Map_(states_only).svg

完成:

编辑

自从写完上面的内容后，我想出了 2 个改进的技巧:

1) 而不是一个正则表达式循环来改变状态的填充，使用 CSS 来制作像

这样的样式规则