Forum | Appery.io

Hello Kendal,

If you create a new JS asset, it will be available on every page by default: http://devcenter.appery.io/documentat....
Thus, you should create new JS asset with function drawChart() and load external JavaScript library with url https://www.google.com/jsapi

This was a extremely helpful thread! thank you for the help and explanations.

I have one question to add:
How can I redraw the chart from an event?
I'm assuming that I would have to call a function through Java script. But I don't know how, or what to call.

I got the chart to work and display on the page. I had the same problem as the other poster with the white screen issue. I resolved that with a full screen refresh on page navigation to the page with the chart.

You should call

chart.draw(data, options);

on any event you want (https://devcenter.appery.io/documenta...)

Thank you Sergiy! I knew it was going to be something simple.

How to read the columns and rows for the google chart from the database?

Hi Team,
I just want to know if how can i center/fullscreen the chart and remove the scroll bar:
https://d2r1vs3d9006ap.cloudfront.net...

how can i insert value in json?

Thank you,
She

I tried the following code:
code
function drawChart() {
// Create the data table.
var empname = localStorage.getItem('EmpName');
var data = new google.visualization.DataTable();
data.addColumn('string', 'Topping');
data.addColumn('number', 'Slices');
data.addRows([
{'Mushrooms': 3},
{'Onions': 1},
{'Olives': 1},
{'Zucchini': 1},
{'Pepperoni': 2}
]);
// Set chart options
var options = {'title':'Late Percentage of ' + empname,
'width':400,
'height':300};
// Instantiate and draw our chart, passing in some options.
var chart = new google.visualization.PieChart(document.getElementById('chart_div'));
chart.draw(data, options);
}
/code

the error is:
https://d2r1vs3d9006ap.cloudfront.net...

this chart is not accepting json?

Thank you,
She

Hello Enfiled, you should just save service's response into JS variable.

You can do it on service's success event e.g.:

Apperyio.storage.myArray.set(data); More info about storage here: https://devcenter.appery.io/documenta...

Hello,
You can remove scrolls with CSS property overflow: https://css-tricks.com/almanac/proper...

this chart is not accepting json?
Please reed it's documentation

so basically myArray varialbe will have the response for that database service.
of how to add the columns and rows in the format below:

var data = new google.visualization.DataTable();
data.addColumn('string', 'Topping');
data.addColumn('number', 'Slices');
data.addRows([
['Mushrooms', 3],
['Onions', 1],
['Olives', 1],
['Zucchini', 1],
['Pepperoni', 2]
]);