thank you very much my dear, I served much your help :) Cheers
2015-12-07 8:06 GMT-06:00 'Daniel LaLiberte' via Google Visualization API < [email protected]>: > Hi Juan, > > Your code works for me, with modifications to simplify it: > http://jsfiddle.net/dlaliberte/ok93zju0/ > Try starting from this example and add missing things one at a time until > it fails. > > On Sat, Dec 5, 2015 at 8:25 PM, Juan Enrique <[email protected]> > wrote: > >> Hi!, >> >> I have a problem with google chart (Stepped Area Chart), trying to make >> an example of changing the values with a button (Changing the view window) >> but I do not have any graphic appears, even copying directly from the >> official website forum, here is my code, I hope I can help with this and I >> especially have patience, thanks in advance. >> >> <!DOCTYPE html> >> <html> >> <head> >> <title>grafico animado</title> >> >> <!--Import Google Icon Font--> >> <link href="http://fonts.googleapis.com/icon?family=Material+Icons"; >> rel="stylesheet"> >> <!--Import materialize.css--> >> <link type="text/css" rel="stylesheet" >> href="css/materialize.min.css" media="screen,projection"/> >> >> <!--Let browser know website is optimized for mobile--> >> <meta name="viewport" content="width=device-width, >> initial-scale=1.0"/> >> >> <script type="text/javascript" src="https://www.google.com/jsapi >> "></script> >> <script type="text/javascript"> >> google.load("visualization", "1", {packages:["corechart"]}); >> google.setOnLoadCallback(drawChart); >> >> var options = { >> title: 'Control de llenado', >> vAxis: {title: 'Galones'}, >> animation: { >> duration: 1000, >> easing: 'in' >> }, >> hAxis: {viewWindow: {min:0, max:5}} >> }; >> >> var prevButton = document.getElementById('b1'); >> var nextButton = document.getElementById('b2'); >> >> >> >> function drawChart() { >> var data = new google.visualization.DataTable(); >> data.addColumn('string', 'x'); >> data.addColumn('number', 'Nivel del agua'); >> var MAX = 8; >> for (var i = 0; i < MAX; ++i) { >> data.addRow([i.toString(), Math.floor(Math.random() * >> 100)]);//i = tiempo lo otro es la cantidad recibida del sensor >> } >> >> /* >> var data = google.visualization.arrayToDataTable([ >> ['Director (Year)', 'Rotten Tomatoes', 'IMDB'], >> ['Alfred Hitchcock (1935)', 8.4, 7.9], >> ['Ralph Thomas (1959)', 6.9, 6.5], >> ['Don Sharp (1978)', 6.5, 6.4], >> ['James Hawes (2008)', 4.4, 6.2] >> ]); >> */ >> >> var chart = new >> google.visualization.SteppedAreaChart(document.getElementById('chart_div')); >> >> chart.draw(data, options); >> } >> >> prevButton.onclick = function() { >> options.hAxis.viewWindow.min -= 1; >> options.hAxis.viewWindow.max -= 1; >> drawChart(); >> } >> nextButton.onclick = function() { >> options.hAxis.viewWindow.min += 1; >> options.hAxis.viewWindow.max += 1; >> drawChart(); >> } >> drawChart(); >> </script> >> </head> >> <body> >> <div class="row"> >> <div id="chart_div" style="width: 900px; height: 500px;"></div> >> </div> >> <div class="row"> >> <div class="col s12 l4"> >> <a id="b1" class="waves-effect waves-teal btn-flat">Anterior</a> >> </div> >> <div class="col s12 l4"> >> <a id="b2" class="waves-effect waves-teal btn-flat">Siguiente</a> >> </div> >> </div> >> >> <!--Import jQuery before materialize.js--> >> <script type="text/javascript" src=" >> https://code.jquery.com/jquery-2.1.1.min.js";></script> >> <script type="text/javascript" src="js/materialize.min.js"></script> >> </body> >> </html> >> >> >> -- >> 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 >> http://groups.google.com/group/google-visualization-api. >> To view this discussion on the web visit >> https://groups.google.com/d/msgid/google-visualization-api/65e7ddde-dd61-4e21-8fd3-849f91a1643f%40googlegroups.com >> <https://groups.google.com/d/msgid/google-visualization-api/65e7ddde-dd61-4e21-8fd3-849f91a1643f%40googlegroups.com?utm_medium=email&utm_source=footer> >> . >> For more options, visit https://groups.google.com/d/optout. >> > > > > -- > Daniel LaLiberte <https://plus.google.com/100631381223468223275?prsrc=2> > [email protected] <[email protected]> 5CC, Cambridge MA > > -- > You received this message because you are subscribed to a topic in the > Google Groups "Google Visualization API" group. > To unsubscribe from this topic, visit > https://groups.google.com/d/topic/google-visualization-api/SRCbuXX7ebA/unsubscribe > . > To unsubscribe from this group and all its topics, send an email to > [email protected]. > To post to this group, send email to > [email protected]. > Visit this group at > http://groups.google.com/group/google-visualization-api. > To view this discussion on the web visit > https://groups.google.com/d/msgid/google-visualization-api/CAOtcSJMaULogQM6k52f2r1ZAQ_aSMff5juaoPU7SdsbRvqnUjA%40mail.gmail.com > <https://groups.google.com/d/msgid/google-visualization-api/CAOtcSJMaULogQM6k52f2r1ZAQ_aSMff5juaoPU7SdsbRvqnUjA%40mail.gmail.com?utm_medium=email&utm_source=footer> > . > > For more options, visit https://groups.google.com/d/optout. > -- 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 http://groups.google.com/group/google-visualization-api. To view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/CAHsBCn_YfBPFNrSOo95jCSXq0Hxq77%2BNWeXcAc4Eer%3D719iisg%40mail.gmail.com. For more options, visit https://groups.google.com/d/optout.
