이전 목록 다음
채택완료

혹시 chart.js 질문도 될까요

민목
프로필 보기작성한 질문작성한 답변전체 작성글 보기전체 댓글 보기
 2023-01-27 (금) 14:51:31 3,020

1794488520_1674798623.2376.png

chart.js 사용해보고있는데요 그래프 안에 grid는 잘 지웠는데 X축 Y축 grid는 어떤 옵션으로 지워야하는지 아시나요?

Y축에 데이터도 안보이게해서 그래프만 남기려고하는데 찾아봐도 잘 모르겠어서 질문올립니다.

xAxes: [{
display: false,
}],

이런 옵션도 써봤는데 이건 안먹히더라구요...

차트
|

답변 1개 / 댓글 1개

채택된 답변
+20 포인트
배배르만
프로필 보기작성한 질문작성한 답변전체 작성글 보기전체 댓글 보기
 2023-01-27 (금) 15:05:46

https://www.chartjs.org/docs/latest/axes/labelling.html

링크에 각 옵션의 자세한 내용이 있는것 같습니다.

Copy 
<canvas id="my_chart" width="400" height="200" ></canvas>

<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/chart.min.js"></script>
<script>
var ctx = document.getElementById("my_chart").getContext("2d");

new Chart(ctx, {
    type: 'bar',
    data: {
        labels: ["Jan", "Feb", "Mar", "Apr"],
        datasets: [{
            label: "Title on top",
            data: [10, 80, 56, 60]
        }]
    },
    options: {
        plugins: {
            legend: {
                display: false
            }
        },
        scales: {
            x: {
                display: false
            },
            y: {
                display: false
            },
        }
    }
});
</script>

답변에 대한 댓글 1개

민목
프로필 보기작성한 질문작성한 답변전체 작성글 보기전체 댓글 보기
 2023-01-27 (금) 15:12:58
감사합니다 제가 뭘 잘못쓰고있었나봐요...

아래처럼 쓰고있었는데 잘 됩니다. 감사합니다.

[code]
const ctx = document.getElementById('abChart');
new Chart(ctx, {
type: 'line',
data: {
labels: ['', '', '', '', '', ''],
datasets: [{
data: [12, 19, 3, 5, 2, 3],
borderWidth: 0
}]
},
options: {
plugins: {
legend: {display:false}
},
scales: {
x: {
grid: {display: false}
},
y: {
grid: {display: false}
},
},
}
});
[/code]

답변을 작성하려면 로그인이 필요합니다.