Я хочу сделать рамку, которая плотно облегает мой текст на холсте p5.js — это можно сделать, но я могу понять, как это сделать, только загрузив в программу новый шрифт.
Можно ли создать плотную рамку за текстом с помощью шрифта по умолчанию, чтобы избежать загрузки нового шрифта?
Дополнительное объяснение
Чтобы получить плотную рамку вокруг текста на холсте, используется метод textBounds() для получения границ текста. Вы получите положение углов блока, которое плотно прилегает к вашему тексту. Теперь в примере p5.js, найденном по адресу http://p5js.org/reference/#/p5.Font/textBounds, который я поместил во фрагмент кода ниже, кажется, что вы должны загрузить шрифт с loadFont() перед использованием textBounds(), чтобы получить границы блока, содержащего текст. Мой вопрос: как это сделать без загрузки шрифта и просто с использованием шрифта по умолчанию?
Например, мне пришлось использовать внешний шрифт Google для «Фрагмента кода» ниже. Я бы предпочел просто поставить рамку за шрифтом по умолчанию, чтобы не загружать какой-либо шрифт.
let font;
let textString = 'Lorem ipsum dolor sit amet.';
function preload() {
font = loadFont('https://raw.githubusercontent.com/google/fonts/master/ofl/alikeangular/AlikeAngular-Regular.ttf');
}
function setup() {
background(210);
let bbox = font.textBounds(textString, 10, 30, 12);
fill(255);
stroke(0);
rect(bbox.x, bbox.y, bbox.w, bbox.h);
fill(0);
noStroke();
textFont(font);
textSize(12);
text(textString, 10, 30);
}<script src="https://cdn.jsdelivr.net/npm/[email protected]/lib/p5.min.js"></script>
