How do I draw 3 lines in a google line chart


#1

Hello,
I have this working line chart

 google.charts.load('current', {'packages':['line']});
      google.charts.setOnLoadCallback(drawChart);

    function drawChart() {

      var data = new google.visualization.DataTable();
      data.addColumn('string', ' ');
      data.addColumn('number', 'acc_profit');

      for(var i = 0; i < datum.length; i++){
		  		var obj = datum[i];
				data.addRow([obj.time, obj.acc_profit]);
				
			}

	  

      var options = {

Here is a graph of one type of data
image

Here is another line grapg with another type of data
image

And Here is a graph of all data together
image

How do I put them together in the same graph and have contimuous lines?
The ualues (dates) of x axis of the 3 lines do not necesarily mach
I understand that I have to put null somewhere

Can you explain it to me? send me to a relevant example?

How can I give each line a unique color?

I appreciate your help
I


#2

Hi @erezvol, your code looks kind of truncated… anyhow there are plenty of examples in the docs, including multiple graphs. What exactly do you mean with continuous lines though?


#3

My understanding is the problem has to do with different X-axis values. i.e. the first has no “04-18”, the second 4 “04-18” and the last 2 “04-18”.

So while each line is continuous in its own chart, to have all three in a single chart some would be missing some of the intervals.

Though I think I understand the problem, unfortunately I can’t think of a solution other than maybe allowing baseline for the nulls and grouping the multiples into a single value which may not be acceptable. Maybe use a bar chart instead of a line chart? Interpolation may work, but that feels wrong to me.