美好的一天，我正在尝试创建图表。图表 value 来自 ajax return。
我得到了这个数据
"tgl":["2016-07-12 00:00:00.000","2016-07-01 00:00:00.000"],"total":[1283947,1234618514]}
这是我的 js 句柄 hightchart
xAxis: {
categories: [
$.each(data.tgl, function(k, v) {
data.tgl
})
]
},
series: [{
name: 'Outlet' +$("#outlet").val(),
data: [
$.each(data.total, function(k, v) {
data.total
})
]
}]
我不知道如何foreach ajax 所以我点击这个链接jQuery loop over JSON result from AJAX Success?
这是我的 php
function getajax()
{
extract(populateform());
$explode = explode('-',$date_search);
$start_date = inggris_date($explode[0]);
$end_date = inggris_date($explode[1]);
$hasil = $this->modelmodel->showdata("select tanggal,(cash + cc + dc + flash + piutang + reject + disc50)
total from transaksi
where tanggal between '$start_date' and '$end_date' and
outlet = '".$outlets."' order by tanggal desc");
$data = array();
foreach($hasil as $hsl)
{
$data['tgl'][] = $hsl->tanggal;
$data['total'][] = $hsl->total;
}
echo json_encode($data);
}
我上面脚本的结果是这样的。
正如您从我上面的数据中看到的那样。我的图表没有显示正确的值。应该是这样的 2016-07-12 00:00:00.000 => 1283947 and 2016-07-01 00:00:00.000 => 1234618514
我的 fiddle https://jsfiddle.net/oyrogu9v/1/
最佳答案
系列中应该有 2 个值:时间和总数。
series: [{
name: 'Winter 2012-2013',
data: [
[Date.UTC(1970, 9, 21), 0],
[Date.UTC(1970, 10, 4), 0.28],
..................
你可以在这里看到一个例子: Highchart sample timeserie
请试试这段代码:
$(document).ready(function() {
$("#test").click(function() {
var $btn = $(this);
$btn.button('loading');
$.ajax({
url: '<?=base_url();?>graph/getajax',
data: {outlets:$("#outlet").val(),date_search:$("#reservation").val()},
type: 'POST',
dataType: 'JSON',
success: function(data) {
var res= [];
$.each(data, function(k, v) {
res.push([new Date(data[k].tanggal).getTime(), data[k].total])});
$('#container').highcharts({
title: {
text: '',
x: -20 //center
},
subtitle: {
text: 'Omset ' + $("#outlet").val(),
x: -20
},
xAxis: {
type: 'datetime'
},
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 '+ $("#outlet").val(),
data:res
}]
});
});
setTimeout(function () {
$btn.button('reset');
}, 1000);
});
});
在这里你可以看到结果:https://jsfiddle.net/mb89apxr/
关于php - 带有 ajax 请求的 Highcharts，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/38342677/