[{"outlet":"K-SM3","tanggal":"2016-06-02","total":5083600},
{"outlet":"K-SM3","tanggal":"2016-06-01","total" :4660500},
{"outlet":"K-PKM","tanggal":"2016-06-02","total":1576250},
{"outlet":"K-PKM","tanggal":"2016-06-01" ,"total":921300}]
我目前正在学习高图。以上是我console.log
的结果,我使用ajax来显示某些数据。但没有运气,图表没有显示出来。我无法在console.log
内找到错误。
我的PHP脚本
function onchange()
{
extract(populateform());
$explode = explode('-',$tgl);
$start_date = inggris_date($explode[0]);
$end_date = inggris_date($explode[1]);
$jumlah = count($datanya);
$result = array();
for($x = 0 ;$x<$jumlah;$x++)
{
$hasil = $this->modelmodel->showdata("select outlet,convert(date,tanggal)tanggal,(cash + cc + dc + flash + piutang + reject + disc50)
total from transaksi
where outlet = '".$datanya[$x]."' and tanggal between '$start_date' and '$end_date' order by tanggal desc");
foreach($hasil as $hsl)
{
$result[] = $hsl;
}
}
echo json_encode($result);
}
这是我的JavaScript
$('.changeschanges').change(function() {
$.ajax({
url: '<?=base_url();?>graph/onchange',
data: {datanya:$(".select2").val(),tgl:$("#reservation").val()},
type: 'POST',
dataType: 'JSON',
success: function(data) {
$.each(data, function(k, v) {
res.push(data[k].outlet,[data[k].tanggal, data[k].total])
});
$.each(data, function(k, v) {
date.push([data[k].tanggal])
});
$.each(data, function(y, x) {
otl.push([data[y].outlet])
});
$('#container').highcharts({
title: {
text: '',
x: -20
},
subtitle: {
text: 'Perbanding Grafik Pendapatan',
x: -20
},
xAxis: {
categories: date
},
yAxis: {
title: {
text: 'Rupiah (Rp.)'
},
plotLines: [{
value: 0,
width: 1,
color: '#808080'
}]
},
tooltip: {
valueSuffix: ' Rupiah'
},
legend: {
layout: 'vertical',
align: 'right',
verticalAlign: 'middle',
borderWidth: 0
},
series: [{
name: 'Outlet '+ otl,
data: res
}]
});
setTimeout(function () {
}, 1000);
},
});
});
我能够用这个ajax结果创建ajax
[{"tanggal":"2016-04-03","total":5371010},
{"tanggal":"2016-04-02","total":6387090},
{"tanggal":"2016-04-01","total":2116550}]
为什么我在最新的ajax结果中添加outlet
(在顶部)。因为会有多行K-SM3 & K-PKM
。抱歉我的英语不好。
结果示例