我试图使用canvas.js从json返回值绘制条形图,我在回调页面中获取值但无法绘制图表,
这是我的 handler.php 页面,其中生成了json值,
<?php
include('connection.php');
if(isset($_POST)) {
$rep_date1=$_POST['date1'];
$date1=date("Y-m-d",strtotime($rep_date1));
$rep_date2=$_POST['date2'];
$date2=date("Y-m-d",strtotime($rep_date2));
$sql=mysql_query("SELECT * FROM infra.prob_report WHERE prob_rept_date BETWEEN '$date1' AND '$date2'");
$rows = array();
while($row = mysql_fetch_assoc($sql)) {
$nestedData=array();
$nestedData[] = $row["rep_id"];
$nestedData[] = $row["prob_rept_date"];
$nestedData[] = $row["prob_equip_name"];
$nestedData[] = $row["prob_rept_name"];
$nestedData[] = $row["prob_desc"];
$data[]= '<tr><td>'. $row["rep_id"]. '</td><td>'. $row["prob_rept_date"]. '</td><td>'.$row["prob_equip_name"]. '</td><td>'. $row["prob_rept_name"]. '</td><td>'. $row["prob_desc"].'</td></tr>';
$data_points = array("label" => $row['prob_equip_name'] , "y" => $row['rep_id']);
}
echo json_encode(array('data' => $data, 'dataPoints' => $data_points)); //json output populating data-grid and populating chart
}
?>
这是脚本所在的 index.php ,
<script>
$(document).ready(function() {
$("#picker1").datepick();
$("#picker2").datepick();
$('#picker1').datepick('setDate', 'today');
$('#picker2').datepick('setDate', 'today');
$('#submit').click(function() {
var name=$("#name").val();
event.preventDefault();
$.ajax({
type:"POST",
url: "new_prob_submit.php",
data: {
'date1': $('#picker1').val(),
'date2': $('#picker2').val()
},
dataType: "json",
success:function(result) {
$('#tbdy').html(result.data);
$.getJSON("handler.php", function (result) {
var chart = new CanvasJS.Chart("chartContainer", {
data: [
{
dataPoints: result.dataPoints
}
]
});
chart.render();
});
}
});
});
});
</script>
提前致谢!!