Help with Google Charts in Ninox
So, I just wanted to start with a very basic Google Chart in ninox. With Google's default data, the chart shows, however when I try to replace it with my data it no longer works. Below is my code. I tried without wrapping it number and with as well.
let gcode := "
<head>
<script type=""text/javascript"" src=""https://www.gstatic.com/charts/loader.js""></script>
<script type=""text/javascript"">
google.charts.load(""current"", {packages:[""corechart""]});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Status Counts', 'Total Counts'],
['Bad Phone/Email', " +
number('Bad #/ Email') +
"],
['Foreign Speaking', " +
number('Foreign Speaking') +
"],
['Not Interested', " +
number('Not Interested') +
"],
['Unresponsive', " +
number(Unresponsive) +
"],
['Unqualified', " +
number(Unqualified) +
"]
['Bots', " +
number(Bots) +
"]);
var options = {
title: 'Negative Leads',
is3D: true,
};
var chart = new google.visualization.PieChart(document.getElementById('piechart_3d'));
chart.draw(data, options);
}
</script>
</head>
<body>
<div id=""piechart_3d"" style=""width: 900px; height: 500px;""></div>
</body>";
html(gcode)
13 replies
-
As you can see in this example the data should be numbers. Can you upload a example database with dummy data if you don't get it to work?
-
You can view this post
-
Even tried this just to see if moving things around would make a difference. Still no luck!
let Vairable1 := number('Bad #/ Email'); let Variable2 := number('Foreign Speaking'); let Variable3 := number('Not Interested'); let Variable4 := number(Unresponsive); let Variable5 := number(Unqualified); let Variable6 := number(Bots); let gcode := " <head> <script type=""text/javascript"" src=""https://www.gstatic.com/charts/loader.js""></script> <script type=""text/javascript""> google.charts.load(""current"", {packages:[""corechart""]}); google.charts.setOnLoadCallback(drawChart); function drawChart() { var data = google.visualization.arrayToDataTable([ ['Status Counts', 'Total Counts'], ['Bad Phone/Email', " + Vairable1 + "], ['Foreign Speaking', " + Variable2 + "], ['Not Interested', " + Variable3 + "], ['Unresponsive', " + Variable4 + "], ['Unqualified', " + Variable5 + "] ['Bots', " + Variable6 + "]); var options = { title: 'Negative Leads', is3D: true, }; var chart = new google.visualization.PieChart(document.getElementById('piechart_3d')); chart.draw(data, options); } </script> </head> <body> <div id=""piechart_3d"" style=""width: 900px; height: 500px;""></div> </body>"; html(gcode)
-
Also, just for fun, i create some number fields...put random numbers in there, add those to the google chart...still nothing !!!
-
At first sight, you are missing a comma after variabele 5. Also, i would use single quotes instead of double double quotes. You might also wrap your code in <htlm> ... </html> tags. Hope this helps. Btw this code works :
let gcode := " <html> <head> <script type='text/javascript' src='https://www.gstatic.com/charts/loader.js'></script> <script type='text/javascript'> google.charts.load('current', {packages:['corechart']}); google.charts.setOnLoadCallback(drawChart); function drawChart() { var data = google.visualization.arrayToDataTable([ ['Status Counts', 'Total Counts'], ['Bad Phone/Email', " + 20 + "], ['Foreign Speaking', " + 55 + "], ['Not Interested', " + 25 + "], ['Unresponsive', " + 30 + "], ['Unqualified', " + 80 + "], ['Bots', " + 40 + "] ]); var options = { title: 'Negative Leads', is3D: true, }; var chart = new google.visualization.PieChart(document.getElementById('piechart_3d')); chart.draw(data, options); } </script> </head> <body> <div id='piechart_3d' style='width: 900px; height: 500px;'></div> </body> </html>
-
I observed a strange behavior also with me. When opening the form, the chart was not visible. When closing and reopening the form the chart was shown. I do not know what causes this strange behavior. Putting the value's in a variabele doesn't wort eighter. It will probably be a bug in Ninox.
-
Out of the blue, it started working today with no changes whatsoever !!! The Ninox Gods must have been listening !!!
-
I also utilized a bootstrap chart today and wanted to share the results of that as well:
Content aside
- 4 mths agoLast active
- 13Replies
- 156Views
-
4
Following