HighChart line 하이차트 라인 그래프 사용 예시 / 하이차트 포인트 클릭 함수 달기

<%-- 식대 차트  --%>         
var arrData = [];      
var arrCategory = [];             
       
<c:forEach var="mgr0117VO" items="${arrMgr0117VO}" varStatus="status">
	/* 리스트 -> 배열 */   
	arrData.push(Number("<c:out value="${mgr0117VO.price}"/>")); 
	/* 배열 초과 */   
	arrCategory.push("<c:out value="${month}"/>/<fmt:formatNumber value='${status.count}' minIntegerDigits='2' type='number'/>");
</c:forEach>   
    
   
Highcharts.chart('chart01', {
    chart: {    
        type: 'line'  
    },                               
    title: false,
    navigation: {
       buttonOptions: {    
         y: -1000 //차트 다운버튼 화면에서 숨김  
       }
    },
    
    credits: {
       enabled: false //하단 하이차트 주소 숨김
    },
    yAxis: {
        title: false,
        labels : {   
            format: '{value:,.0f}'
        }
    },    
    xAxis: {   
     categories: arrCategory
    }, 
    plotOptions: {
        line: {
          dataLabels: {
            enabled: true  
          }      
        },        
	    series: {    
	        cursor: 'pointer',      
	        /* 클릭 이벤트 */
	        point: {        
	            events: {             
	                click: function () {             
	                	fncOpenModal("eatPoint.do", this.category + "_" + this.y); 
	                }
	            }
	        }
	    }
    },             
    tooltip: {                     
    
        headerFormat: '<span style="font-size:10px">{point.key}</span>', 
        pointFormat: '<table><tr><td style="color:{series.color};padding:0">{series.name}: </td>' +
                   '<td style="padding:0"><b>{point.y:,.0f}원</b></td></tr>',
        footerFormat: '</table>',
        shared: true,
        useHTML: true,  
    },         
    series: [{     
        name: '금액 합', 
        data: arrData, 
        color:'#6ba8ed',     
    }],
   	  
});

1. plotOptions 속성 내부 series - point - events - click - function(){} 설정으로 클릭 이벤트를 달 수 있다.