(note: using the dhmlxchart_debug from chart-3.0 code for line numbers and code descriptions)
When creating a stacked bar chart, if the first series contains values of 0 and a following series contains a non-zero value for the same bar, browsers will blow up when trying to display the first series with a non-zero value for the field which was 0-valued in the original series:
- Safari will raise NOT_SUPPORTED_ERR: DOM Exception 9: The implementation did not support the requested type of object or operation. on line 4727
- Chrome will raise the similar Uncaught Error: NOT_SUPPORTED_ERR: DOM Exception 9 on the same line
- Firefox 4 will raise An invalid or illegal string was specified" code: "12 on line 1693
Using the Webkit dev tools, I tracked down the issue to dhtmlx.chart.stackedBar.pvt_render_stackedBar and its usage of $startY:
In the loop over row data (line 1609), the first action is to skip everything on a falsy value. This means .$startX will not be set (at all) if the first series contains an empty value, since .$startX is set at the end of the (skipped) iteration.
During the iteration over the second series, y0 will be set to [i]data.$startY (line 1625), which will be undefined. The method will then call _setStakedBarPoints providing a y0 value of undefined making Firefox 4 blow up on the first ctx.moveTo(x0, undefined).
Webkit browsers apparently don’t mind (or at least don’t error out on) moveTo(x, undefined) but if a gradient is defined we’ll get a call to _setBarGradient(ctx, x1, undefined, …) followed by calls to ctx.createLinearGradient(x1, undefined, x2, undefined). The Webkit browsers blow up on that call (line 4727 in case of a 3D gradient, which is what we were using).
This issue can be trivially reproduced via the 06.05 sample (Bar Chart > Stacked Chart) provided with dhtmlxGraph by applying the following patch:
[code]=== modified file ‘dhtmlxGraph/samples/06_bar_chart/05_stacked_chart.html’
— dhtmlxGraph/samples/06_bar_chart/05_stacked_chart.html 2011-04-08 08:50:05 +0000
+++ dhtmlxGraph/samples/06_bar_chart/05_stacked_chart.html 2011-06-20 12:36:16 +0000
@@ -21,7 +21,7 @@
var data = [
{ sales:“3.0”,sales1:“3.4”,sales2:“1.2”,sales3:“6.9”, year:“2000” },
-
{ sales:"5.0",sales1:"5.0",sales2:"5.0",sales3:"5.0", year:"2001" },
-
];{ sales:"0",sales1:"5.0",sales2:"5.0",sales3:"5.0", year:"2001" }, { sales:"3.4",sales1:"4.7",sales2:"1.9",sales3:"5.5", year:"2002" }
function init(){
[/code]
(I am simply setting the second “sales” value to “0”, “sales” being the first series in the demo chart).
I am expecting the same issue to exist (for $startX) for horizontal bar charts.
I believe this can be fixed by adding “|| y0” at the end of line 1625 (so that y0 defaults to point1.y if [i]data.$startY is undefined and we’re at a series further along than #1). However, I am not certain this is the right fix.
A similar fix can be performed for [i]data.$startX in pvt_render_stackedBarH, line 1490 (also note: lines 1460-1461 and 1463-1464 are duplicates).