topic Hi Paul, in Software Archive

A problem with canvas

Anne_B_ — Sun, 15 Mar 2015 12:49:12 GMT

Hello,

I want to draw a timeline using the <canvas> element but I'm having problems getting a handle on it.

Here is the canvas declared in the index.html file:

</div>

(the size here is just for testing, ideally I would want to adjust this according to the size of the window although I'm not sure exactly how that can be done but I'm not there yet ;-))

Here is the javascript to get the canvas object:

canvas = document.getElementById("dailycanvas").innerHTML; // (I've tried with and without ".innerHTML")
context = canvas.getContext("2d");

which throws the following error:

Uncaught TypeError: undefined is not a function

I'm using App Framework with appframework.js and appframework.ui.js. Do I need other libraries?

Thanks in advance for any insights you may have on this

Those lines should work

PaulF_IntelCorp — Mon, 16 Mar 2015 23:26:44 GMT

Those lines should work (without the innerHTML bit), I recommend you add a "var" in front of them. See this tutorial from Mozilla: https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial/Basic_usage

Hi Paul,

Anne_B_ — Tue, 17 Mar 2015 08:45:12 GMT

Hi Paul,

Thanks for your help.

I added the vars and removed the .innerHTML and no longer get the error. I've tried adding some code from the link you sent me and that works but I still can't get the width of the canvas which shows up as undefined. I'll continue to go through the tutorial and hopefully I'll find what I'm doing wrong.

Have a great day.