Chart.js #6269 test01

by Akihiko Kusanagi

HTML

<script src="https://www.chartjs.org/dist/master/Chart.min.js"></script>
<canvas id="bevel" width=150 height=150></canvas>
<canvas id="round" width=150 height=150></canvas>
<canvas id="miter" width=150 height=150></canvas>

CSS

canvas {
  float: left;
}

JavaScript

function draw(joinStyle) {
  new Chart(document.getElementById(joinStyle), {
    type: 'radar',
    data: {
      labels: [0,1,2,3,4],
      datasets: [{
        data: [1,1,NaN,1,1],
        borderWidth: 20,
        borderJoinStyle: joinStyle,
        pointBorderWidth: 0
      }],
    },
    options: {
      responsive: false,
      legend: {
        display: false
      },
      scale: {
        display: false,
        ticks: {
          min: 0,
          max: 1.2
        }
      }
    }
  });
}

draw('bevel');
draw('round');
draw('miter');