虛無孟浪 虛無孟浪

1. Grid 그리기 // 그리드 정보 const gridCount = 9; const gridArea = {x:50, y:30, h:350, w:400}; // canvas const canvas = document.getElementById('chart'); const ctx = canvas.getContext('2d'); // 그리드 그리기 ctx.fillStyle = "#CCC" const gap = 50; for(let i = 0 ; i

1. html 문서에 Canvas Element 추가. (https://damlady.tistory.com/entry/켄버스-차트-그리기-1-라인-차트 동일) 2. 차트 정보 정의 // 차트 정보 정의. const gridCount = 5; const gridArea = {x:50, y:50, h:250, w:400}; const chartArea = {x:70, y:70, h:230, w:360}; 3. Grid 그리기 (https://damlady.tistory.com/entry/켄버스-차트-그리기-1-라인-차트 동일) 4. 최대값, perPixel 값 구하기 const max = data.reduce((prev,curr) => Math.max(prev,curr)); const perPixel = c..

1. html 문서에 Canvas Element 추가. 2. 차트 정보 정의 const gridCount = 5; const gridArea = {x:50, y:50, h:250, w:400}; const chartArea = {x:70, y:70, h:200, w:360}; 3. Grid 그리기 const canvas = document.getElementById('chart'); const ctx = canvas.getContext('2d'); ctx.fillStyle = "#CCC" const gapY = gridArea.h / gridCount; for(let i = 0 ; i Math.max(prev,curr)); const min = data.reduce((prev,curr) => Math.m..