How to draw all emojis using p5.js

user_14070642 0
Viewed 1710

I'm try to draw emoji on p5.js canvas. But on windows platform, some emoji are displayed only them outline.(e.g. ☀) When I using, I could display on html element but couldn't on p5.js canvas. Is there good and simple method for displaying emojis correctly on windows?

p5.js javascript
1 Answers

Live Code Example

Make sure you actually use the emoji correctly, the easiest way is to copy from Emojipedia. (You can also type these emojis by pressing and holding the Windows Key + . (period) if on Windows))

function setup() {
  createCanvas(400, 400);
}

function draw() {
  background(220);
  textSize(64);
  textAlign(CENTER)
  text('', width/2, height/2);
  text('☀️️', width/2, height/2 + 100);
}

Remember, under the hood, the p5.js library is just that: a library. This meaning it can easily be converted to normal javascript, so you can search up how to draw emojis in the html <canvas>, and you find this. This shouldn't be marked as duplicate, though, because p5js has different commands to display this compared to just using ctx..

user_121015540
Related