Bir dinamik veri kümesine göre ABD farklı eyaletlerde boyama haritası oluşturulan içeren bir web projesi üzerinde çalışıyorum.

SVG Bu dosya bana BİZE iyi boş bir harita verir ve çok kolay bir devletin rengini değiştirmek için. Zorluk IE tarayıcıları beni svg fazla kullanışlı sözdizimini kullanmak için JPG dönüştürmek için lazım olacak SVG desteği yok.

İdeal olarak, sadece GD2 kütüphanesi ile bunu yapmak istiyorum ama aynı zamanda ImageMagick kullanabilirsiniz. Kesinlikle bunu yapmak için nasıl bir ipucu yok.

Bana Amerika haritası üzerinde dinamik olarak değiştirmek Birleşik Devletleri renkleri olmasına izin veren bir çözüm olarak kabul edilecektir. Anahtar kolay anında renklerini değiştirmek ve çapraz tarayıcı olmasıdır. PHP/Apache, lütfen çözüm.

Teşekkürler!

Bu istediğin çok komik, ben sadece son zamanlarda benim iş site için yaptım ve öğretici yazmam gerektiğini düşündüm... ImageMagick ile bunu yapmak için nasıl Burada

$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();

adımları düzenli Renk Değiştirme svg yolu xml bağlı olarak ve nasıl ıd değişebilir ve renk değerleri saklanır. Eğer sunucu üzerinde bir dosya saklamak istiyorsanız Eğer, base 64 gibi bir görüntü çıktı

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

açık/yok kullanmadan önce () ama yani base64 olarak PNG ile ilgili sorunlar var o yüzden muhtemelen jpeg olarak base64 çıkış olurdu

eski bir işveren satış bölgesi haritası için yaptım burada bir örnek görebilirsiniz:

Başlangıç: http://upload.wikimedia.org/wikipedia/commons/3/32/Blank_US_Map.svg

Bitiş:

Edit

Yukarıda yazılı beri, 2 gelişmiş teknikleri ile geldim:

1) devlet, dolgu değiştirmek için düzenli bir döngü yerine , CSS stil kuralları gibi yapmak için kullanın

<style type="text/css">
#CA,#FL,HI{
    fill:blue;
}
#Al, #NY, #NM{
    fill:#cc6699;
}
/*etc..*/
</style>

ve sonra svg css kuralları enjekte etmek yerine tek bir metin resim jpeg/png oluşturma işlemine devam etmeden önce yapabilirsiniz. Eğer renk değişikliği yok ise, herhangi bir satır olmadığından emin olun path etiketleri stilleri css geçersiz kılma doldurun.

2) Eğer gerçekten jpeg/png resim dosyası oluşturmak için İse büyük ve eski tarayıcıları desteklemek gerek yok), svg doğrudan jQuery ile işleyebilirsiniz. Svg ımg veya nesne etiketleri kullanarak gömerken svg yolları erişemiyorum, doğrudan web sayfası html, svg gibi xml dahil etmek zorundasınız:

<div>
<?php echo file_get_contents('/path/to/blank/us-map.svg');?>
</div>

renkleri değiştirmek kadar kolaydır:

<script type="text/javascript" src="/path/to/jquery.js"></script>
<script type="text/javascript">
    $('#CA').css('fill', 'blue');
    $('#NY').css('fill', '#ff0000');
</script>