ChartJS Line Chart

Multiple Line Chart

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.3.0/Chart.js"></script>
<body>
    <canvas id="chartJSContainer" width="600" height="400"></canvas>
</body>

CSS

canvas { background-color : #010EFF;
}

JavaScript

var config = {
        type: 'line',
        data:
        {
          labels: ["15W前", "14W前", "13W前", "12W前", "11W前", "10W前", "9W前", "8W前", "7W前", "6W前", "5W前", "4W前", "3W前", "2W前", "1W前", "1W目", "2W目", "3W目"],
          datasets: [
          {
            label: "ABC",
            color: "rgba(255,255,255,0.8)",
            backgroundColor: "rgba(53,231,226,1)",
            borderColor: "rgba(53,231,226,1)",
            //borderDash:      [ 1, 2],
            data: [0, 0,0, 0, 0,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ],
            fill: false
          },
          {
            label: "ABCDE",
            color: "rgba(255,255,255,0.8)",
            backgroundColor: "rgba(53,231,226,1)",
            borderColor: "rgba(53,231,226,1)",
            borderDash: [1, 2],
            data: [0, 0,0, 0, 0,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0 ,0],
            fill: false
          }]
        },
        options:
        {
          legend:
          {
            display: true,
            position: 'right',
            labels:
            {
              fontSize: 10,
              fontColor: "rgba(255,255,255,0.8)",
              boxWidth: 10,
              usePointStyle: false
            }
          },
          responsive: true,
          title:
          {
            display: false,
            text: 'Chart.js Line Chart'
          },
          tooltips:
          {
            mode: 'index',
            intersect: false,
            //3桁ごとにカンマ
            callbacks:
            {
              label: function(tooltipItem, data)
              {
                return tooltipItem.yLabel.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
              },
            },
          },
          hover:
          {
            mode: 'nearest',
            intersect: true
          },
          scales:
          {
            xAxes: [
            {
              display: true,
              scaleLabel:
              {
                display: false,
               ...