Pixijs Fit Text to Container
tiling sprite bleeding
HTML
<script src="https://pixijs.download/v5.3.7/pixi.js"></script>
<canvas id="pen-canvas"></canvas>
CSS
body {
margin: 0;
padding: 20px;
overflow: hidden;
background:#fff;
}
#pen-canvas{
}
JavaScript
var w=280
var h=(w/(16/9))
const app = new PIXI.Application({
antialias: false,
width:w,
height:h,
view: document.getElementById("pen-canvas"),
});
//PIXI.settings.ROUND_PIXELS = true;
//PIXI.settings.PRECISION_FRAGMENT = PIXI.PRECISION.HIGH;
demoText= new PIXI.Text('Fit to Canvas',{
"align": "center",
"fontSize":120,
"padding": 25,
"fill": ["#ffffff"],
}
);
demoText.anchor.set(0.5);
demoText.x=w/2
demoText.y=h/2
fx= demoText.width/demoText.height
demoText.width =w
demoText.height =w/fx
$container = new PIXI.Container();
app.stage.addChild(demoText);