Форум

KaraUL! · #1 (**permalink**) 12.07.2014, 16:08

Подскажите, есть ли какой-нибудь способ использовать переменную при задании свойства font? Ниже пример (конечно неправильный, просто для наглядности):

var canvas = document.getElementById('field');
var context = canvas.getContext('2d');

var fnt = canvas.width/2 + "px";
context.font = fnt;
context.strokeText("...", X, Y);

Необходим хоть какой-то способ, чтобы сделать размер шрифта зависимым от размеров канваса

рони · #2 (**permalink**) 13.07.2014, 13:58

KaraUL!,
подобрать коэффициент 1.8 в зависимости от шрифта

<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
 </head>

<body>
   <canvas id="field" width="400" height="400"></canvas>
   <script>
var canvas = document.getElementById('field');
var context = canvas.getContext('2d');
var str = 'Привет!', len = str.length;
var X = canvas.width/2, Y = canvas.height/2;
var fnt = Math.floor((canvas.width/len)*1.8) + "px Arial";
context.font = fnt;
context.textAlign = "center";
context.fillStyle = "#0000ff";
context.fillText(str, X, Y);
   </script>
</body>

</html>

Форум

Справочник

Discord чат

Курсы javascript