괴발개발/Spring Framework
에러: chart with id '0' must be destroyed, chart is reused
moonday
2021. 10. 6. 16:55
에러가 2개가 있었는데,
1은 char의 데이터를 초기화안해줬다는 내용이고
2는 차트가 재사용되고있으니 새로 만들으란 이야기였음
=> id도 겹치지않고 canvas도 따로따로 각각 만들었으며 data는 =null이라는 선언도 있는데 개발자도구창에서만 빨간색 에러가 났음(기능은 문제없음)
이유:
메인화면에서 로그인 유/무에 따라서 차트 12개중 6개씩만 따로따로 보이는 상태였는데
body태그에서 c:if처리를 화면에서 한 것과 달리, 스트립트에서 사용하는 ajax는 그대로 12개 노출된 상태였기 때문.
=> user의 값을가져와서 var user = '${user}'; if(user==''){} 또는 if(user!=''){} 를 모두 에이젝스 앞에 각각 써주니 개발자 도구에 나타나는 에러 모두 해결.
var perConsulting=null;
var user = '${user}';
//월 별 상담 건수
$(document).ready(function(){
if(user != ''){
$.ajax({
type: 'post',
async : false,
url : contextPath + '/class/data/perConsulting',
success : function(result){
var data = [];
var labels = [];
if(result.length != 0){
for(i=0; i<result.length; i++){
data.push(result[i].studentCount);
labels.push(result[i].yearMonth);
}
}else{
data.push(0);
labels.push('기록없음');
}
var type = 'line';
var option1 = {
scales: {
yAxes: {
beginAtZero: true,
ticks: {
stepSize: 1
}
}
}
}
datasets = [{
label: '월 별 상담 건 수',
data: data,
fill: true,
borderColor: 'rgb(220, 53, 69)',
tension: 0.1
}]
id = 'btn_perConsulting';
perConsulting = createChart(perConsulting, id, labels, datasets, type, option1);
}
});
}
})