opentype for pixi v4
by Bouh
HTML
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Type exemple</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pixi.js/4.5.1/pixi.min.js"></script>
<script src="https://www.studiokori.com.br/typeExample/1.7/js/type.min.js" charset="utf-8"></script>
</head>
<body>
<script type="text/javascript">
//creating loader to load fonts
var loader = new type.Loader();
//adding fonts using add method
//example: .add('century', 'fonts/century.ttf');
loader.add('monogram', 'https://cdn.jsdelivr.net/gh/pilssken/assets/fonts/monogram.ttf');
loader.add('playtime', 'https://www.studiokori.com.br/typeExample/1.7/fonts/playtime.ttf');
//adding listener to verify when fonts have been loaded
loader.once('loadComplete', init);
//load fonts
loader.load();
function init(){
//creating PIXI
var app = new PIXI.Application(1024,500, {transparent: true});
document.body.appendChild(app.view);
//creating TEXT with area 600x600 px
var myText = new type.text.TextField(600,600);
//seting text with tags for style
//exemple: .setText('text', styleObject)
myText.setText(
'<tag>Nada do que é <into>social e humano</into> é mais\nreal que as <anothertag>utopias.</anothertag> Na sua vertente eutópica,\nas utopias constituíram sempre o fundamento <under>simbólico e mítico</under>...</tag>',
{
align: 'justify',
tag: {
fontFamily: "monogram",
fontSize: 50,
fill: "red"
},
into: {
fontFamily: "playtime",
fontSize: 50,
fill: "green"
},
anothertag: {
fontWeight: "bold",
...