0

我想不出将我的 MySQLi 数据从正确的 json echo 移动到 Google Chart 代码的正确方法。

我查询数据并在 json 中回显其结果。

$query = mysqli_query($con,"SELECT Count(e.song_id) 
AS song_count, c.show_id, e.show_id, DATE_FORMAT(c.show_date, '%Y') AS s_year
FROM tbl_song_shows e, tbl_shows c
WHERE e.song_id='{$sid}' AND c.show_id = e.show_id
GROUP BY s_year
ORDER BY s_year DESC");


//SHOW STATS TO GRAPH//

$table = array();
$table['cols'] = array(
    /* define your DataTable columns here
     * each column gets its own array
     * syntax of the arrays is:
     * label => column label
     * type => data type of column (string, number, date, datetime, boolean)
     */
    // I assumed your first column is a "string" type
    // and your second column is a "number" type
    // but you can change them if they are not
    array('id' => 'Year','label' => 's_year', 'type' => 'string'),
    array('id' => 'value','label' => 'song_count', 'type' => 'number')

);

$rows = array();
while($r = mysqli_fetch_array($query, MYSQL_ASSOC)){
$temp = array();
    // each column needs to have data inserted via the $temp array
    $temp[] = array('v' =>  $r['s_year']);    
$temp[] = array('v' =>  (int) $r['song_count']);

    // insert the temp array into $rows
    $rows[] = array('c' => $temp);
}

// populate the table with rows of data
$table['rows'] = $rows;

// encode the table as JSON
$jsonTable = json_encode($table);

// set up header; first two prevent IE from caching queries
header('Cache-Control: no-cache, must-revalidate');
header('Content-type: application/json');

// return the JSON data
echo $jsonTable;

这将返回: {"cols":[{"id":"Year","label":"s_year","type":"string"},{"id":"value","label":"song_count ","type":"number"}],"rows":[{"c":[{"v":"2013"},{"v":5}]},{"c":[{ "v":"2012"},{"v":1}]},{"c":[{"v":"2005"},{"v":1}]},{"c": [{"v":"2003"},{"v":1}]}]}

如果我像这样将其粘贴到 Google 图表中,图表就可以正常工作。但我不想硬编码那里的数据,我想将回显的数据发送到 Javascript for Google Chart。

  <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/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 = {"cols":[{"id":"Year","label":"s_year","type":"string"},{"id":"value","label":"song_count","type":"number"}],"rows":[{"c":[{"v":"2013"},{"v":5}]},{"c":[{"v":"2012"},{"v":1}]},{"c":[{"v":"2005"},{"v":1}]},{"c":[{"v":"2003"},{"v":1}]}]}



      // Create our data table out of JSON data loaded from server.
     var data = new google.visualization.DataTable(jsonData);


      var options = {
           title: 'Yearly Song Counts',
         chartArea:{left:40, width:850, height:250},
    legend: {position: 'none'},
colors:['#94B599'],
hAxis: {gridlines:{count:6}}
        };
      // Instantiate and draw our chart, passing in some options.
      // Do not forget to check your div ID
      var chart = new google.visualization.BarChart(document.getElementById('chart_div'));
      chart.draw(data, options);
    }
    </script>

我不应该能够做类似的事情:

var jsonData = $jsonTable   

谁能帮我解决这个问题?

我也有一个先前的问题:MySQL 查找尚未回答的歌曲的播放日期,如果有人可以帮助我回答其中任何一个问题,我将不胜感激。谢谢你。

4

2 回答 2

1

你很亲密。您只需要echoPHP 上下文中的变量 ( <?php ... ?>)

var jsonData = <?php echo $jsonTable;  ?>
于 2013-08-23T16:27:50.040 回答
0

如果您<script>上面的块是 .php scsript 的一部分,那么您可以让 PHP 将其输出嵌入到 JS 代码中,例如

<script>
    var jsonData = <?php echo json_encode($table); ?>;
    ...
</script>
于 2013-08-23T16:28:56.323 回答