tomsawyer Posted August 14, 2016 Share Posted August 14, 2016 I'm new with Phaser wanting to make a simple games with geometries like this one: http://shape.enclavegames.com I see the `.graphics()` and `bitmapData` are the ways to create vector geometries what's different between them? How about the performance comparing to using image? Link to comment Share on other sites More sharing options...
mcolman Posted August 16, 2016 Share Posted August 16, 2016 Don't make circles with graphics. They're not perfect circles, instead just a polygon joining 40 points together and very expensive. BitmapData is the go, perfect circles and treated as bitmaps (i.e. same as using an image performance wise). Link to comment Share on other sites More sharing options...
end3r Posted August 16, 2016 Share Posted August 16, 2016 Just so you know, the Shape Attack game is using png images for the shapes - it was easier for me to do it that way ;] Link to comment Share on other sites More sharing options...
symof Posted August 16, 2016 Share Posted August 16, 2016 I actually experimented with this some time ago and graphics is really bad. These are some of those. https://jsfiddle.net/j9kzwyqv/ - using sprites and webgl https://jsfiddle.net/7a87eL9n/1/ - using direct canvas draw with webgl https://jsfiddle.net/rf2gcfnz/1/ - using texture with webgl The example with sprites and webgl was the fastest by far, but using Phaser.Image should be the fastest of them all. I don't have all the experiments anymore but you can fiddle with the links I gave and try out different stuff. I'd go for sprites tho. You make images that look like balls then load then add them as sprites and reuse them. Particles would be even better depending on what you want to achieve. http://phaser.io/examples/v2/category/particles Link to comment Share on other sites More sharing options...
tomsawyer Posted August 16, 2016 Author Share Posted August 16, 2016 9 hours ago, symof said: I actually experimented with this some time ago and graphics is really bad. These are some of those. https://jsfiddle.net/j9kzwyqv/ - using sprites and webgl https://jsfiddle.net/7a87eL9n/1/ - using direct canvas draw with webgl https://jsfiddle.net/rf2gcfnz/1/ - using texture with webgl The example with sprites and webgl was the fastest by far, but using Phaser.Image should be the fastest of them all. I don't have all the experiments anymore but you can fiddle with the links I gave and try out different stuff. I'd go for sprites tho. You make images that look like balls then load then add them as sprites and reuse them. Particles would be even better depending on what you want to achieve. http://phaser.io/examples/v2/category/particles Thanks to all of you, I thought using vector is faster because the game like slither.io , it uses bitmapdata ? What's about high resolution sprite for smartphone? Link to comment Share on other sites More sharing options...
Recommended Posts