당신이 이것을 물었다는 것은 재밌습니다. 저는 최근에 제 작업 사이트를 위해 이것을했습니다. 그리고 저는 튜토리얼을 작성해야한다고 생각하고있었습니다 ... ImageMagick을 사용하는 PHP / Imagick으로 이것을하는 방법은 다음과 같습니다 :
$usmap = '/path/to/blank/us-map.svg';
$im = new Imagick();
$svg = file_get_contents($usmap);
/*loop to color each state as needed, something like*/
$idColorArray = array(
"AL" => "339966"
,"AK" => "0099FF"
...
,"WI" => "FF4B00"
,"WY" => "A3609B"
);
foreach($idColorArray as $state => $color){
//Where $color is a RRGGBB hex value
$svg = preg_replace(
'/id="'.$state.'" style="fill:#([0-9a-f]{6})/'
, 'id="'.$state.'" style="fill:#'.$color
, $svg
);
}
$im->readImageBlob($svg);
/*png settings*/
$im->setImageFormat("png24");
$im->resizeImage(720, 445, imagick::FILTER_LANCZOS, 1); /*Optional, if you need to resize*/
/*jpeg*/
$im->setImageFormat("jpeg");
$im->adaptiveResizeImage(720, 445); /*Optional, if you need to resize*/
$im->writeImage('/path/to/colored/us-map.png');/*(or .jpg)*/
$im->clear();
$im->destroy();
정규식 색상 교체 단계는 svg 경로 xml과 ID 및 색상 값이 저장되는 방법에 따라 다를 수 있습니다. 서버에 파일을 저장하지 않으려면 이미지를 base 64로 출력 할 수 있습니다.
<?php echo '<img src="data:image/jpg;base64,' . base64_encode($im) . '" />';?>
(clear / destroy를 사용하기 전에)하지만 즉, PNG에 base64로 문제가 있으므로 base64를 jpeg로 출력해야 할 것입니다.
여기에서 전 고용주의 판매 지역지도에 대한 예를 볼 수 있습니다.
시작 : https://upload.wikimedia.org/wikipedia/commons/1/1a/Blank_US_Map_(states_only).svg
.svg)
끝: 
편집하다
위의 글을 쓴 이후로 두 가지 개선 된 기술을 생각해 냈습니다.
1) 상태 채우기를 변경하는 정규식 루프 대신 CSS를 사용하여 다음과 같은 스타일 규칙을 만듭니다.
<style type="text/css">
#CA,#FL,HI{
fill:blue;
}
#Al, #NY, #NM{
fill:#cc6699;
}
/*etc..*/
</style>
그런 다음 imagick jpeg / png 생성을 진행하기 전에 css 규칙을 svg에 삽입하기 위해 단일 텍스트 교체를 수행 할 수 있습니다. 색상이 변경되지 않으면 CSS를 재정의하는 경로 태그에 인라인 채우기 스타일이 없는지 확인하십시오.
2) 실제로 jpeg / png 이미지 파일을 만들 필요가없고 오래된 브라우저를 지원할 필요도 없다면 jQuery를 사용하여 직접 svg를 조작 할 수 있습니다. img 또는 object 태그를 사용하여 svg를 포함 할 때 svg 경로에 액세스 할 수 없으므로 다음과 같이 웹 페이지 html에 svg xml을 직접 포함해야합니다.
<div>
<?php echo file_get_contents('/path/to/blank/us-map.svg');?>
</div>
색상을 변경하는 것은 다음과 같이 쉽습니다.
<script type="text/javascript" src="/path/to/jquery.js"></script>
<script type="text/javascript">
$('#CA').css('fill', 'blue');
$('#NY').css('fill', '#ff0000');
</script>