0

我在使用 google graph api 时遇到问题。

问题是日期在带注释的时间线图中不起作用。图表不可见。数据来自 MySQL 数据库，运行良好。这是一个wordpress网站。如果使用带 int 的 BarChart 而不是 Date 则可以。

json数据：

{"cols":[{"label":"Datum","type":"string"},{"label":"Relax","type":"date"},
{"label":"Rest","type":"date"},{"label":"Active","type":"date"}],
"rows":[{"c":[{"v":"2013-03-27 17:05"},{"v":"Date(2012, 12, 1)"},
{"v":"Date(2012, 12, 1)"},{"v":"Date(2012, 12, 1)"}]},
{"c":[{"v":"2013-03-27 16:53"},{"v":"Date(2012, 12, 1)"},
{"v":"Date(2012, 12, 1)"},{"v":"Date(2012, 12, 1)"}]},
{"c":[{"v":"2013-03-27 16:53"},{"v":"Date(2012, 12, 1)"},
{"v":"Date(2012, 12, 1)"},{"v":"Date(2012, 12, 1)"}]},
{"c":[{"v":"2013-03-27 16:51"},{"v":"Date(2012, 12, 1)"},
{"v":"Date(2012, 12, 1)"},{"v":"Date(2012, 12, 1)"}]},
{"c":[{"v":"2013-03-27 16:41"},{"v":"Date(2012, 12, 1)"},
{"v":"Date(2012, 12, 1)"},{"v":"Date(2012, 12, 1)"}]},
{"c":[{"v":"2013-03-27 16:38"},{"v":"Date(2012, 12, 1)"},
{"v":"Date(2012, 12, 1)"},{"v":"Date(2012, 12, 1)"}]},
{"c":[{"v":"2013-03-27 16:32"},{"v":"Date(2012, 12, 1)"},
{"v":"Date(2012, 12, 1)"},{"v":"Date(2012, 12, 1)"}]},
{"c":[{"v":"2013-03-27 16:31"},{"v":"Date(2012, 12, 1)"},
{"v":"Date(2012, 12, 1)"},{"v":"Date(2012, 12, 1)"}]},
{"c":[{"v":"2013-03-27 16:31"},{"v":"Date(2012, 12, 1)"},
{"v":"Date(2012, 12, 1)"},{"v":"Date(2012, 12, 1)"}]},
{"c":[{"v":"2013-03-27 16:30"},{"v":"Date(2012, 12, 1)"},
{"v":"Date(2012, 12, 1)"},{"v":"Date(2012, 12, 1)"}]}]}

php/html 代码这是一个文件。

$con = mysql_connect($db_host,$db_user,$db_pass) or die("Failed to connect with database!!!!");
mysql_select_db($db_db);

$sth = mysql_query("SELECT * FROM {$table}");

$rows = array();
//flag is not needed
$flag = true;
$table = array();
$table['cols'] = array(

    //Labels your chart, this represent the column title
    array('label' => 'Datum', 'type' => 'string'),
    array('label' => 'Relax', 'type' => 'date'),
    array('label' => 'Rest', 'type' => 'date'),
    array('label' => 'Active', 'type' => 'date')
);

$rows = array();
while($r = mysql_fetch_assoc($sth)) {
    $temp = array();
    // the following line will used to slice the Pie chart
    $temp[] = array('v' => (string) $r['Date']); 

    //Values of the each slice
    $temp[] = array('v' => "Date(2012, 12, 1)"); 
    $temp[] = array('v' => "Date(2012, 12, 1)");
    $temp[] = array('v' => "Date(2012, 12, 1)");

    $rows[] = array('c' => $temp);
}

$table['rows'] = $rows;
$jsonTable = json_encode($table);
echo $jsonTable;
?>

  <head>
    <!--Load the AJAX API-->
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript" src="jquery.js"></script>
    <script type="text/javascript">

    // Load the Visualization API and the piechart package.
    google.load('visualization', '1', {'packages':['annotatedtimeline']});

    // Set a callback to run when the Google Visualization API is loaded.
    google.setOnLoadCallback(drawChart);

    function drawChart() {

      // Create our data table out of JSON data loaded from server.
      var data = new google.visualization.DataTable(<?=$jsonTable?>);/*
      var options = {
            displayAnnotations: true,
            annotationsWidth: 20,
            scaleType: 'maximized'  
        };

      var chart = new google.visualization.AnnotatedTimeLine(document.getElementById('chart_div'));
      chart.draw(data, options);
      */
      var chart = new google.visualization.AnnotatedTimeLine(document.getElementById('chart_div'));    
        chart.draw(data, 
            {
                displayAnnotations: true,
                annotationsWidth: 20,
                scaleType: 'maximized'      
            }
        );
    }
    </script>
  </head>

  <body>
    <!--Div that will hold the pie chart-->
    <div id="chart_div"></div>
  </body>

<?php include (TEMPLATEPATH . '/searchform.php'); ?>
</div>
<?php get_footer(); ?>
4

0 回答 0