Get canvas with a reference instead of an id


« Back to message list

Enter your email address to get email updates on this topic. You can stop receiving updates by clicking the link in the update email messages.

Posted by David Bonet on 15th January 2014
I generate many graphs with javascript in a WebApp.
I have realized that the Line graph and Bar graph (I have not looked at the other) get an ID for get the canvas. For my purposes, I modified the code for accepting a reference of the DOM Object.

My question is, they accept only an ID or they have a form to receive a Dom Object reference?

Anyway, your work is fantastic. Congratulations and thanks.
Posted by Richard on 15th January 2014
Hi there,

No - just the ID. But it's trivial to get the id if you have a DOM object:

myBar = RGraph.Bar(myDOMObject.id, [4,8,6,3,2,2,1]);





Richard
www.rgraph.net
Please link to the RGraph website. Thanks!
Posted by David Bonet on 15th January 2014
Thanks for the quick answer.

The problem is if the DOM Object is not inserted yet in the document (usual practic in complex WebApp, in my case is a tactical game with many economy related graphs) seem to not find the canvas.

In my modified versiĆ³n (I simply removed getElemetById) seems to have problems with tooltips.
Posted by Richard on 15th January 2014
Hi there,

I don'y know what you're asking - if the canvas isn't part of the DOM you can draw the chart when you do add it and then just give it the ID.



Richard, RGraph Support
www.rgraph.net
Please link to the RGraph website
Posted by David Bonet on 15th January 2014
Sorry, I have some difficulties speaking English.

I will try to explain me better.

Canvas can render offscreen. My program structure is that a Object "X" makes a new instance of the Object "Y". This instance return a DOM Object and "X" append this DOM Object to the document. The reason for this is that the returned DOM Object has hundreds of childs and append one per one would be very slow.

Then, I append the canvas in a not inserted Dom Object and then draw the graph in this offscreen canvas. When this is complete, the Object X append all to the document with only one insertion.

This is why I need pass a DOM Object not inserter in Document to Rgraph.

I hope tha my explanations are good.
Posted by Richard on 15th January 2014
Hi there,

You would need to change the source then if you wanted to pass a DOM object. Or you could use an offscreen canvas. Optionally deleted when you add the real canvas to the DOM.

eg


var ca = document.createElement('CANVAS');
     ca.width = 600;
     ca.height = 250;
     ca.id = 'cvs';
     ca.style.top = '-1000px';
     ca.style.left = '-1000px';
     ca.style.position = 'absolute';
document.body.appendChild(ca);



Richard, RGraph Support
www.rgraph.net
Please link to the RGraph website
Posted by Richard on 15th January 2014
Hi there,

Also, if you use a temporary off-screen canvas - you could use the jQuery .replaceWith() function to replace the canvas in the DOM (once it has been added) with the off-screen canvas.



Richard, RGraph Support
www.rgraph.net
Please link to the RGraph website. Thanks!
Posted by David Bonet on 16th January 2014
Good idea. Thanks.
And great library!

As a personal suggestion would be nice if it could draw graphs whitout inserting the canvas in the Document. :)
Posted by Richard on 16th January 2014
Hi there,

For RGraph3 (the next release) as well as giving the id of the canvas to each charts constructor you'll be able to give an object which has the canvas object (assuming it works!). Eg

bar = new RGraph.Bar({canvas: myCanvas}, [4,8,6,3,5,2,1]);


Richard
www.rgraph.net
Please link to the RGraph website. Thanks!

Add a reply

 




« Back to message list
RGraph on social media