pixi-react icon indicating copy to clipboard operation
pixi-react copied to clipboard

Bug: unable to see "Hello world" text from readme example?

Open cmdcolin opened this issue 1 year ago • 2 comments
trafficstars

Current Behavior

renders the bunny but not the hello world(?)

Expected Behavior

renders the hello world

Steps to Reproduce

copy from readme running example on stackblitz https://stackblitz.com/edit/vitejs-vite-8xdhfy?file=src%2FApp.tsx

Environment

pixi.js@"^7.4.0" @pixi/react@"^7.1.1" [email protected] [email protected] project firefox 122.0.1 snap ubuntu 23

Possible Solution

No response

Additional Information

console log with hello:true PixiJS 7.4.0 - WebGL 2 - https://pixijs.com

screenshot image

cmdcolin avatar Feb 25 '24 03:02 cmdcolin

i am only asking cause the code sample has code like


      <Container x={200} y={230}>
        <Text
          text="Hello World"
          anchor={{ x: 0.5, y: 0.5 }}
          filters={[blurFilter]}
        />
      </Container>

note: new to pixi :) just looking about

cmdcolin avatar Feb 25 '24 03:02 cmdcolin

Oh yes, but its just that we render black text on a black background here. Changing the color makes it visible:

import { BlurFilter, TextStyle } from 'pixi.js'; // add TextStyle import
// [...]
      <Container x={200} y={230}>
        <Text
          text="Hello World"
          anchor={{ x: 0.5, y: 0.5 }}
          filters={[blurFilter]}
          style={new TextStyle({
            fill: ['#ffffff'],
          })}
        />
      </Container>

zOadT avatar Feb 25 '24 20:02 zOadT