test-websonts

by palanolho

HTML

<head>
  <title></title>
  <script src="https://ajax.googleapis.com/ajax/libs/webfont/1.6.26/webfont.js"></script>
  <script src="https://pixijs.download/v4.8.1/pixi.min.js"></script>
  
  <link href="https://fonts.googleapis.com/css?family=Lato:400,700,900" rel="stylesheet">
  <!--link rel="stylesheet" type="text/css" href="fonts/fonts.css"-->
  
</head>

<body>
  <script type="text/javascript" src="script.js"></script>

</body>

JavaScript

WebFont.load({
	google: {
		families: ['Lato']
	},
	active: function() {
		init();
	  }
});


var app = new PIXI.Application(600, 375, { 
	antialias: true,
	backgroundColor : 0xffffff
});
document.body.appendChild(app.view);


function init() {
	var textNormal = new PIXI.Text( "This is normal text 123", {
		fontFamily: 'Lato',
		fontSize: 50,
		//fontStyle: 'italic',
		fontWeight: "normal",
		fill: ['#000000'], // gradient
	});
	textNormal.position.set(10, 10);
  
  var textBold = new PIXI.Text( "This is a Bold text 123", {
		fontFamily: 'Lato',
		fontSize: 50,
		//fontStyle: 'italic',
		fontWeight: "bold",
		fill: ['#000000'], // gradient
	});
  	textBold.position.set(10, 100);
  
  var textBlack = new PIXI.Text( "This is a Black text 123", {
		fontFamily: 'Lato',
		fontSize: 50,
		//fontStyle: 'italic',
		fontWeight: 900,
		fill: ['#000000'], // gradient
	});
  	textBlack.position.set(10, 200);
    
   var textBlackStroke = new PIXI.Text( "This is a Black text 123", {
		fontFamily: 'Lato',
		fontSize: 50,
		//fontStyle: 'italic',
		fontWeight: 900,
		fill: ['#000000'], // gradient
    stroke: '#000000',
		strokeThickness: 3
	});
  	textBlackStroke.position.set(10, 275);
  		
	app.stage.addChild(textNormal, textBold, textBlack, textBlackStroke);
	

}