Pixi.js: drawRect๋ฅผ ์‚ฌ์šฉํ•  ๋•Œ ๋ชจ๋“ ๋ฉด์ด ์•„๋‹Œ Graphics ๊ฐ์ฒด ์ฃผ์œ„์˜ ์„ 

์— ๋งŒ๋“  2019๋…„ 02์›” 15์ผ  ยท  3์ฝ”๋ฉ˜ํŠธ  ยท  ์ถœ์ฒ˜: pixijs/pixi.js

์˜ˆ์ƒ๋˜๋Š” ๋™์ž‘

๊ฐœ์ฒด์˜ ๋ชจ๋“ ๋ฉด์— ์„ ์„ ๊ทธ๋ฆฝ๋‹ˆ๋‹ค.

ํ˜„์žฌ ํ–‰๋™

3๋ฉด์—๋งŒ ์„ ์ด ๊ทธ๋ ค์ง‘๋‹ˆ๋‹ค.
capture

๊ฐ€๋Šฅํ•œ ํ•ด๊ฒฐ์ฑ…

?

์žฌํ˜„ ๋‹จ๊ณ„

var testGraphic = new PIXI.Graphics();
testGraphic.beginFill(red).lineStyle(4, green);
testGraphic.drawRect(150, 150, 600, 200);
tool.stage.addChild(testGraphic);

ํ™˜๊ฒฝ

  • pixi.js ๋ฒ„์ „ : v5.0.0-rc
  • ๋ธŒ๋ผ์šฐ์ € ๋ฐ ๋ฒ„์ „ : Chrome 72.0.3626.81 (๊ณต์‹ ๋นŒ๋“œ) (64 ๋น„ํŠธ)
  • OS ๋ฐ ๋ฒ„์ „ : Windows 10
  • ์‹คํ–‰ ์˜ˆ :-
๐Ÿ•ท Bug

๋ชจ๋“  3 ๋Œ“๊ธ€

ํ™•์ธ, v4 ๋ฐ v5์—์„œ ๋‹ค๋ฆ…๋‹ˆ๋‹ค. endFill() ๋Š” ๋„์›€์ด๋˜์ง€ ์•Š์Šต๋‹ˆ๋‹ค.

https://www.pixiplayground.com/#/edit/K45xTRXqfExRiZ6VUmx61

๋‚˜๋Š” ๊ทธ๋Ÿฐ ๊ฒƒ์ด ๋‚˜ํƒ€๋‚  ๊ฒƒ์ด๋ผ๊ณ  ์ƒ๊ฐํ–ˆ๊ณ , ์šฐ๋ฆฌ๋Š” Graphics ํด๋ž˜์Šค๋ฅผ ๋‹ค์‹œ ์ž‘์„ฑํ–ˆ๊ณ  ์ถฉ๋ถ„ํžˆ ํ…Œ์ŠคํŠธํ•˜์ง€ ์•Š์•˜์Šต๋‹ˆ๋‹ค.

closePath ๋„ ๋„์›€์ด๋˜์ง€ ์•Š์Šต๋‹ˆ๋‹ค : https://www.pixiplayground.com/#/edit/QhH9QAw9gStIxvM2nUgYw

์ด ์Šค๋ ˆ๋“œ๋Š” ๋‹ซํžŒ ํ›„ ์ตœ๊ทผ ํ™œ๋™์ด ์—†์—ˆ๊ธฐ ๋•Œ๋ฌธ์— ์ž๋™์œผ๋กœ ์ž ๊ฒผ์Šต๋‹ˆ๋‹ค. ๊ด€๋ จ ๋ฒ„๊ทธ์— ๋Œ€ํ•œ ์ƒˆ ๋ฌธ์ œ๋ฅผ์—ฌ์‹ญ์‹œ์˜ค.

์ด ํŽ˜์ด์ง€๊ฐ€ ๋„์›€์ด ๋˜์—ˆ๋‚˜์š”?
0 / 5 - 0 ๋“ฑ๊ธ‰