JsCharts and MySQL, can this be done?

Posted by lsavoie 
JsCharts and MySQL, can this be done?
January 27, 2010 04:59PM
Hi everyone, I'm fairly new to PHP and MySQL and would like to populate/generate multiple charts via JsCharts using a MySQL backend. Can this be done? Does anyone have a good example that I can review? I've monkeyed around with it for several days and just don't have enough technical knowledge to seem to accomplish this. Any help is appreciated.
Re: JsCharts and MySQL, can this be done?
January 31, 2010 03:44AM
Hi, I figured out a way to do this the other day. I'm also fairly new to PHP and JavaScript, so if anyone knows a better or, uh, more proper way to do it, please share.

This is what I did:
I used PHP to write JavaScript commands pushing content into the array one by one.
I also added a bit of logic to deal with the possibility of my query coming up empty.

EDIT - (just ignore the happy faces and exploding guy)

<script type="text/javascript" src="js/jscharts.js"></script>



<div class="graph" id='graph'>Loading graph...
    
 
<script type="text/javascript">
var myData = [];
<?php
	$userData ="['Not Scores Submitted',0]";
	$query = "SELECT username, score , average FROM userscore WHERE class LIKE 'ACIT2520'";
    $result = mysql_query($query)or die('dsdds');
    $rows = mysql_numrows($result);
    for($x=0; $x<$rows; $x++){
    $username = mysql_result($result,$x,"username"winking smiley;
    $score = mysql_result($result,$x,"average"winking smiley;
    $userData = "['".$username."',".$score."]";
    print "myData.push($userData);";
 
    }
    if($userData=="['Not Scores Submitted',0]"winking smiley
       print "myData.push($userData);";?>
    

	var colors = ['#7979DB'];
	var myChart = new JSChart('graph', 'bar');
	myChart.setDataArray(myData);
	//myChart.colorizeBars(colors);
	myChart.setDataArray(myData);
	myChart.setAxisColor('#9D9F9D');
	myChart.setAxisWidth(1);
	myChart.setAxisNamehot smiley'Students');
	myChart.setAxisNameY('Average Scores');
	myChart.setAxisNameColor('#655D5D');
	myChart.setAxisNameFontSize(9);
	myChart.setAxisPaddingLeft(50);
	myChart.setAxisValuesDecimals(1);
	myChart.setAxisValuesColor('#9C1919');
	myChart.setTextPaddingLeft(0);
	myChart.setBarValuesColor('#9C1919');
	myChart.setBarBorderWidth(0);
	myChart.setTitleColor('#8C8382');
	myChart.setTitle('General Quiz Averages');
	myChart.setGridColor('#5D5F5D');
	myChart.draw();
	

	
</script>

</div>



Sean



Edited 1 time(s). Last edit at 01/31/2010 03:46AM by dhamma.
Re: JsCharts and MySQL, can this be done?
February 22, 2010 01:14PM
hi, i using jquery post to get the data from my php file, but it keep prompt the JSChart input data format in wrong format.Here my codes:

<?php
include("connection/connection.php"winking smiley;
$con=GetConnection();
if (!$con){
die('database error');
}

$repID=$_POST['reportSel'];
$month=$_POST['repMonth'];
$year=$_POST['repYear'];
$type=$_POST['rbFilter'];
$reply="";
$sqlSelect=mysql_query("SELECT count( bID ) , Month( postDate ) , Year(postDate), bID FROM content WHERE Month( postDate ) = '$month' and Year(postDate)='$year' GROUP BY Month( postDate ) ,Year(postDate), bID LIMIT 0 , $type"winking smiley;

while($res = mysql_fetch_array($sqlSelect)){
$bid=$res['bID'];
$post=$res[0];
$sqlBlog=mysql_query("SELECT aID FROM blogauthor WHERE bID='$bid'"winking smiley;
if($res2=mysql_fetch_array($sqlBlog)){
$aid=$res2['aID'];
$sqlName=mysql_query("SELECT DISNAME FROM accSet Where aID='$aid'"winking smiley;
if($res3=mysql_fetch_array($sqlName)){
$name=$res3['DISNAME'];
}
}

$sqlBlog2=mysql_query("SELECT * FROM Blog Where bID=$bid"winking smiley;
if($res3=mysql_fetch_array($sqlBlog2)){
$url=$res3['url'];
}

$reply.="['".$name."',".$post."]";

}
echo $reply;

?>
-----------------------------------------------------------------------
jquery:

$.post("chart.php",$("#frReport" ).serialize(),function(data){
var myData = [];

myData.push(data.trim()); //data is get from php echo the output is something like this: " ['keiz',2]['Ibanez',1]['Yamaha',1] "



var myChart = new JSChart('graph', 'line');
myChart.setDataArray(myData);
myChart.draw();


Can any1 help?



Edited 1 time(s). Last edit at 02/22/2010 01:29PM by keiz.
Sorry, you do not have permission to post/reply in this forum.