Welcome!

Welcome to the official BlackBerry Support Community Forums.

This is your resource to discuss support topics with your peers, and learn from each other.

inside custom component

Web and WebWorks Development

Reply
Developer
Posts: 482
Registered: ‎10-24-2008
My Device: 9300
My Carrier: AT&T

graphing and Canvas support

Are there any plans to add a Canvas element to the BlackBerry browser ( or at least in the widget implementation) ?

 

I have looked at several graphing libraries (jsgraphs, raphael, bluff, etc...) and every time I want to implement anything I am taken back by the lack of canvas support.

 

Are there any graphing options that I can use today on the Widget platform?

_________________________________________
www.jasonmace.com/blackberry
Retired
Posts: 3,708
Registered: ‎10-16-2008
My Device: Z10
My Carrier: Rogers

Re: graphing and Canvas support

Canvas will be supported with Webkit when it is introduced in the BlackBerry OS.  What you can use today for graphing is SVG Tiny 1.1.  

 

SVG provides 2D vector graphics with animation.  In 5.0 you also have full DOM level access to the SVG embedded object and can trigger animations and modify its DOM through JavaScript.

Tim Neil
Director, Application Platform & Tools Product Management
Follow me on Twitter
New Contributor
Posts: 2
Registered: ‎09-01-2010
My Device: Simulators

Re: graphing and Canvas support

Hi there,

 

I am the author of a popular JavaScript charting software library based on SVG inline in web pages.

 

In modern browsers this will work in any web page when called from window.onload:

 

 

var box = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
box.setAttribute('width', 600);
box.setAttribute('height', 400);
box.setAttribute('xmlns', 'http://www.w3.org/2000/svg');
box.setAttribute('version', '1.1');
document.body.appendChild(box);

var rect = document.createElementNS('http://www.w3.org/2000/svg', 'rect');
rect.setAttribute('width', 100);
rect.setAttribute('height', 100);
rect.setAttribute('x', 100);
rect.setAttribute('y', 100);
rect.setAttribute('stroke-width', 5);
rect.setAttribute('stroke', '#0000FF');
rect.setAttribute('xmlns', 'http://www.w3.org/2000/svg');
box.appendChild(rect);

 ... but this doesn't seem to give any results on the BlackBerry OS version 5. Is inline SVG even supported in version 5?

 

In BlackBerry OS v6 with the WebKit engine, the charts work out of the box.

 

Thanks,

Torstein

 

Retired
Posts: 3,708
Registered: ‎10-16-2008
My Device: Z10
My Carrier: Rogers

Re: graphing and Canvas support

In OS 5.0 SVG is supported in an <object> element with the proper type set.  The inline <svg> element is not supported in 5.0.

 

However you can still manipulate the SVG from the object in your JavaScript like you have shown to create rectangles etc.

Tim Neil
Director, Application Platform & Tools Product Management
Follow me on Twitter
New Contributor
Posts: 2
Registered: ‎09-01-2010
My Device: Simulators

Re: graphing and Canvas support

Thanks Tim, I'll see what I can do with the object approach.