Generic method for plotting differently sized data to a line chart

17 views
Skip to first unread message

Justin Stay

unread,
May 7, 2017, 12:44:01 PM5/7/17
to Google Visualization API
I have many (2+, number unknown at time of generation) of 1D data sets that I would like to plot together.  This data is being queried from a MySQL database.  The generation of these datasets are captured through N queries (where there are N lines to plot on the line chart).  For example:

Dataset #1:  MySQL query results a data set with M1 (x,y) data points
Dataset #2:  M2 (x,y) data points
etc . . .

Such that you end with some number of datasets that are not the same length nor share the same x values.

I have seen a few questions/examples that seem to address this question using the join method (https://developers.google.com/chart/interactive/docs/reference#join).  This approach requires the dt1columns argument is different for each joining of an additional data set.

Is this approach the only method for solving this problem?  Is there a better approach?  No other plotting tool I've used requires that each data set be the same size.

Thanks!

Daniel LaLiberte

unread,
May 7, 2017, 12:54:33 PM5/7/17
to Google Visualization API
Hi Justin,

I'm not sure I understand what you mean by "This approach requires the dt1columns argument is different for each joining of an additional data set.", but that sounds wrong.  You could join the same columns in different datatables each time.  The result of each join is a new datatable, so you could do a loop like this:

dtJoin = dtables[0];
for (i = 1; i < dtables.length; i++) {
  dtJoin = google.visualization.data.join(dtJoin, dtables[i], joinMethod, joinKeys, 1, 1);
}

--
You received this message because you are subscribed to the Google Groups "Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-visualization-api+unsub...@googlegroups.com.
To post to this group, send email to google-visualization-api@googlegroups.com.
Visit this group at https://groups.google.com/group/google-visualization-api.
To view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/a6ee493c-11db-4303-9268-ac56e1cdefb5%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.



--

Daniel LaLiberte

unread,
May 7, 2017, 1:02:51 PM5/7/17
to Google Visualization API
Ah, I see.  Since you want n lines, one for each of your datatables, then, yes, you need to put them in different columns.  It would not be a join in that case.  Just add more rows to the one datatable.  For each row of data, just use nulls for all the columns where you don't have a value.    It might be good enough to leave null values undefined, but I suspect the rows have to be the same length.  You could ensure that by just adding a last column.  

for (i = 0; i < numRows; i++) {
  var row = [];
  row[0] = dt.getValue(i, 0);
  row[i] = dt.getValue(i, 1);
  row[numCols] = null;
}
mergedDatatable.addRow(row);


On Sun, May 7, 2017 at 12:54 PM, Daniel LaLiberte <dlali...@google.com> wrote:
Hi Justin,

I'm not sure I understand what you mean by "This approach requires the dt1columns argument is different for each joining of an additional data set.", but that sounds wrong.  You could join the same columns in different datatables each time.  The result of each join is a new datatable, so you could do a loop like this:

dtJoin = dtables[0];
for (i = 1; i < dtables.length; i++) {
  dtJoin = google.visualization.data.join(dtJoin, dtables[i], joinMethod, joinKeys, 1, 1);
}
On Sun, May 7, 2017 at 11:28 AM, Justin Stay <justi...@gmail.com> wrote:
I have many (2+, number unknown at time of generation) of 1D data sets that I would like to plot together.  This data is being queried from a MySQL database.  The generation of these datasets are captured through N queries (where there are N lines to plot on the line chart).  For example:

Dataset #1:  MySQL query results a data set with M1 (x,y) data points
Dataset #2:  M2 (x,y) data points
etc . . .

Such that you end with some number of datasets that are not the same length nor share the same x values.

I have seen a few questions/examples that seem to address this question using the join method (https://developers.google.com/chart/interactive/docs/reference#join).  This approach requires the dt1columns argument is different for each joining of an additional data set.

Is this approach the only method for solving this problem?  Is there a better approach?  No other plotting tool I've used requires that each data set be the same size.

Thanks!

--
You received this message because you are subscribed to the Google Groups "Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-visualization-api+unsubscr...@googlegroups.com.
--

Justin Stay

unread,
May 8, 2017, 8:30:57 AM5/8/17
to Google Visualization API
Daniel,

I don't quite follow your code in your last post.  Could you explain conceptually what you are doing?  Where and how are dt and mergedDatatable defined?

I think what you are saying is that for the worst case where you had N lines, each with say M number of x (domain) values, you'd have N columns, M*X rows, and most of the values would be NULL?  That seems very inefficient. 
To unsubscribe from this group and stop receiving emails from it, send an email to google-visualization-api+unsub...@googlegroups.com.
To post to this group, send email to google-visua...@googlegroups.com.



--



--

Daniel LaLiberte

unread,
May 8, 2017, 9:02:32 AM5/8/17
to Google Visualization API
On Mon, May 8, 2017 at 7:51 AM, Justin Stay <justi...@gmail.com> wrote:
Daniel,

I don't quite follow your code in your last post.  Could you explain conceptually what you are doing?  Where and how are dt and mergedDatatable defined?

I think what you are saying is that for the worst case where you had N lines, each with say M number of x (domain) values, you'd have N columns, M*X rows, and most of the values would be NULL?  That seems very inefficient. 

Yes, it sounds like you do understand what my code was intended to make more explicit.  You would need to wrap that loop in another loop over the N datatables.  Before that, just create a new empty datatable with your N + 1 columns (don't forget the domain column).   

But instead of filling with nulls, you could leave values undefined, as long as you make each row the same length by adding a null value in yet another column.

Yes this is inefficient for space, but you may want to merge rows that have the same domain value. 

I'm thinking of adding a 'series' role column that would allow you to do what you want more directly.  This would be the equivalent of putting each data value in a separate column.

If the data size inefficiency is a problem, there is another way you could do this, though you wouldn't get a legend of N series.  You could simply append all your rows in one table, but for each row, add a 'style' role column to specify the color of the line. Also, between each set of rows, add one extra row with a null value which will break the line at that point if you don't interpolateNulls. 
 
 
To unsubscribe from this group and stop receiving emails from it, send an email to google-visualization-api+unsubscr...@googlegroups.com.
--



--

--
You received this message because you are subscribed to the Google Groups "Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-visualization-api+unsub...@googlegroups.com.
To post to this group, send email to google-visualization-api@googlegroups.com.

For more options, visit https://groups.google.com/d/optout.



--
Reply all
Reply to author
Forward
0 new messages