Hello Daniel, I changed this line in the head and in the body as you suggested. But I still do not get the graph as I got it with this old line.
Daniel LaLiberte schrieb am Samstag, 5. September 2020 um 20:13:26 UTC+2: > I still see: window.setTimeout(drawChart(), 5000); > Which calls drawChart immediately, not after a timeout. I expect you want > to wait until after the timeout, so you should instead do: > > window.setTimeout(drawChart, 5000); > > The value of the expression drawChart is a function, and setTimeout > expects a function as its first argument (or a string, but don't use it > that way). The function given to setTimeout is *called* by setTimeout > after the amount of time you specify. So you don't want to call the > function before the timeout occurs. > > > On Sat, Sep 5, 2020 at 6:31 AM RBTCGP <[email protected]> wrote: > >> Dear Daniel, >> thank you very much for your hints. >> >> I think the main problem is the obsolete load of the google charts >> library, as I have the same problem with all my html, where I use it. >> >> So I already tried to follow the instructions at >> https://developers.google.com/chart/interactive/docs/basic_load_libs#update-library-loader-code >> . >> >> But with no effect. Maybe you can have a look at another example, which >> is the actual code and which is a little bit smaller (sorry, but I did not >> find a way to mark it as code this time): >> >> <html> >> <head> >> <meta http-equiv="refresh" content="8; URL= >> http://<IP>:<PORT>/Antwortzeiten_Nbg.html"> >> <!--Load the AJAX API--> >> <!-- OBSOLETE: <script type="text/javascript" src=" >> https://www.google.com/jsapi";></script>--> >> <script src="https://www.gstatic.com/charts/loader.js";></script> >> <script type="text/javascript" src="// >> ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> >> <!-- OBSOLETE: <script type="text/javascript"> >> >> // Load the Visualization API and the piechart package. >> google.load('visualization', '1', {'packages':['corechart']}); >> >> // Set a callback to run when the Google Visualization API is loaded. >> google.setOnLoadCallback(drawChart);--> >> <script> >> google.charts.load('current', {packages: ['corechart']}); >> google.charts.setOnLoadCallback(drawChart); >> >> var Eingabe = ""; >> var Zaehler = 1; >> while (Zaehler <= 3) { >> >> Zaehler++; >> >> function drawChart() { >> var jsonData = $.ajax({ >> url: "Antwortzeiten_Nbg.php?", >> dataType:"json", >> async: false >> }).responseText; >> >> >> // Create our data table out of JSON data loaded from server. >> var data = new google.visualization.DataTable(jsonData); >> >> // Instantiate and draw our chart, passing in some options. >> var chart = new >> google.visualization.LineChart(document.getElementById('chart_div')); >> chart.draw(data, {width: 400, height: 240}); >> } >> window.setTimeout(drawChart(), 5000); >> } >> >> </script> >> </head> >> >> <body> >> <!--Div that will hold the pie chart--> >> <div id="chart_div"> >> <script> >> function drawChart() { >> var jsonData = $.ajax({ >> url: "Antwortzeiten_Nbg.php", >> dataType:"json", >> async: false >> }).responseText; >> >> // Create our data table out of JSON data loaded from server. >> var data = new google.visualization.DataTable(jsonData); >> >> // Instantiate and draw our chart, passing in some options. >> var chart = new >> google.visualization.LineChart(document.getElementById('chart_div')); >> chart.draw(data, {width: 400, height: 240}); >> } >> window.setTimeout(drawChart(), 5000); >> </script> >> </div> >> </body> >> </html> >> >> Daniel LaLiberte schrieb am Donnerstag, 6. August 2020 um 18:02:02 UTC+2: >> >>> The problem is due to your window.setTimeout(drawChart(), 10000); This >>> actually calls drawChart immediately, since you wrote drawChart() rather >>> than just drawChart. What it does after 10 seconds is try to call the >>> undefined result of calling drawChart. >>> >>> You should wait for google.setOnLoadCallback(drawChart); to call >>> drawChart after the library has finished loading, at which time >>> google.visualization.DataTable should be defined. Then, *within* your >>> drawChart function, you could call drawChart again after a timeout. >>> >>> But you have other problems. You have 2 drawChart functions, one in the >>> head, which references chart_div, which doesn't appear to exist (this first >>> script appears to have a syntax error, an extra '}' at the end, so maybe it >>> is ignored), and one in the body, which references the chart_start_div >>> which >>> *contains* the script that defines drawChart. So assuming only the >>> second drawChart is used, when the chart is drawn, the script element will >>> be deleted. What that does to the drawChart function may be undefined, or >>> it might still exist if it is attached to some other place in the >>> document. In any event, this is probably not what you want to do. >>> >>> Finally, you should follow the instructions at >>> https://developers.google.com/chart/interactive/docs/basic_load_libs#update-library-loader-code >>> to update how you load the Google Charts library. Why the behavior of >>> your page has changed might be due to the jsapi loader redirecting to the >>> new loader. Difficult to say without seeing how this is working in your >>> actual web page. If you can point us at that page, we might be able to >>> help more. >>> >>> I hope this helps, though I know I am not giving you a solution, but >>> mostly just pointing out problems. >>> >>> On Thu, Aug 6, 2020 at 5:38 AM RBTCGP <[email protected]> wrote: >>> >>>> >>>> >>>> Am Donnerstag, 6. August 2020 09:25:43 UTC+2 schrieb RBTCGP: >>>>> >>>>> <html> >>>>> <head> >>>>> <title>xxxxxxxxxxxxxxxxx</title> >>>>> <link rel="stylesheet" type="text/css" href="./css/style.css" /> >>>>> <link rel="stylesheet" href="mystyle.css"> >>>>> <meta http-equiv="refresh" content="80; URL=http://xxxx";> >>>>> <!--Load the AJAX API--> >>>>> <script type="text/javascript" src="https://www.google.com/jsapi >>>>> "></script> >>>>> <script type="text/javascript" src="// >>>>> ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> >>>>> >>>>> <script type="text/javascript"> >>>>> >>>>> // Load the Visualization API and the piechart package. >>>>> google.load('visualization', '1', {'packages':['corechart']}); >>>>> >>>>> // Set a callback to run when the Google Visualization API is >>>>> loaded. >>>>> google.setOnLoadCallback(drawChart); >>>>> >>>>> var ticksArray = [{v: 1, f: '26.11.15'}, {v: 2, f: '09.12.15'}, {v: 3, >>>>> f: '22.12.15'}, {v: 4, f: '13.01.16'}, {v: 5, f: '27.01.16'}, {v: 6, f: >>>>> '17.02.16'}, {v: 7, f: '02.03.16'}, {v: 8, f: '16.03.16'}, {v: 9, f: >>>>> '14.04.16'}, {v: 10, f: '11.05.16'}, {v: 11, f: '04.08.16'}, {v: 12, f: >>>>> '07.09.16'}, {v: 13, f: '08.12.16'}, {v: 14, f: '19.12.16'}, {v: 15, f: >>>>> '22.12.16'}, {v: 16, f: '05.04.17'}, {v: 17, f: '11.05.17'}, {v: 18, f: >>>>> '08.06.17'}, {v: 19, f: '13.07.17'}, {v: 20, f: '28.07.17'}, {v: 21, f: >>>>> '26.07.18'}, {v: 22, f: '08.08.18'}, {v: 23, f: '29.08.18'}]; >>>>> >>>>> var Eingabe = ""; >>>>> var Zaehler = 1; >>>>> while (Zaehler <= 3) { >>>>> >>>>> Zaehler++; >>>>> >>>>> function drawChart() { >>>>> var jsonData = $.ajax({ >>>>> url: "Antwortzeiten_XXX.php?", >>>>> dataType:"json", >>>>> async: false >>>>> }).responseText; >>>>> >>>>> // Create our data table out of JSON data loaded from server. >>>>> var data = new google.visualization.DataTable(jsonData); >>>>> >>>>> // Instantiate and draw our chart, passing in some options. >>>>> var chart = new >>>>> google.visualization.LineChart(document.getElementById('chart_div')); >>>>> chart.draw(data, {width: 800, height: 240}); >>>>> } >>>>> window.setTimeout(drawChart(), 10000); >>>>> } >>>>> >>>>> </script> >>>>> <meta name="viewport" content="width=device-width, initial-scale=1.0"> >>>>> >>>>> </head> >>>>> >>>>> >>>>> <body> >>>>> >>>>> <!--Div that will hold the pie chart--> >>>>> <div id="chart_start_div"> >>>>> <script> >>>>> function drawChart() { >>>>> var jsonData = $.ajax({ >>>>> url: "XXXXXXX.php?seite=Start", >>>>> dataType:"json", >>>>> async: false >>>>> }).responseText; >>>>> >>>>> // Create our data table out of JSON data loaded from server. >>>>> var data = new google.visualization.DataTable(jsonData); >>>>> >>>>> // Instantiate and draw our chart, passing in some options. >>>>> var chart = new >>>>> google.visualization.LineChart(document.getElementById('chart_start_div')); >>>>> >>>>> chart.draw(data, {explorer:{axis: 'horizontal'}, width: 800, >>>>> height: 240, hAxis: {ticks: ticksArray}}); >>>>> } >>>>> window.setTimeout(drawChart(), 10000); >>>>> </script> >>>>> </div> >>>>> </body> >>>>> </html> >>>>> >>>>> The above code worked for years. >>>>> Now I get no graph anymore without any change by myself. >>>>> Maybe there was a change in Google graphs, which makes it necessary to >>>>> change the code? >>>>> >>>>> In the line "var data = new >>>>> google.visualization.DataTable(jsonData);" I get the error "Uncaught >>>>> TypeError: Cannot read property 'DataTable' of undefined". >>>>> >>>>> The php works fine to provide the JSON-Data. >>>>> >>>>> The goal is, that the graph updates itself automatically every 10 >>>>> seconds. >>>>> >>>> >>>> Also the error remains, when I exchange >>>> <script type="text/javascript" src="https://www.google.com/jsapi";></ >>>> script> >>>> with the line >>>> >>>> <script src="https://www.gstatic.com/charts/loader.js";></script> >>>> >>>> >>>> >>>> -- >>>> 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 view this discussion on the web visit >>>> https://groups.google.com/d/msgid/google-visualization-api/7c709004-d214-458d-a09d-fba5799578a9o%40googlegroups.com >>>> >>>> <https://groups.google.com/d/msgid/google-visualization-api/7c709004-d214-458d-a09d-fba5799578a9o%40googlegroups.com?utm_medium=email&utm_source=footer> >>>> . >>>> >>> >>> >>> -- >>> Daniel LaLiberte <https://plus.google.com/100631381223468223275?prsrc=2> >>> [email protected] Cambridge MA >>> >>> -- >> 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 view this discussion on the web visit >> https://groups.google.com/d/msgid/google-visualization-api/ea8134e0-9be0-4ff2-9885-96c82cd216f2n%40googlegroups.com >> >> <https://groups.google.com/d/msgid/google-visualization-api/ea8134e0-9be0-4ff2-9885-96c82cd216f2n%40googlegroups.com?utm_medium=email&utm_source=footer> >> . >> > > > -- > Daniel LaLiberte <https://plus.google.com/100631381223468223275?prsrc=2> > [email protected] Cambridge MA > > -- 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 view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/a69360fe-41c0-45ae-a03c-68adaa560139n%40googlegroups.com.
