개요

사진

샘플 코드

var myChart;
var ctx = document.getElementById("canvas").getContext("2d");
const yy =  [2, 0, 0, 0, 2, 0, 3, 0, 4, 4, 5, 0, 0, 2, 0, 0, 3, 0, 1, 0, 0, 2, 0, 1, 14, 16, 7, 8, 10, 10, 11, 17, 25, 12, 11, 19, 25, 14, 13, 15, 18, 19, 38, 29, 60, 41, 41, 9, 70, 58, 0, 62, 72, 66, 0, 39, 11, 35, 39, 44, 94, 27, 65, 114, 80, 81, 225, 173, 0, 87, 225, 317, 122, 522, 0, 515, 252, 351, 410, 863, 475, 743, 622, 275, 455,]
//alert(yy.length);
var pre = [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1,1,1,2,3,3,4,6,7,9,11,14,17,21,26,31,37,45,53,62,73,85,99,114,131,149,169,190,213,237,263,290,318,346,375,404,433,461,489,515,539,562,582,600,615,627,635,640,641,639,634,624,612,596,578,557,534,509,482,455,426,397,368,340,311,284,257,232,208,185,164,145,127,111,96,83,71,60,];
//alert(pre.length);
var label = [];
var data = [];
var s = 0;
for(var i = 0; i < 120; i++)
{
    label.push(i);
    if (i < 85)
    {
        s += yy[i]; 
    }
    else
    {
        s += pre[i];
    }
    data.push(s);
}
var j = 0;
var out = document.getElementById('out');
for(i = 0; i < 110; i++)
{
    if (i > 95)
    {
        j++;
        out.value += j + "," + data[i] + "\n";
    }
}
myChart = new Chart(ctx, {
  type: 'line',
    data: {
    labels: label,
    datasets: [{
      label: "covid-19",
      fillColor: "rgba(151, 187, 205, 0.2)",
      strokeColor: "rgba(151, 187, 205, 1)",
      pointColor: "rgba(151, 187, 205, 1)",
      pointStrokeColor: "#fff",
      pointHighlightFill: "#fff",
      pointHighlightStroke: "rgba(151, 187, 205, 1)",
      data: data
    }]
  },
    options: {
        elements: {
            rectangle: {
                borderWidth: 2,
                borderColor: 'rgb(0, 255, 0)',
                borderSkipped: 'bottom'
            }
        },
        responsive: true,
        legend: {
            position: 'top',
        },
        title: {
            display: true,
            text: 'Chart.js Line Chart'
        }
    }
});

아티팩트