JSP부분
$(document).ready(function() {
$.ajax({
url: URL,
dataType: "json",
data: {a: ${param.a}} ,
type: "post",
success: function(data) {
ChartLine(data);
},
error: function(e) {
alert("차트 데이터를 가져오는데 실패하였습니다.");
}
});
});
function ChartLine(data){
var name= "ChartLine";
var getyear =[]; //년도 담는 배열
var count = []; //데이터 담는 배열
for(var a =0; a< data.data.length; a++ ){
getyear.push(data.data[a].변수);
count.push(data.data[a].변수);
}
Highcharts.chart(name, {
colors: ['#f67270'] ,
chart: {
type: 'line', // 종류별 차트
},
credits: {//하이차트.com 제거
enabled: false
},
exporting: {//상단 버튼 제거
enabled: false
},
title: {
text: ''
},
subtitle: {
text: ''
},
xAxis: [{
categories: getyear,
}],
yAxis: {
title: {
x:-30,
rotation: 0,
text: ''
}
},
legend: {
enabled: true
},
tooltip: {
pointFormat: '<b>{point.y}</b>'
},
series: [{
name: 'test',
data: count,
dataLabels: {
enabled: true,
rotation: 0,
color: 'read',
align: 'right',
format: '{point.y}', // one decimal
y: 10, // 10 pixels down from the top
style: {
fontSize: '13'
,fontFamily: 'notoSans'
,fontWeight: 'normal'
}
}
}]
});
}
<div class="box_graph">
<span class="tit_graph">(단위: 건/개)</span>
<div class="graph_in" id="blkCnChartLine1"><!-- 그래프가 들어갑니다. --></div>
컨트롤 부분
@RequestMapping(value = "/front/blk/blkCnChart.do")
@ResponseBody // 자바 객체를 HTTP 응답 본문의 객체로 변환
public Map<String,Object> blkCnChart((@RequestParam("a") String a)) throws Exception {
Map<String,Object> listMap = new HashMap<String,Object>(); //
List<Map<String, Object>> highchart = blkService.brokerCurrent(a);
listMap.put("data", highchart);
return listMap;
}