这是第一个系列查询
function student_reports(){
$this->db->select('monthname(a.view_date) as name, count(a.report_id) as
data');
$this->db->from('report_view_track a');
$this->db->where('a.user_id', 1);
$this->db->where('a.preview_mode', "report");
$this->db->group_by('monthname(view_date)');
$this->db->order_by('a.id', 'ASC');
$query = $this->db->get();
}
这是结果:
----------------------
|date | count |
----------------------
|2018-01-12 | 80 |
|2018-02-12 | 100 |
|2018-03-12 | 20 |
|2018-04-12 | 60 |
|2018-05-12 | 50 |
|2018-06-12 | 50 |
|2018-07-12 | 50 |
第二个查询结果是相同格式的不同计数
function parents_reports(){
$this->db->select('monthname(a.view_date) as name, count(a.report_id) as
data');
$this->db->from('report_view_track a');
$this->db->where('a.user_id', 2);
$this->db->where('a.preview_mode', "report");
$this->db->group_by('monthname(view_date)');
$this->db->order_by('a.id', 'ASC');
}
public function get_mainarray() {
$this->load->model('admin_model');
$main_array = $this->admin_model->student_reports();
echo json_encode($main_array,JSON_NUMERIC_CHECK);
}
public function get_mainarray1() {
$this->load->model('admin_model');
$main_array= $this->admin_model->parents_reports();
echo json_encode($main_array,JSON_NUMERIC_CHECK);
}
<script>
$(function () {
var chart;
$(document).ready(function () {
chart = new Highcharts.Chart({
chart : {
renderTo : 'chart-contents',
type : 'spline',
animation: Highcharts.svg,
marginTop: 100,
style: {
fontFamily: 'Open Sans'
},
backgroundColor : {
}
},
title : {
text : 'Number of Report views',
align: 'left',
style: {
fontFamily: 'Poppins',
fontSize: '15',
fontWeight: '600'
},
x: 0,
y: 5
},
subtitle : {
text : 'An example of irregular time data in Highcharts JS',
align: 'left',
x: 0,
y: 30
},
legend: {
align: 'right',
verticalAlign: 'top',
y: -60
},
xAxis : {
type : 'datetime',
dateTimeLabelFormats : { // don't display the dummy year
month : ' %b',
year : '%b'
}
},
yAxis : {
title : {
text : 'Views '
},
min : 0
},
tooltip : {
formatter : function () {
return '<b>' + this.series.name + '</b><br/>' +
Highcharts.dateFormat('%e. %b', this.x) + ' | ' + this.y + ' Views';
}
},
plotOptions : {
area : {
lineWidth : 1,
marker : {
enabled : false,
states : {
hover : {
enabled : true,
radius : 5
}
}
},
shadow : false,
states : {
hover : {
lineWidth : 1
}
}
}
},
responsive: {
rules: [{
condition: {
maxWidth: 500
},
chartOptions: {
legend: {
align: 'center',
verticalAlign: 'bottom',
layout: 'horizontal'
},
yAxis: {
labels: {
align: 'left',
x: 0,
y: -5
},
title: {
text: null
}
},
subtitle: {
text: null
},
credits: {
enabled: false
}
}
}]
},
series : [{
name : 'Student',
legendColor: '4F43E4',
type : "area",
color: '#4F43E4',
fillColor : {
linearGradient : [0, 0, 0, 300],
stops : [
[0, Highcharts.getOptions().colors[0]],
[1, 'rgba(79, 67, 228, 0)']
]
},
// Define the data points. All series have a dummy year
// of 1970/71 in order to be compared on the same x axis. Note
// that in JavaScript, months start at 0 for January, 1 for February
etc.
data : [
[Date.UTC(1970, 9, 27), 0],
[Date.UTC(1970, 10, 10), 0.6],
[Date.UTC(1970, 10, 18), 0.7],
[Date.UTC(1970, 11, 2), 0.8],
[Date.UTC(1970, 11, 9), 0.6],
[Date.UTC(1970, 11, 16), 0.6],
[Date.UTC(1970, 11, 28), 0.67],
[Date.UTC(1971, 0, 1), 0.81],
[Date.UTC(1971, 0, 8), 0.78],
[Date.UTC(1971, 0, 12), 0.98],
[Date.UTC(1971, 0, 27), 1.84],
[Date.UTC(1971, 1, 10), 1.80],
[Date.UTC(1971, 1, 18), 1.80],
[Date.UTC(1971, 1, 24), 1.92],
[Date.UTC(1971, 2, 4), 2.49],
[Date.UTC(1971, 2, 11), 2.79],
[Date.UTC(1971, 2, 15), 2.73],
[Date.UTC(1971, 2, 25), 2.61],
[Date.UTC(1971, 3, 2), 2.76],
[Date.UTC(1971, 3, 6), 2.82],
[Date.UTC(1971, 3, 13), 2.8],
[Date.UTC(1971, 4, 3), 2.1],
[Date.UTC(1971, 4, 26), 1.1],
[Date.UTC(1971, 5, 9), 0.25],
[Date.UTC(1971, 5, 12), 0]
]
}, {
name : 'Teacher',
type : "area",
color: '#2F80ED',
fillColor : {
linearGradient : [0, 0, 0, 300],
stops : [
[0, Highcharts.getOptions().colors[0]],
[1, 'rgba(47, 128, 237, 0)']
]
},
data : [
[Date.UTC(1970, 9, 18), 0],
[Date.UTC(1970, 9, 26), 0.2],
[Date.UTC(1970, 11, 1), 0.47],
[Date.UTC(1970, 11, 11), 0.55],
[Date.UTC(1970, 11, 25), 1.38],
[Date.UTC(1971, 0, 8), 1.38],
[Date.UTC(1971, 0, 15), 1.38],
[Date.UTC(1971, 1, 1), 1.38],
[Date.UTC(1971, 1, 8), 1.48],
[Date.UTC(1971, 1, 21), 1.5],
[Date.UTC(1971, 2, 12), 1.89],
[Date.UTC(1971, 2, 25), 2.0],
[Date.UTC(1971, 3, 4), 1.94],
[Date.UTC(1971, 3, 9), 1.91],
[Date.UTC(1971, 3, 13), 1.75],
[Date.UTC(1971, 3, 19), 1.6],
[Date.UTC(1971, 4, 25), 0.6],
[Date.UTC(1971, 4, 31), 0.35],
[Date.UTC(1971, 5, 7), 0]
]
}
]
});
});
$('.octo-report-slider').owlCarousel({
loop:true,
margin:10,
responsiveClass:true,
responsive:{
0:{
items:1,
nav:true
},
600:{
items:1,
nav:true
},
1000:{
items:3,
nav:true,
loop:false
}
}
})
});
如何在高图区域样条图中以这种格式显示结果 => {数据:[Date.UTC(2017,02,15),50}
我尝试了多种方法来实现该目的,请立即为考试目的提供帮助。