将 ID 添加到画布绘图以供以后检索

Add ID to canvas drawing for retrieving later on

本文关键字:绘图 检索 添加 ID 布绘图      更新时间:2023-09-26

我使用以下代码将带有文本的圆圈添加到画布:

function drawCircle(username, id) {
  context.beginPath();
  context.arc(100, 100, 50, 0, 2 * Math.PI, false);
  context.fillStyle = 'rgba(255, 255, 255, 0.25)';
  context.fill();
  context.font = 'bold 8pt Impact, Charcoal, sans-serif';
  context.fillStyle = '#ffffff';
  context.textAlign = 'center';
  context.fillText(username, 100, 105);
}

它确实有效。但是是否可以添加 id,以便我以后可以使用 canvas['id'] 之类的东西与圆圈进行交互?

我用不同的用户名和ID多次调用drawCircle。

查看 W3C Canvas 规范的"命中区域"部分。

不过,我不知道这些得到了多大支持。 它似乎在Chrome 40中不可用。