How to append line chart/add new rows in the existing one

14 views

Skip to first unread message

B_Tulsyan

unread,

Jun 12, 2020, 7:00:02 AM6/12/20

to Google Visualization API

Hi All,

I am new to HTML and Google Visualization.

My requirement:

I want to add a row to an existing line chart. i.e I want my line chart to change dynamically based on user input.

Can anyone guide me or share a link of working examples or can anyone help me to update my code?

The code below takes an input from the user using request.get parameter and parse it into integer value.

The integer value of humidity along with time stamp are displayed as a line chart.

But here the graph is displayed as a single point everytime i give new input. what and where exactly the code need to be updated to get the desired output?

<html>

<head>

String humid= request.getParameter("humid");

int humid_new = Integer.parseInt(humid);

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

google.charts.setOnLoadCallback(drawChart);

function drawChart() {

var timeInMs = Date.now();

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

data.addColumn('datetime', 'Date');

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

data.addRows([

[new Date(timeInMs), <%=humid_new%>]

]);

var chart = new google.visualization.AnnotationChart(document.getElementById('chart_div'));

var options = {

displayAnnotations: true

};

chart.draw(data, options);

}

</script>

</head>

<body>

</body>

</html>

Reply all

Reply to author

Forward

0 new messages