Now am confused I think I sent you all the codes php and javascrip which was Json
On Tue, Sep 3, 2013 at 3:06 PM, asgallant <[email protected]> wrote: > Open the page in a browser, view the source, and post the javascript. > > > On Tuesday, September 3, 2013 4:00:11 AM UTC-4, King Musa wrote: > >> I did it exactly but still It displays nothing I mean it shows a blank >> page >> >> This is the index.php >> <html> >> <head> >> <!--Load the AJAX API--> >> <script >> src="http://code.jquery.com/**jquery-latest.js<http://code.jquery.com/jquery-latest.js> >> "></script> >> <script type="text/javascript" >> src="https://www.google.com/**jsapi<https://www.google.com/jsapi> >> "></script> >> <script type="text/javascript" src="//ajax.googleapis.com/** >> ajax/libs/jquery/1.10.2/**jquery.min.js<http://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); >> >> function drawChart() { >> var jsonData = $.ajax({ >> url: "getData.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.PieChart(** >> document.getElementById('**chart_div')); >> chart.draw(data, {width: 400, height: 240}); >> } >> >> </script> >> </head> >> >> <body> >> >> <!--Div that will hold the pie chart--> >> <div id="chart_div"></div> >> </body> >> </html> >> >> >> >> >> this is the getData.php >> <?php >> >> $arr = array( >> 'cols' => array( >> array('type' => 'number', 'label' => 'Watts'), >> array('type' => 'number', 'label' => 'Dollars'), >> array('type' => 'number', 'label' => 'Money') >> ), >> 'rows' => array( >> array('c' => array(array('v' => 1), array('v' => 67), array('v' >> => 76))) >> ) >> ); >> json_encode($arr); >> >> ?> >> >> >> On Tue, Sep 3, 2013 at 6:28 AM, King Musa <[email protected]> wrote: >> >>> thanks a lot for your help am gonna try it >>> >>> >>> On Tue, Sep 3, 2013 at 3:56 AM, asgallant <[email protected]>wrote: >>> >>>> The JSON you are creating in your PHP is not the correct structure for >>>> the Visualization API. Try this instead: >>>> >>>> $arr = array( >>>> 'cols' => array( >>>> array('type' => 'number', 'label' => 'Watts'), >>>> array('type' => 'number', 'label' => 'Dollars'), >>>> array('type' => 'number', 'label' => 'Money') >>>> ), >>>> 'rows' => array( >>>> array('c' => array(array('v' => 1), array('v' => 67), array('v' >>>> => 76))) >>>> ) >>>> ); >>>> >>>> >>>> On Monday, September 2, 2013 4:43:20 PM UTC-4, King Musa wrote: >>>>> >>>>> >>>>> This is my php page called getData.php >>>>> <?php >>>>> $arr = array('Watts' => 1, 'Dollars'=>67, 'Money' => 76); >>>>> $json_table = json_encode($arr); >>>>> //echo $json_table; >>>>> ?> >>>>> >>>>> here is my index page containing gooogle chart >>>>> <html> >>>>> <head> >>>>> <!--Load the AJAX API--> >>>>> <script >>>>> src="http://code.jquery.com/**jq**uery-latest.js<http://code.jquery.com/jquery-latest.js> >>>>> "></script> >>>>> <script type="text/javascript" src="https://www.google.com/**js** >>>>> api <https://www.google.com/jsapi>"></script> >>>>> <script type="text/javascript" src="//ajax.googleapis.com/**aja** >>>>> x/libs/jquery/1.10.2/**jquery.**min.js<http://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(**drawC**hart); >>>>> >>>>> function drawChart() { >>>>> var jsonData = $.ajax({ >>>>> url: "getData.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.PieChart(**** >>>>> document.getElementById('**chart**_div')); >>>>> chart.draw(data, {width: 400, height: 240}); >>>>> } >>>>> >>>>> </script> >>>>> </head> >>>>> >>>>> <body> >>>>> <!--Div that will hold the pie chart--> >>>>> <div id="chart_div"></div> >>>>> </body> >>>>> </html> >>>>> >>>>> -- >>>> 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/mcYS1Znwqik/unsubscribe<https://groups.google.com/d/topic/google-visualization-api/mcYS1Znwqik/unsubscribe> >>>> . >>>> To unsubscribe from this group and all its topics, send an email to >>>> google-visualization-api+**[email protected]. >>>> To post to this group, send email to google-visua...@**googlegroups.com >>>> . >>>> >>>> Visit this group at http://groups.google.com/** >>>> group/google-visualization-api<http://groups.google.com/group/google-visualization-api> >>>> **. >>>> For more options, visit >>>> https://groups.google.com/**groups/opt_out<https://groups.google.com/groups/opt_out> >>>> . >>>> >>> >>> >> -- > 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/mcYS1Znwqik/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. > For more options, visit https://groups.google.com/groups/opt_out. > -- 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. For more options, visit https://groups.google.com/groups/opt_out.
