我正在使用Raphael库使用SVG。我可以将填充颜色应用于对象，如下所示：
circle.attr({fill: "#ff0000"});
这也有效（虽然Raphael文档没有提到它）：
circle.attr({fill: "url(pattern.png)"});
我可以使用透明PNG作为填充图案，透明度可以按预期工作。 svg对象是完全透明的，其中填充图案图像是透明的。但我想要做的是指定填充图案图像和填充颜色，以便颜色显示图案图像透明的位置 - 例如，类似于使用CSS的'background'属性。这可能与SVG有关吗？
答案 0 :(得分：9)
您可以定义一个模式，其中包含一个带填充的矩形，以及一个在该矩形顶部的png图像。然后使用模式作为圆的填充（或任何你想要的元素）。
这意味着走出Raphaël，或者扩展它以做你想做的事。请注意({fill: "url(pattern.png)"})所做的是创建一个模式元素，并附加一个指向给定网址的图像元素。很可能会破解Raphaël以允许您传递颜色，然后通过创建与具有给定填充颜色的图像相同尺寸的矩形来处理创建模式的代码中的颜色。
我应该说，如果你想让它与IE＆lt; 9一起使用，你可能也需要在VML中实现它。
其他选项包括绘制两个形状，一个具有颜色填充，另一个具有光栅图像填充。另一种方法是让png包含背景颜色，使其不透明。