Getting a "RangeError: Maximum call stack size exceeded" javascript error when attempting to create a DataTable with a large number of rows

[Yolanda Davis]

I am attempting to create a DataTable with a large amount of rows,
which eventually is grouped and displayed as a smaller set using the
Table chart api. However if the size of the rows are over 20k then
the addRows method on the data table fails, producing the call stack
size exceeded message. I could not find information where this was
posted as a known bug nor did I see information on there being a data
size limitation on the data table. Is there any way to fix this or is
there a workaround available? If size is an issue can there be more
specific messaging around that limitation and improvements made to
avoid exceeding the stack?

[Riccardo Govoni ☢]

This has to do with the size of the array you pass to the addRows() method. 

If you add the rows one at a time, or in small batches, then no problem arises. For example:

http://jsfiddle.net/qgV4D/1/  : adding 100K rows one at a time

http://jsfiddle.net/qgV4D/3/ : adding 100K in batches of 10K at a time.

Here is an example of adding all the rows at the same time where your error shows up : http://jsfiddle.net/qgV4D/2/

The cause is likely residing in the addRows() implementation. I'm looking into it.

- R.

--
You received this message because you are subscribed to the Google Groups "Google Visualization API" group.
To post to this group, send email to google-visua...@googlegroups.com.
To unsubscribe from this group, send email to google-visualizati...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-visualization-api?hl=en.

[Yolanda Davis]

Riccardo,

Thanks for your response to this!  One thing to note is that I am not passing rows to the addRows method, I'm simply passing the number of rows and then later populate the table using the setValue method.  I get the error when I pass in the the number of rows to the addRows method.

Thank you for sending the examples.  I will see if I can use those for a workaround until this is resolved.

Thanks Again for your help!

Yolanda

2012/1/26 Riccardo Govoni ☢ <battl...@gmail.com>

[Yolanda Davis]

Riccardo,

Using your examples I was able to implement a workaround for my problem.  Instead of specifying the total number of rows upfront and then populating, I just call addRows method passing in 1 and then populate the one row using setValue. I'm doing something a bit more complex so I couldn't simply pass in an array. But this method works well for me until you are able to implement a fix.

Thanks again for the guidance,

Yolanda 

[Michael Shen]

Hi, Riccardo and Yolanda 

I am hitting the similar issue .

I have a very very large array named " tmp" (the array contains about 2,700,000 elements )

The page hang then  crash.

Would you please help me out , I am stuck at this for about 1 week :(

Would you mind if taking a look my codes ?

                        var data = new google.visualization.DataTable();

data.addColumn('string', 'Topping');

data.addColumn('number', 'Slices');

var tmp = [[,1],[,2],[,5] .................];                 <==== It 's a big array with about 2,700,000 elements                  

var rows = [];

data.addRows(tmp.length);

for (var i = 0; i < tmp.length; i++) {

data.setValue(i, 0, tmp[i][0]);

data.setValue(i, 1, tmp[i][1]);

}

 

Yolanda Davis於 2012年1月27日星期五UTC+8上午12時31分15秒寫道：

Yolanda

2012/1/26 Riccardo Govoni ☢ <battl...@gmail.com>

To unsubscribe from this group, send email to google-visualization-api+unsub...@googlegroups.com.

For more options, visit this group at http://groups.google.com/group/google-visualization-api?hl=en.

--
You received this message because you are subscribed to the Google Groups "Google Visualization API" group.
To post to this group, send email to google-visua...@googlegroups.com.

To unsubscribe from this group, send email to google-visualization-api+unsub...@googlegroups.com.

[Andrew Gallant]

Try replacing this:

data.addRows(tmp.length);

for (var i = 0; i < tmp.length; i++) {

    data.setValue(i, 0, tmp[i][0]);

    data.setValue(i, 1, tmp[i][1]);

}

with this:

for (var i = 0; i < tmp.length; i++) {

    data.addRow(tmp[i]);

}

I would also suggest making your null values explicit, eg:

var tmp = [[null,1],[null,2],[null,5]...];