Tôi muốn biết về canvas HTML5. Trong phần tử canvas cơ sở của tôi, tôi muốn thiết lập hình nền, và trên đó tôi muốn thực hiện một số chức năng như xóa Erase, Undo, Clear và lưu hình ảnh đó (sau khi áp dụng tất cả hiệu ứng hoàn tác, xóa) .. hoặc ví dụ ..Có thể đặt hình nền trong canvas HTML5 và có thể thực hiện một số chức năng vẽ như Hoàn tác, Xóa, Xóa, Lưu hình nền đó không?
Cách thực hành thuận lợi nhất và dễ nhất là đặt nền đó làm div phía sau canvas.
Nhưng làm thế nào bạn có thể cho tôi biết một cách thiết thực ...? –
Bạn có thể vẽ Nền thành canvas, bằng cách sử dụng drawImage(). Tất cả các thao tác khác được sơn ontop hình ảnh.
Khi bạn hoàn thành công việc của mình, bạn có thể Xuất Canvasstate của bạn thành Hình ảnh.
Nhưng bạn phải giữ Lịch sử cho mọi tác vụ, vì canvas sẽ được sửa đổi trực tiếp.
Có thể phương thức Lưu và khôi phục là hữu ích.
Điều quan trọng là trước tiên bạn phải vẽ hình ảnh của mình lên canvas, vì vậy tất cả các hiệu ứng khác sẽ ảnh hưởng đến hình ảnh.
Sau khi hoàn tác, xóa, vẽ (với màu bút chì), khi tôi lưu hình ảnh đó, tôi không nhận được hình ảnh đó, tôi đã lưu hình nền mặc định màu trắng và một số được vẽ trên canvas đó bởi tôi. đặt trong canvas 'backgroundImage': 'url (./ tmp/Koala.jpg)' ..i muốn hình ảnh này được lưu với tất cả hiệu ứng tôi đã làm (hoàn tác, vẽ, xóa) .. –
Có thể sử dụng history API để hoàn tác và làm lại.
Phương thức toDataURL của đối tượng Canvas có thể được sử dụng để lưu hình ảnh.
Bản sao của [Lưu/khôi phục khu vực nền của Canvas HTML5] (http://stackoverflow.com/questions/4858187/save-restore-background-area-of-html5-canvas) và/hoặc [Xóa Canvas Rect nhưng Giữ Backgrond] (http://stackoverflow.com/questions/5596434/clear-canvas-rect-but-keep-background). – Phrogz