使用canvas动态更改文本大小

<canvas id="myCanvas" width="400" height="200"></canvas>

var canvas = document.getElementById("myCanvas");
var ctx = canvas.getContext("2d");

ctx.font = "30px Arial";
ctx.fillText("Hello World", 50, 50);

canvas.addEventListener("mousemove", function(event) {
  var mouseX = event.clientX - canvas.offsetLeft;
  var mouseY = event.clientY - canvas.offsetTop;
  var newSize = calculateNewSize(mouseX, mouseY); // 根据鼠标位置计算新的文本大小
  ctx.clearRect(0, 0, canvas.width, canvas.height); // 清空画布
  ctx.font = newSize + "px Arial"; // 设置新的文本大小
  ctx.fillText("Hello World", 50, 50); // 绘制文本
});

function calculateNewSize(mouseX, mouseY) {
  // 根据鼠标位置计算新的文本大小逻辑...
  return newSize;
}