Existe uma maneira de combinar várias operações de desenho em um contexto de renderização de tela 2D, de maneira que elescombinado O resultado é composto pelo conteúdo anterior da tela, em oposição a cada operação de desenho ser composta por ela mesma?

Uma aplicação: eu gostaria de desenhar uma linha translúcida com uma ponta de seta e gostaria de evitar maior opacidade nas áreas em que a linha e a ponta da seta se sobrepõem.

Muitos outros modelos de renderização suportam esses recursos. SVG tem umopacidade do grupo configuração, descrita na seção 14.5. oReferência em PDF descreve "Grupos de transparência" na seção 7.3. Em muitos aplicativos gráficos, um usuário pode criar camadas e depois compô-las como um todo.

Eu acho que eu poderia configurar uma segunda tela invisível para ser usada como uma imagem fora da tela, renderizar meu conteúdo para isso e usarglobalAlpha para compor o resultado na tela principal com a translucidez desejada. Mas espero que exista uma solução mais elegante, mesmo que não tenha sido encontrada nos documentos até agora.

Mesclar vários caminhos no CanvasRenderingContext2D para preencher e traçar como um conjunto aparentemente, tem um objetivo semelhante em mente. Mas o foco parece ser como executar operações booleanas em caminhos, provavelmente o caminhotosquiadeira faz isso. Portanto, para este post aqui, não estou interessado em manipular os caminhos na frente; Quero ser capaz de desenhar cada golpe como faria normalmente.