.fillText() in a canvas box

[FlatPepsi]

I’m working on a weather graph, and using a Canvas box to draw the lines. It’s based off of MMM-Forecast-io, which has a good basic precip graph.

I’m having issues adding text labels into the graph. Trimming the code down, this is what I’m trying to do:

var element = document.createElement('canvas');            
var context = element.getContext('2d');
context.font = "10px Arial";
context.fillText("X", 10, 10 );   // problem here

If I include that last line, the module breaks. What’s the right way to put text in a a Canvas box?

Also, when I break modules doing stuff like this, how do you see an error message to get an idea of what went wrong?

[cowboysdude]

This post is deleted!

[Cato]

Since you’re asking how to see the error message I guess you don’t really know if that line has an error or just don’t do what you thought.

To see errors, open your mirror in a browser and press F12 for developer tools. Look in Console tab.

Syntax of fillText: https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial/Drawing_text

[FlatPepsi]

@Cato Thanks - that was the key to what I needed.

My coordinates for placing the text was using a variable “TempY”, when I had earlier defined it as “tempY”. Stupid case sensitive variable names.

tl;dr: I’m an idiot.

Thanks for the tip, now I can see error messages, and my FillText() command is working.

[Cato]

@FlatPepsi remember is fillText with a small f … 😉

[FlatPepsi]

@Cato [facepalm] Further proof that my heritage is from case-insensitive programming languages.