CODEWITHSUNDEEP
javascriptcsshtmlhtml5-canvas
Polygons
Polygons

Reputation: 124

Can't draw text on html5 canvas

I'm just starting out JS with some previous programming knowledge from other languages. I've been trying to learn more JS by making a canvas that can render text.

https://jsfiddle.net/b5n2rypn/

The problem: The code above calls fillText but no text is rendered. It was working before I created the class RichText and started trying to draw using its methods. Didn't find any errors on console and I can't seem figure out what the issue is.

What is wrong with the code?

Upvotes: 0

Views: 169

Answers (1)

Mr_KoKa
Mr_KoKa

Reputation: 618

this.DOMText.style.width returns string not integer (eg. "128px") and then if you multiply it by ratio it will return NaN which is probably converted to 0. you would need to parseInt on w and h in your createCanvas function because now your canvases are 0x0 dimensions.

function createCanvas(w, h, ratio) {
        w = parseInt(w);
        h = parseInt(h);

        ...

Upvotes: 1

Related Questions