Mufleeh Posted July 16, 2011 Share Posted July 16, 2011 Hi All, I need to plot a graph retrieving data from my data base. I have done all the codings to get the data and store them to 2 different arrays.I though of using jquery to create the graphs. Below is the script has to be added to generated the grahp. I was wondering how to get this within the function in my php script. Can anyone help me fixing this? <script class="code" type="text/javascript">$(document).ready(function(){ var s1 = [2, 6, 7, 10]; var ticks = ['a', 'b', 'c', 'd']; plot1 = $.jqplot('chart1', [s1], { seriesDefaults:{ renderer:$.jqplot.BarRenderer, pointLabels: { show: true } }, axes: { xaxis: { renderer: $.jqplot.CategoryAxisRenderer, ticks: ticks } }, highlighter: { show: false } }); $('#chart1').bind('jqplotDataClick', function (ev, seriesIndex, pointIndex, data) { $('#info1').html('series: '+seriesIndex+', point: '+pointIndex+', data: '+data); } ); });</script> <div id="chart1" style="margin-top:20px; margin-left:20px; width:300px; height:300px;"></div> Regards, Mufleeh Quote Link to comment Share on other sites More sharing options...
TeNDoLLA Posted July 16, 2011 Share Posted July 16, 2011 Why would you want to get JS inside a PHP function? PHP is processed on the web server side and JS will be processed later on the client's browser. Quote Link to comment Share on other sites More sharing options...
Mufleeh Posted July 16, 2011 Author Share Posted July 16, 2011 well, I need to plot a graph using data retrieved from the data base. I have the data within 2 different arrays. This above js is the code to create the graph and I have to pass the data (which are in the arrays) to js. Is there any other way to do it? Quote Link to comment Share on other sites More sharing options...
TeNDoLLA Posted July 16, 2011 Share Posted July 16, 2011 Then you need to echo the data from PHP to the JS variables in your code. Don't know your array structures or how you want them to go into JS so can help more in that right now. Quote Link to comment Share on other sites More sharing options...
Mufleeh Posted July 16, 2011 Author Share Posted July 16, 2011 Hi, Thanks for your support. My arrays are one dimensional and stored in 2 variables like $arrayOne and $arrayTwo. As you see in the above java script(example) there are two variables s1 and ticks have been defined and made them equal to 2 arrays that comes in to the graph x and y. If we keep the js out of php we can't make it as below right? var s1= $arrayOne var ticks = $arrayTwo So how can I do this? Regards, Mufleeh Quote Link to comment Share on other sites More sharing options...
djlee Posted July 16, 2011 Share Posted July 16, 2011 since your using jquery, the easiest way is to echo "var xx = jQuery.parseJSON(".json_encode($array).");"; the var xx will be a javascript object. so you can get the data using //--- string based keys xx.key //-- integer keys xx[0] Quote Link to comment Share on other sites More sharing options...
Mufleeh Posted July 16, 2011 Author Share Posted July 16, 2011 Hi, Thanks for your response. Do you mean that if I write the above code inside PHP then I can use those variables inside js as an Array? It doesn't work as I expected. I have given you how my code looks like, can you figure out what could we do? <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <link rel="stylesheet" type="text/css" href="css/jquery.jqplot.css" /> <link rel="stylesheet" type="text/css" href="css/examples.css" /> <script language="javascript" type="text/javascript" src="js/jquery.js"></script> <script language="javascript" type="text/javascript" src="js/jquery.jqplot.js"></script> <script language="javascript" type="text/javascript" src="js/jqplot.barRenderer.js"></script> <script language="javascript" type="text/javascript" src="js/jqplot.categoryAxisRenderer.js"></script> </head> <body> <?php // PHP starts function myFunction(){ // function starts here //function codes here "var s1 = jQuery.parseJSON(".json_encode($stackDiv).");"; "var ticks = jQuery.parseJSON(".json_encode($stackCount).");"; ?> // PHP closed // java script outside PHP <script class="code" type="text/javascript">$(document).ready(function(){ plot1 = $.jqplot('chart1', [s1], { seriesDefaults:{ renderer:$.jqplot.BarRenderer, pointLabels: { show: true } }, axes: { xaxis: { renderer: $.jqplot.CategoryAxisRenderer, ticks: ticks } }, highlighter: { show: false } }); $('#chart1').bind('jqplotDataClick', function (ev, seriesIndex, pointIndex, data) { $('#info1').html('series: '+seriesIndex+', point: '+pointIndex+', data: '+data); } ); });</script> <div id="chart1" style="margin-top:20px; margin-left:20px; width:300px; height:300px;"></div> <?php // PHP reopened } // myFunction function close other functions and codes ?> // PHP closed </body> </html> Quote Link to comment Share on other sites More sharing options...
TeNDoLLA Posted July 16, 2011 Share Posted July 16, 2011 You actually need to echo the lines to make them appear in the clients side echo "var s1 = jQuery.parseJSON(".json_encode($stackDiv).");"; echo "var ticks = jQuery.parseJSON(".json_encode($stackCount).");"; Quote Link to comment Share on other sites More sharing options...
Mufleeh Posted July 16, 2011 Author Share Posted July 16, 2011 Hi, I am sorry its bit confusing to me. When I made it as below inside my php script, echo "var s1 = jQuery.parseJSON(".json_encode($stackDiv).");"; echo "var ticks = jQuery.parseJSON(".json_encode($stackCount).");"; Browser displays the data inside the arrays as below. var s1=jQuery.parseJSON([22,32,45,56]) var ticks=jQuery.parseJSON([12,35,32,11]) But how can I pass this into javascript out side the php (in the same page) and get the graph displayed? Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.