更改SVG顏色

您可以更改SVG內形狀的顏色嗎？目前我使用的是PNG，我必須在Photoshop中爲每個不同的菜單手動創建，我想知道是否可以使整個過程變得動態。更改SVG顏色

來源

2010-03-20 Rick

~~難道你不能只用 style="background-color: #------;"（或者 color:）？~~

編輯：我的錯誤，你需要的是填充，所以style="fill:#------;"，它應該與任何形狀。

來源

2010-03-20 02:19:54

形狀不是一個簡單的矩形或圓形或類似的東西，請看這裏：http://imgur.com/D9aFo.png - 我試圖把藍色變成紅色或其他。 – Rick 2010-03-20 02:22:33

您可以使用色調旋轉過濾器，或者您可以按照上面的建議修復顏色。也許更兼容改變顏色，你所需要的，但在任何情況下，這裏的過濾器變種的例子：

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> 
    <filter id="h200" x="0" y="0" width="1" height="1"> 
    <feColorMatrix type="hueRotate" values="200"/> 
    </filter> 
    <image xlink:href="http://imgur.com/D9aFo.png" width="207" height="46" filter="url(#h200)"/> 
</svg>

你可以看到它住here如果您使用支持SVG過濾器的瀏覽器，如Opera或Firefox。

來源

2010-03-21 15:40:16

@Brendan_Long是正確的，所有你需要的是路徑對象上的樣式標籤。在這裏看到一個演示：http://kemputing.com/demo/shapeDemoColour.svg

代碼如下所示：

<path 
style="fill:#000080;" 
d="M 125.0,478.0 172.0,305.0 337.0,266.0 508.0,438.0 482.0,586.0 287.0,659.0 z" 
id="path2985"/>

讓符合圖像，然後以編程方式更改連接到它的顏色的路徑。你可能想使用像inkscape這樣的工具來幫忙。

來源

2012-01-30 22:42:28 pluke

回答

相關問題