javascript – Paper.js:无法设置符号实例的fillColor
作者:互联网
我是paper.js的新手.
对于这个项目,我需要一个将在许多实例中使用的形状(具有不同的填充颜色),因此使用符号(而不是使用Path.clone()方法)显然更好.
但是,一旦我将符号实例化为一个placementSymbol,似乎更改fillColor属性对渲染的形状没有影响:它仍然是符号的初始颜色.
已成功设置其他属性,例如位置或不透明度.
我的问题:如何更改符号的每个实例的填充颜色?
jsFiddle这里:http://jsfiddle.net/GlauberRocha/uTskY/(请注意,我已将所有代码放在HTML窗格中.似乎没有其他工作,可能是因为paperscript不是简单的javascript).
论文代码:
var
path = new Path(),
symbol = {},
inst = [],
colors = ["#1f8f81", "#c7c5a8", "#1b4a9f", "#d6a493", "#1a8879", "#599ce3", "#1a459c", "#b9a87a", "#365db2", "#2479d4", "#a46430", "#1b449a", "#a4632e", "#1a4297", "#3359ad", "#b1852b", "#1a8077", "#1b3849", "#ae832a", "#186cc9", "#1b8178"]
path.add(new Point(0, 56), new Point(56, 0), new Point(56, 40), new Point(0, 96));
path.fillColor = "red";
path.closed = true;
symbol = new Symbol(path);
path.remove();
for (var i = 0; i < 20; ++i) {
inst[i] = symbol.place();
inst[i].fillColor = colors[i]; // Change fill color : NO
console.log(inst[i].fillColor); // But... the correct color value appears here
inst[i].opacity = (i / 30) + .4; // Change opacity: OK
inst[i].position.x = 100; // Change position: OK
inst[i].position.y = 42 * i + 50;
}
解决方法:
paper.js团队的Jonathan Puckey回答:
This is by design. You cannot change the visual properties of an
instance of a Symbol. To change the color of the item, you can create
multiple copies of the path by usingpath.clone()
.
标签:javascript,canvas,html5-canvas,paperjs 来源: https://codeday.me/bug/20190902/1790307.html