SinhNQ Posted September 14, 2018 Share Posted September 14, 2018 Hello, * Introducing a bit of pixi.js: pixi.js has full webgl support, a best framework for 2D game with rendering very fast. Would be great if you want make UI game with pixi.js and combine with babylon.js. (Will I get paid for advertising? NO..?) Demo babylon.js + pixi.js : https://jsfiddle.net/y5q7Lb1v/21/ This is a perfect duo for your web game world, which you can create high quality games. ? Moreover, you can also use GSAP for creating high-performance animations. Demo babylon.js + pixi.js + GSAP lib: https://jsfiddle.net/y5q7Lb1v/28/ kuuuurija, jerome, PeterL2C and 5 others 8 Quote Link to comment Share on other sites More sharing options...
Guest Posted September 14, 2018 Share Posted September 14, 2018 Excellent!!!! Quote Link to comment Share on other sites More sharing options...
jerome Posted September 15, 2018 Share Posted September 15, 2018 amazing ! Quote Link to comment Share on other sites More sharing options...
SinhNQ Posted September 15, 2018 Author Share Posted September 15, 2018 Thanks Dk and jerome! ? Quote Link to comment Share on other sites More sharing options...
Guest Posted September 17, 2018 Share Posted September 17, 2018 You should do a PR to the doc site to document how you do it! Quote Link to comment Share on other sites More sharing options...
JackFalcon Posted September 17, 2018 Share Posted September 17, 2018 2D + 3D Hybrid approach is really cool! Might we call it 4D or 5D? HYBRID MIXES like this can be HIGHLY-EFFECTIVE. Didn't know Pixi.js + Babylon could work, really intriqued! But DID HAVE SUCCESS mixing: Babylon + GSAP AND Babylon + jQuery! (surprize!) Don't laugh. Stop laughing. : ) There is a reason... for mixing Babylon and jQuery. jQuery.animate turned out to be just as good as GSAP(if not better).... and FREE. : ) Most Importantly: integration is lightweight and seamless. Example shortly, in upcoming BJS release. Can't wait to try this... +1 LIKE for BJS+Pixi.js && HYBRID~5D. Jack : ) GameMonetize 1 Quote Link to comment Share on other sites More sharing options...
SinhNQ Posted September 18, 2018 Author Share Posted September 18, 2018 22 hours ago, Deltakosh said: You should do a PR to the doc site to document how you do it! OK i will do it when there is free time. Should i add into Resources/Library folder in the Document? Quote Link to comment Share on other sites More sharing options...
SinhNQ Posted September 18, 2018 Author Share Posted September 18, 2018 Hi Jack! I don't think babylon.js can mix with jQuery, jQuery.animate only effect for a object of CSS properties. With GSAP lib - TweenMax.js is FREE ? Quote Link to comment Share on other sites More sharing options...
JackFalcon Posted September 18, 2018 Share Posted September 18, 2018 @SinhNQ, 1) Interpolate range and use callback state to apply state to BJS, is how. Really surprised how well that works. Made transition myself after all of the above ANIMATION REVIEW. 2) Looking into GSAP license, at that time, it was free "non-commercial". Tricky. Perhaps they changed it? : ) Quote Link to comment Share on other sites More sharing options...
SinhNQ Posted September 18, 2018 Author Share Posted September 18, 2018 1) Basically, TweenMax.js will interpolate the value of the target over time and assign that value to the target. Above example: the target is ground.rotation, value is y. TweenMax.js will interpolate from current value ground.rotation.y to Math.PI * 2. 2) I have not read the license for a long time, I do not know if they have changed or not. All my games use TweenMax.js for free. JackFalcon 1 Quote Link to comment Share on other sites More sharing options...
Guest Posted September 18, 2018 Share Posted September 18, 2018 6 hours ago, SinhNQ said: Should i add into Resources/Library folder in the Document? yep please! Quote Link to comment Share on other sites More sharing options...
Vorion Posted September 19, 2018 Share Posted September 19, 2018 Is this the best solution to combine pixi.js and babylon.js? I'm currently also using pixi.js for my game gui, but as I haven't found any examples, I just set up a second canvas for pixi.js. Which one would be better, performance-wise? My approach looks like this: https://jsfiddle.net/yapv3Lfc/1/ JackFalcon 1 Quote Link to comment Share on other sites More sharing options...
SinhNQ Posted September 19, 2018 Author Share Posted September 19, 2018 Hi Vorion! The use of 2 canvases are the bad performance. With my solution, babylon.js and pixi.js shared webgl context, them will give better performance. GameMonetize, JackFalcon, Vorion and 1 other 4 Quote Link to comment Share on other sites More sharing options...
abhivaidya Posted September 20, 2018 Share Posted September 20, 2018 This is really cool! Quote Link to comment Share on other sites More sharing options...
Vorion Posted September 20, 2018 Share Posted September 20, 2018 On 9/19/2018 at 4:27 AM, SinhNQ said: Hi Vorion! The use of 2 canvases are the bad performance. With my solution, babylon.js and pixi.js shared webgl context, them will give better performance. Ok, thank you, I will switch to your solution then Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.