| | |
| | | import * as TWEEDLE from 'tweedle.js'; |
| | | |
| | | const Map = () => { |
| | | const map = React.useRef(); |
| | | |
| | | React.useEffect(() => { |
| | | const app = new PIXI.Application({ |
| | | width: window.innerWidth, |
| | | height: window.innerHeight, |
| | | background: '#1099bb', |
| | | antialias: true, |
| | | }) |
| | | |
| | | |
| | | app.stage.interactive = true; |
| | | app.stage.hitArea = app.screen; |
| | | |
| | | globalThis.__PIXI_APP__ = app; |
| | | |
| | | document.body.appendChild(app.view); |
| | | map.current.appendChild(app.view); |
| | | |
| | | return () => { |
| | | app.destroy(true, true); |
| | | } |
| | | }, []); |
| | | |
| | | return ( |
| | | <> |
| | | <h1>Map</h1> |
| | | <div |
| | | ref={map} |
| | | > |
| | | </div> |
| | | </> |
| | | ) |
| | | } |