PIXI Text

showing pixi text resolution

by williammanco

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/pixi.js/3.0.11/pixi.js"></script>
<canvas id="pixi-canvas" width="800" height="300"></canvas>
<div class="txt">
<p class="txt_10">
15px html: К сожалению, Ваше устройство не поддерживает минимальное разрешение игры
</p>
<p class="txt_8">
8px html: К сожалению, Ваше устройство не поддерживает минимальное разрешение игры
</p>
</div>

CSS

.txt {
  margin-top: 15px;
  padding: 15px;
  width: 800px;
  heigth: 300px;
  background-color: black;
  font-family: Arial;
  color: white;
}
.txt_10 {
  font-size: 15px;
}

.txt_8 {
  font-size: 8px;
}

JavaScript

var renderer = PIXI.autoDetectRenderer(800, 300, {view: document.getElementById("pixi-canvas") });
renderer.backgroundColor = 0x000000;


var stage = new PIXI.Container();
var style = {
font: 'bold 15px Arial',
fill: '#ffffff'
};

var style2 = {
font: 'bold 8px Arial',
fill: '#ffffff'
};

var reg1 = new PIXI.Text('15px resolution 1: К сожалению, Ваше устройство не поддерживает минимальное разрешение игры', style);
reg1.resolution = 1;
reg1.x = 50;
reg1.y = 50;
stage.addChild(reg1);

var reg2 = new PIXI.Text('15px resolution 2: К сожалению, Ваше устройство не поддерживает минимальное разрешение игры', style, 2);
reg1.resolution = 2;
reg2.x = 50;
reg2.y = 80;
stage.addChild(reg2);

var reg3 = new PIXI.Text('15px resolution 3: К сожалению, Ваше устройство не поддерживает минимальное разрешение игры', style, 3);
reg3.resolution = 3;
reg3.x = 50;
reg3.y = 110;
stage.addChild(reg3);

var reg4 = new PIXI.Text('15px resolution 4: К сожалению, Ваше устройство не поддерживает минимальное разрешение игры', style, 4);
reg4.resolution = 4;
reg4.x = 50;
reg4.y = 140;
stage.addChild(reg4);

var reg1_2 = new PIXI.Text('8px resolution 1: К сожалению, Ваше устройство не поддерживает минимальное разрешение игры', style2);
reg1_2.resolution = 1;
reg1_2.x = 50;
reg1_2.y = 170;
stage.addChild(reg1_2);

var reg2_2 = new PIXI.Text('8px resolution 2: К сожалению, Ваше устройство не поддерживает минимальное разрешение игры', style2, 2);
reg1_2.resolution = 2;
reg2_2.x = 50;
reg2_2.y = 200;
stage.addChild(reg2_2);

var reg3_2 = new PIXI.Text('8px resolution 3: К сожалению, Ваше устройство не поддерживает минимальное разрешение игры', style2, 3);
reg3_2.resolution = 3;
reg3_2.x = 50;
reg3_2.y = 230;
stage.addChild(reg3_2);

var reg4_2 = new PIXI.Text('8px resolution 4: К сожалению, Ваше устройство не поддерживает минимальное разрешение игры', style2, 4);
reg4_2.resolution = 4;
reg4_2.x = 50;
reg4_2.y = 260;
stage.addChild(reg4_2);

animate();

function...