p5.js text accents displaying

arieluzal

I've been running into a small problem with a project trying to get p5.js to display accented characters (such as á) and other characters used in Spanish (such as ñ).

After some exploring, I found out that the problem only appears when using TrueType fonts. When using the default font or and OpenType font, accents are displayed correctly.

Does anybody know if there's a solution or workaround for this? I don't have OTF versions of the fonts I need for my project.

Here is some demo code

var FONT_TTF;
var FONT_OTF;

function preload() {
  FONT_TTF = loadFont("Arial.ttf");
  FONT_OTF = loadFont("TektonPro-Bold.otf");
}

function setup() {
  createCanvas(200, 100);
  fill(0);
  textFont(FONT_OTF);
  //textFont(FONT_TTF);
  text("Accents test: á é í ó ú ñ ", 50, 50);
}

Thanks!

GoToLoop

In general fonts don't have all the available Unicode characters.
In order to have accented characters we need to pick some font which got them.

arieluzal

Sure. Arial has all the characters I need.

Found a simple workaround converting my ttf fonts to otf.