Estou brincando com a idéia de modificareu IDE de desenvolvimento de jogos para produzir versões em HTML5 dos jogos criados com ele. Um dos recursos do IDE é a capacidade de definir quadros, que não apenas definem como uma célula gráfica é transformada (girada, esticada etc.), mas também como é colorida quando é desenhada. Portanto, se eu quisesse colinas verdejantes, colinas marrons, subidas e descidas, precisaria apenas de 1 gráfico definido para todos eles, simplesmente transformado e colorido de forma diferent

Posso ver como um contexto de tela HTML5 me permitirá transformar os resultados do drawImage, mas não vejo uma maneira prática de modular as cores. Quero poder dizer, por exemplo, R = 255, G = 255, B = 0, A = 127 e fazer com que nenhum canal azul passe (uma versão em amarelo do gráfico) desenhada com 50% de translucidez (lembre-se de que partes da célula gráfica já podem ser translúcidas ou transparentes).

Isso é possível? Ou precisareigetImageData e manipular os pixels e armazenar cópias manipuladas em cache? Se eu precisar armazenar em cache cópias manipuladas, qual é a melhor estrutura de dados JavaScript para fazer isso? Eu acho que gostaria de algum tipo de dicionário onde a chave seja um índice de imagem e um RGBA composto como um valor único de alguma forma. As pesquisas teriam que ser muito rápidas, porque isso seria feito potencialmente para a maioria das peças sendo sorteada