Hi All,
Am trying to create a timeline chart using Google chart API.
My data source is a ArrayList in Java holding these values .
[TASK1,10-01-2018, 20-02-2018, TASk2, 11-02-2018, 21-03-2018, TASK3,
15-03-2018, 19-04-2018]
In My Page that need to render the chart
1. I tried chart populating dataTable
2. Also Tried creating an Array and populating dataTable using array.
Please find the Chart generation page and the output attached .
In both cases am not getting the put put as required. The X axis values am
expecting to me months and year
Please help me to fix this.
--
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 [email protected].
To post to this group, send email to [email protected].
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/CAJQNqMaWjG9DLy%3Dgxrk7Cye-rbXp7GW5ZDd7rkDH9CCKS-056Q%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
import="java.util.ArrayList,java.util.Date,java.util.*,java.text.SimpleDateFormat;"
pageEncoding="ISO-8859-1"%>
<!DOCTYPE html>
<html>
<head>
<!--Load the AJAX API-->
<script type="text/javascript" src="gc/loader.js"></script>
<script type="text/javascript">
google.charts.load('current', {'packages':['timeline']});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var task;var start;var end;
var data = new google.visualization.DataTable();
data.addColumn('string','task');
data.addColumn('date','start');
data.addColumn('date','end');
<%
ArrayList myData= (ArrayList)session.getAttribute("myData= ");
int totrow = pertData.size();
int loopcount =0,rowindex=1;
%>
<%
while (loopcount<totrow )
{
%>
task ='<%=myData.get(loopcount).toString()%>';
start=new Date(<%=myData.get(loopcount+1).toString()%>);
end = new Date(<%= myData.get(loopcount+2).toString()%>);
data.addRow([task,start,end]);
<%
loopcount=loopcount+4;
}
%>
var chart = new
google.visualization.Timeline(document.getElementById('chart_div'));
chart.draw(data);
}
</script>
</head>
<body>
<div id="chart_div" style="height: 2000px;"></div>
</body>
</html><%@ page language="java" contentType="text/html; charset=ISO-8859-1"
import="java.util.ArrayList,java.util.Date,java.util.*,java.text.SimpleDateFormat;"
pageEncoding="ISO-8859-1"%>
<!DOCTYPE html>
<html>
<head>
<!--Load the AJAX API-->
<script type="text/javascript" src="gc/loader.js"></script>
<script type="text/javascript">
google.charts.load('current', {'packages':['timeline']});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
<%
ArrayList myData = (ArrayList)session.getAttribute("myData");
int totrow = myData.size();
int loopcount =0,rowindex=1;
%>
var dataArray = [['TASK','START','END']];
<%
while (loopcount<totrow ) {
%>
dataArray.push
(['<%=myData.get(loopcount).toString()%>',<%=myData.get(loopcount+1).toString()%>,<%=myData.get(loopcount+2).toString()%>])
<%
loopcount=loopcount+4;
}
%>
var data = new google.visualization.arrayToDataTable(dataArray);
var chart = new
google.visualization.Timeline(document.getElementById('chart_div'));
chart.draw(data);
}
</script>
</head>
<body>
<!--Div that will hold the pie chart-->
<div id="chart_div" style="height: 2000px;"></div>
</body>
</html>
