Original Post
🔒 Locked
HTML sprite drawing problem
Advertisement
I can think of at least three obvious ways to draw sprites and two common errors you might be doing: you should post images (the exact file you use as a "sprite character bitmap" and a capture of the wrong drawing result) and code (how are you drawing your sprite?).
It is a simple ctx.drawImage(background, curViewUpperCornerX, curViewUpperCornerY, screenWidth, screenLength, 0, 0, screenWidth, screenLength).
That obviously does not take alpha and transparency into account man...
That obviously does not take alpha and transparency into account man...
I can think of at least three obvious ways to draw sprites and two common errors you might be doing: you should post images (the exact file you use as a "sprite character bitmap" and a capture of the wrong drawing result) and code (how are you drawing your sprite?).
This forum has one of the best engines I've ever seen, but it doesn't support clairvoyance yet.
Why do you suppose that we know your code and your bugs without you explaining yourself?
It should be obvious to you, rereading, that this is not an adequate description of what you are doing:
Why do you suppose that we know your code and your bugs without you explaining yourself?
It is a simple ctx.drawImage(background, curViewUpperCornerX, curViewUpperCornerY, screenWidth, screenLength, 0, 0, screenWidth, screenLength).
It should be obvious to you, rereading, that this is not an adequate description of what you are doing:
- What is ctx ? Is it from some library?
- Is this drawImage function, wherever it comes from, supposed to support transparency?
- What is background?
- Are the last 8 parameters of the drawImage call coordinates or sizes? Are they right? (Drawing sprites with sizes of, or corners at, screenWidth and screenLength is quite suspect)
That obviously does not take alpha and transparency into account man...
[/quote]
But how? Do you have correct transparency in your source image? What's wrong with the result? As they say, an image (two in this case) is worth a thousand words. Attach them.
It should be obvious to you, rereading, that this is not an adequate description of what you are doing:
Fortunately, I happen to know a couple of relevant things here.
- What is ctx ? Is it from some library?
- Is this drawImage function, wherever it comes from, supposed to support transparency?[/quote]
'ctx' is the canonical name used in examples for the result of
document.getElementById('canvas').getContext('2d');
[font="Arial"]As noted, he is using HTML5, specifically the[font="Courier New"]
[font="Arial"]and the image actually has transparency information, it should Just Work.
[/font]
[/quote]
Actually, I realized the image itself has no transparency information. It has no alpha value setup correctly. That's why!! thanks.
Nice tutorial here: http://www.axialis.com/tutorials/tutorial-misc001.html
Topic Locked
This topic has been locked by a moderator. New replies are not allowed.
Sign in to reply to this topic.
Advertisement