要使用HTML绘制热图，您可以使用HTML5中的Canvas元素和JavaScript。下面是一些基本步骤：
<canvas id="myCanvas"></canvas>var canvas = document.getElementById("myCanvas");
var ctx = canvas.getContext("2d");var colorMap = {
0: "#FFFFFF",
1: "#FF0000",
2: "#00FF00",
3: "#0000FF"
};这个映射表将数字0到3映射到4种不同的颜色。
var data = [
[0, 1, 2, 3],
[1, 2, 3, 0],
[2, 3, 0, 1],
[3, 0, 1, 2]
];这个数组表示一个4x4的矩阵，其中每个元素都是0到3之间的整数。
var cellWidth = canvas.width / data.length;
var cellHeight = canvas.height / data[0].length;
for (var i = 0; i < data.length; i++) {
for (var j = 0; j < data[i].length; j++) {
var color = colorMap[data[i][j]];
ctx.fillStyle = color;
ctx.fillRect(i * cellWidth, j * cellHeight, cellWidth, cellHeight);
}
}这个循环遍历数据数组中的每个元素，并使用颜色映射表中的颜色绘制矩形。
请注意，本例中的代码只是一个简单的示例。在实际应用中，您可能需要根据您的需求进行修改。