Тень холста html применяется ко всему

Если вы определяете тень ONCE, тогда она применяется ко всей "графике" на холсте после этого после (что и должно было делать).

Пример: http://flanvas.com/development/flanvas/test.html

Кто-нибудь знает, как лучше всего отключить тень после того, как вы ее использовали? Я устанавливаю shadowColor в "rgba (0,0,0,0)", который является не альфа-черным. Я уверен, что есть лучший способ.

case sample: текст также получает тень. Я использую no-alpha black для борьбы с этим пока. http://flanvas.com/development/flanvas/examples/filters-dropShadowFilter.html

Ответы

Ответ 1

Используя save, translate и restore, вы можете выполнять свои задачи, не беспокоясь о изменениях стиля, например.

ctx.save();
ctx.translate(X,Y);

ctx.shadowColor = 'rgba(255, 0, 0, 0.5)';

// do some stuff

ctx.restore();

здесь X и Y - это координаты, которые вы намеревались нарисовать, и делаете свой материал относительно координат 0,0.

Этот метод решает проблему кэширования и восстановления предыдущих стилей/значений, а также очень полезно при работе с градиентами, поскольку они всегда отображаются относительно начала (0,0)

Ответ 2

(EDIT: Ой! Я вижу, что вы уже делали с 0 альфа-черным.)

Это то, что вы искали:

context.shadowColor = "transparent";

Ответ 3

Как правило, рекомендуется сохранить старое значение этих "глобальных" атрибутов, прежде чем вы его измените, и используйте это значение, чтобы восстановить его позже. Пример:

var origShadowColor = ctx.shadowColor;
ctx.shadowColor = 'rgba(255, 0, 0, 0.5)';

// ... do some stuff

ctx.shadowColor = origShadowColor;