CODEWITHSUNDEEP
htmlmysqlcanvasgraph
spm
spm

Reputation: 141

Can a canvas be created using mySQL data?

I want to draw some simple graphs.

I was wondering if mySQL data can be used alongside the canvas function for such a feature?

Any insight would be great, thanks!

Upvotes: 0

Views: 2137

Answers (2)

user2225188
user2225188

Reputation: 46

I think some of the previous responses completely misunderstood what you are asking. You're basically looking for a way to leverage data stored in a MySQL database and use it to populate the X and Y values of a basic HTML 5 graph (basic optional output for the canvas API). Sounds like you already know how to make such a chart with HTML 5 and the examples with "static" are great. Now, you want to learn how to populate with dynamic data from a database like MySQL. I've been looking for the same answer and found this thread here at stackoverflow that should help you How can I populate a javascript array with values from a database using PHP?

If you know how to connect to a database and send basic SQL queries to your database with PHP, the rest is fairly easy. That URL outlines a number of different ways to do it, but the one that I think is the cleanest is to JSON encode your data retrieved via PHP. Here's the sample I'm going to try.

$array = array();
while ($row = mysql_fetch_assoc($result)) {
    $array[] = $row['key'];
}
echo 'var array = '.json_encode($array).';';

Notice that all of the code is PHP so you'll need to use the correct open and closing tags. The last line is where the retrieved data, stored into a PHP array, is encoded with JSON thus creating an array that javascript can use. Now, write your canvas code and loop through the encoded array to dynamically create a graph.

I hope that points you further in the right direction...and shame on those previous responders that were so arrogant.

Upvotes: 3

ThiefMaster
ThiefMaster

Reputation: 318558

Yes, obviously that's possible. You'd JSON-encode the data to make it available to your JavaScript code and then use it like any other data. Because that's what it is after all: Data. Doesn't matter where it's stored / comes from.

Upvotes: 0

Related Questions