ChartJS 레이더 스케일 포인트

Question

나는 원하는대로 레이더 차트를 보여주고있다. 유일한 문제는 눈금이 20까지 올라야한다는 것입니다. 아래에서 볼 수 있듯이 강조 표시된 점은 17이며 차트에서 벗어납니다. 최대 점이 20이고 강조 표시된 점이 차트 안에 있도록 스케일을 조정하려면 어떻게해야합니까?

내가 가진 현재의 코드는 다음과 같습니다

var radarChartData = { 
    labels: ["ATT", "SPD", "POW", "DEF", "STA", "TEC"], 
    datasets: [ { 
     scaleOverride: true, 
     scaleSteps: 5, 
     scaleStepWidth: 5, 
     scaleStartValue: 0, 
     pointLabelFontSize: 16, 
     fillColor: "rgba(0,120,0,0.2)", 
     strokeColor: "rgba(0,120,0,1)", 
     pointColor: "rgba(10,10,10,1)", 
     pointStrokeColor: "#ccc", 
     pointHighlightFill: "#333", 
     pointHighlightStroke: "rgba(255,255,0,1)", 
     data: [12,15,17,16,11,13] 
    } ] 
}; 

나는 그것을 변경할 것 scaleSteps, scaleStepWidth 및 scaleStartValue 옵션이 될 것이라고 생각하지만, 그것은에 영향을 미칠 것 같지 않습니다.

편집 : 다른 데이터 세트에 영향을 미칠 것 같지 않습니다 ...

당신이 여기에서 볼 수 있듯이 (17)의 값이 차트에서 앉아 않습니다. 이 코드는 다음과 같습니다.

var radarChartData = { 
    labels: ["ATT", "SPD", "POW", "DEF", "STA", "TEC"], 
    datasets: [ { 
     scaleOverride: true, 
     scaleSteps: 5, 
     scaleStepWidth: 5, 
     scaleStartValue: 0, 
     pointLabelFontSize: 16, 
     fillColor: "rgba(0,120,0,0.2)", 
     strokeColor: "rgba(0,120,0,1)", 
     pointColor: "rgba(10,10,10,1)", 
     pointStrokeColor: "#ccc", 
     pointHighlightFill: "#333", 
     pointHighlightStroke: "rgba(255,255,0,1)", 
     data: [19,17,15,6,16,15] 
    } ] 
}; 

2의 차이점은 무엇입니까? 두 번째 값은 ATT에 대해 19의 값을 갖지만 차트 내에서 괜찮습니다.

Answer 1

좋아, 나는 오히려 데이터 세트에 비해, 아래와 같이 새로운 Radar 차트의 선언에 scaleSteps, scaleStepWidth 및 scaleStart를 이동하는 데 필요한 것을 알아 냈다.

window.onload = function(){ 
var ctx = document.getElementById("radarCanvas").getContext("2d"); 
window.myRadar = new Chart(ctx).Radar(radarChartData, { 
responsive: false, 
    pointDot:false, 
    showTooltips: false, 
    scaleOverride: true, 
    scaleSteps: 4, 
    scaleStepWidth: 5, 
    scaleStartValue: 0 
}); } 

작동 예제는 http://jsfiddle.net/7p8ffvqx/을 참조하십시오.