在Canvas上的精确位置创建输入TextField？

Posted 2021-04-15

Canvas可以绘制文本但不能创建输入文本字段。这意味着必须在html中执行此操作，但是您如何确保将该文本字段准确定位到您想要的位置？

我希望能够在运行时以编程方式执行此操作。

答案

创建以下HTML结构以将输入框放置在画布上。

<div id="container" style="width:500px; height:500px; position:relative;">
    <canvas id="drawing-surface" width="500px" height="500px"></canvas>
    <input type="text" style="position:absolute; left=?; top=?;" />
</div>

希望这能解决你的问题。用适当的位置替换left=?和top=?。