简体   繁体   中英

Display data in Google Charts from $_GET value

I am making a very chart-heavy project and I am trying to make a page I have as I IFRAME or ajax request to that will generate charts for me. The only problem is passing the data. I am trying to use javascript url decoding because <?php echo $_GET['data']; ?> <?php echo $_GET['data']; ?> is impossible to use.

  • I am making a chart heavy web game
  • I am using Google Charts
  • I am making a page that will display all charts in iframes of ajax requests
  • I am using javascipt's urldecode function
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <title> <?php echo $_GET["type"]; ?> chart </title> <script type="text/javascript" src="//www.google.com/jsapi"></script> <script type="text/javascript"> google.load('visualization', '1', {packages: ['corechart']}); function getFileArgs() { var $_GET = {}, args = location.search.substr(1).split(/&/); for (var i=0; i<args.length; ++i) { var tmp = args[i].split(/=/); if (tmp[0] != "") { $_GET[decodeURIComponent(tmp[0])] = decodeURIComponent(tmp.slice(1).join("").replace("+", " ")); } } return $_GET } </script> <script type="text/javascript"> function drawVisualization() { // Create and populate the data table. var data = google.visualization.arrayToDataTable([ getFileArgs().data.split("]") ]); // Create and draw the visualization. new google.visualization.<?php echo $_GET['type']; ?>(document.getElementById('visualization')). draw(data, {title:"<?php echo $_GET['title'] ?>"}); } google.setOnLoadCallback(drawVisualization); </script> </head> <body style="font-family: Arial;border: 0 none;"> <div id="visualization" style="width: 600px; height: 400px;"></div> </body> </html> 

I suspect that there is a better way to achieve what you want without resorting to using iframes to create charts like this, but if this is the method you want to use, here's how you would go about it. First, on the end where you are generating your data, you should JSON-encode the data array, like this:

var myData = [
    ['Name', 'Value'],
    ['Foo', 5],
    ['Bar', 7]
];
var myJsonData = JSON.stringify(myData);

You can add myJsonData to the data parameter of your URL (with appropriate URL-encoding, of course).

In your iframe, there shouldn't be any reason why you can't use PHP's $_GET array to fetch the data parameter instead of using javascript. PHP automatically decodes the contents of data , so all you have to do is output it to javascript. The benefit of using JSON is that the string output from PHP will parse as a valid javascript object without any further coding required:

function drawVisualization() {
    // Create and populate the data table.
    var data = google.visualization.arrayToDataTable(<?php echo $_GET['data']; ?>);

    // Create and draw the visualization.
    new google.visualization.<?php echo $_GET['type']; ?>(document.getElementById('visualization')).
        draw(data, {title:"<?php echo $_GET['title']; ?>"});
  }

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM