チェックボックスでカウントした数をChart.jsに反映させたいです。

前提・実現したいこと

4つのタイプに分けられたチェックボックスがあり、1つのタイプにつき4つのチェックボックスがあります。（タイプA〜D）
チェックをつけ、カウントボタンを押すと、それぞれのタイプに、いくつチェックをつけたかが表示されます。

各タイプのカウントされた数値をChart.jsのレーダーチャートに反映させたいのですが、
反映させる事ができません。
ご教授の程よろしくお願い致します

###現状できている点
レーダーチャートのdataに直接、値を入れると問題なく表示されます。
チェックボックスにチェックを入れた数は、タイプ別でカウントされます。

不明な点

チェックボックスのチェックをカウントした値を、どのようにしたらChart.jsに入れられるかがわかりません。

該当のソースコード

html
1<!DOCTYPE html>
2<html lang="en">
3<head>
4  <meta charset="UTF-8">
5  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6  <title>Document</title>
7  <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.4/Chart.min.js" integrity="sha512-d9xgZrVZpmmQlfonhQUvTR7lMPtO7NkZMkA0ABN3PHCbKA5nqylQ/yWlFAyY6hYgdF1Qh6nYiuADWwKB4C2WSw==" crossorigin="anonymous"></script>
8  <script>
9    window.addEventListener('DOMContentLoaded', ()=>{
10  document.querySelector('#btn').addEventListener('click',()=>{
11    var t1c=document.querySelectorAll('.t1:checked').length;
12    var t2c=document.querySelectorAll('.t2:checked').length;
13    var t3c=document.querySelectorAll('.t3:checked').length;
14    var t4c=document.querySelectorAll('.t4:checked').length;
15
16    document.querySelector('#resultA').textContent=`タイプAの数は${t1c}です`;
17    document.querySelector('#resultB').textContent=`タイプBの数は${t2c}です`;
18    document.querySelector('#resultC').textContent=`タイプCの数は${t3c}です`;
19    document.querySelector('#resultD').textContent=`タイプDの数は${t4c}です`;
20
21  });
22
23  new Chart(document.getElementById("myChart"),{
24    type: 'radar',
25    data: {
26      labels: ["タイプA", "タイプB", "タイプC", "タイプD"],
27      datasets: [{
28        label: 'A_kun',
29        borderColor: "rgba(0,0,80,1)",
30        data: [3, 2, 3, 4]
31      }]
32    }
33  })
34});
35  </script>
36
37
38</head>
39<body>
40  <h3>タイプA</h3>
41  <label><input type="checkbox" class="t1">t1-1</label>
42  <label><input type="checkbox" class="t1">t1-2</label>
43  <label><input type="checkbox" class="t1">t1-3</label>
44  <label><input type="checkbox" class="t1">t1-4</label><br>
45
46  <h3>タイプB</h3>
47  <label><input type="checkbox" class="t2">t2-1</label>
48  <label><input type="checkbox" class="t2">t2-2</label>
49  <label><input type="checkbox" class="t2">t2-3</label>
50  <label><input type="checkbox" class="t2">t2-4</label><br>
51
52  <h3>タイプC</h3>
53  <label><input type="checkbox" class="t3">t3-1</label>
54  <label><input type="checkbox" class="t3">t3-2</label>
55  <label><input type="checkbox" class="t3">t3-3</label>
56  <label><input type="checkbox" class="t3">t3-4</label><br>
57
58  <h3>タイプD</h3>
59  <label><input type="checkbox" class="t4">t4-1</label>
60  <label><input type="checkbox" class="t4">t4-2</label>
61  <label><input type="checkbox" class="t4">t4-3</label>
62  <label><input type="checkbox" class="t4">t4-4</label><br>
63
64  <button id="btn" type="button">カウント</button>
65
66  <div id="resultA"></div>
67  <div id="resultB"></div>
68  <div id="resultC"></div>
69  <div id="resultD"></div>
70  <canvas id="myChart"></canvas>
71</body>
72</html>