将新的笔触颜色注入形状答案

【问题标题】：Injecting a new stroke color into a shape将新的笔触颜色注入形状
【发布时间】：2016-02-05 17:12:12
【问题描述】：

我有一个绘图画布（基于 EaselJS CurveTo example），当使用 mouseup 时，我想将一种新颜色注入到要渲染到画布上的形状中。我也想不使用过滤器。

BIN：https://jsbin.com/qejesuvovu/1/edit?html,output

我以前直接将自定义填充/描边注入到形状图形中，但在后来的 EaselJS 版本中，这已停止工作。

marker.graphics._dirty = true;
marker.graphics._fill = new createjs.Graphics.Fill('blue');
marker.graphics._stroke = new createjs.Graphics.Stroke('blue');

使用单一笔触颜色即时更改形状颜色的推荐方法是什么？

更新：

进一步研究后发现，我需要能够保持克隆形状的能力，并保留独立更改颜色的功能。

BIN：https://jsbin.com/gorasizuho/edit?html,output

【问题讨论】：

标签： javascript createjs easeljs

【解决方案1】：

在 0.7.0 版中，图形被重新设计为使用“命令”。绘图API没有什么不同（除了移除旧的appendInstruction API），但是您可以随时修改各个命令的属性，它们会在阶段更新时反映出来。

var shape = new createjs.Shape();
shape.graphics.setStrokeStyle(3);
var strokeCommand = shape.graphics.beginStroke("#f00").command;
shape.graphics.drawRect(0,0,100,100);

您可以修改任何命令的属性：

strokeCommand.style = "#00f";

您可以在图形文档中查看完整的命令列表。 http://createjs.com/docs/easeljs/classes/Graphics.html#property_command - 每个命令都有单独的文档：http://createjs.com/docs/easeljs/classes/Graphics.Stroke.html

这是一个使用命令来修改笔划-虚线偏移和drawRect坐标的示例：http://jsfiddle.net/lannymcnie/gg8sv4cq/

您可以在这里阅读更多内容：http://blog.createjs.com/new-command-approach-to-easeljs-graphics/

【讨论】：

我刚刚为我的问题添加了更新。我还需要能够克隆形状，同时独立保留更改笔触颜色的能力。有没有办法处理？
目前不可能。克隆形状时（使用true 进行递归克隆），图形被克隆，但它们仍然包含对相同指令的引用。
嗯，对于克隆形状，我唯一的选择是循环浏览指令并根据命令类型决定需要更改的内容。