Tạo TextField đầu vào ở vị trí chính xác trên Canvas?

Question

Canvas có thể vẽ văn bản nhưng không thể tạo trường nhập văn bản. Điều này có nghĩa là người ta phải làm điều đó trong html nhưng sau đó làm thế nào bạn có thể chắc chắn để vị trí mà textfield chính xác nơi bạn muốn?

Tôi muốn có thể thực hiện điều này theo chương trình khi chạy.

Answer 1

Tạo cấu trúc HTML sau để đặt hộp nhập liệu trên canvas.

<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> 

Hy vọng điều này sẽ giải quyết được vấn đề của bạn. Thay thế left=? và top=? bằng các vị trí thích hợp.