Jump to content

is there good idea to draw dom into canvas by pixi.js


GBear
 Share

Recommended Posts

23 hours ago, ivan.popelyshev said:

If you want to dig into something, look at https://github.com/pixijs/pixi-ui

pixi-ui have not used dom. , isn't it?

is there some controller to positioning or sizing of dom with container?

if i use dom, i will make domContainer.

it will be control size or position as PIXI.Container..

if i couldn't find it, i will make it.. 



give me any idea  please



 

Link to comment
Share on other sites

On 23/07/2017 at 10:47 AM, ivan.popelyshev said:

For your game I dont recommend to use DOM it at all, FPS will go down.

I'm always alarmed by statements like this, why do you think this? Have you got any evidence where this happens?

I've never really tested it but adding a DOM UI layer above a canvas has never affected my fps at all, I've never explicitly tested it though, so wondering if you had a test case or knew of one.

The advantages of using the DOM to draw a largely static UI are great, and I've never noticed any FPS hit at all, have I missed something? I can't think why it would affect the FPS of the canvas element much at all.

Link to comment
Share on other sites

11 hours ago, GBear said:

pixi-ui have not used dom. , isn't it?

is there some controller to positioning or sizing of dom with container?

if i use dom, i will make domContainer.

it will be control size or position as PIXI.Container..

if i couldn't find it, i will make it.. 



give me any idea  please



 

Like I mentioned, PixiJS has no mechanism to help you with it. But you can draw DOM to a canvas, if you search for methods/libraries. For example, MDN article about it: https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Drawing_DOM_objects_into_a_canvas

1 hour ago, mattstyles said:

I'm always alarmed by statements like this, why do you think this? Have you got any evidence where this happens?

I've never really tested it but adding a DOM UI layer above a canvas has never affected my fps at all, I've never explicitly tested it though, so wondering if you had a test case or knew of one.

The advantages of using the DOM to draw a largely static UI are great, and I've never noticed any FPS hit at all, have I missed something? I can't think why it would affect the FPS of the canvas element much at all.

Because if you have DOM on top of the canvas (or a transparent canvas with DOM behind it) the browser has to composite the DOM it renders with your canvas. If there is no DOM above the canvas (and the canvas isn't transparent) it can just blit your output texture, which is much faster. The performance difference exists and is measurable, however many applications won't bump into this.

Link to comment
Share on other sites

@xerver

hi xerver.

thank you for your mention..  ...

we know dom is not good to draw with renderable system to make game. if UI System has huge or complex , i will be more not good.

but i'm thinking to integrate game and hompage or other something...

so i'm checking many functions to make good.. or useful...

so i'm checking many many ideas with more specialist better than me, like you or ivan.. or mattstyle?

^^ i have to do something to go to next step.for my idea..

thx





 

Link to comment
Share on other sites

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.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...