我需要画一个填充的圆圈,半透明的3色渐变色。我在Canvas和HTML SVG中完成了这个。我不能使用HTML SVG,因为我需要使用json文件中的javascript变量修改颜色值。由于其他原因,Canvas是不可能的。 Snap SVG是我的选择,根据文档,它应该可以工作,但事实并非如此。
这个例子(错误地?)绘制一个红色到黑色的球体。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<script src="js/jquery-1.11.0.min.js"></script>
<script src="js/snap.svg-min.js"></script>
</head>
<body>
<svg id="svg" width="300" height="300" style='stroke-width: 0px; background-color:rgba(008,008,016,1.0);'></svg>
<script>
var s = Snap("#svg");
var g1 = s.gradient("l(0, 0, 1, 1)rgba(255,000,000,1.0)-(000,255,000,1.0)-(000,000,255,1.0)");
var bigCircle = s.circle(150, 150, 100);
bigCircle.attr({
fill: g1,
});
</script>
</body>
</html>
文档暗示支持RGBA。但是当这样使用时,只显示第一种颜色。其他颜色只会使第一个颜色变暗。此外,支持色彩停止,但显然它们根本不适用于RGBA。我做错了吗?