2010-08-08 3 views
12

Phương pháp getCSSCanvasContext() là gì? Tôi đã thấy nó trong bảng điều khiển gỡ lỗi của Chrome, nhưng tôi không thể tìm thấy bất kỳ tài liệu phong nha nào cho nó.Phương thức getCSSCanvasContext() của phần tử HTML5 là gì?

Điều đó có nghĩa là chúng ta có thể vẽ bằng cách sử dụng lệnh canvas trên bất kỳ phần tử nào?

+0

Cần lưu ý rằng phương pháp này không được dùng trong các bản dựng Chrome gần đây và có thể sẽ bị xóa: https://groups.google.com/a/chromium.org/forum/#!topic/blink-dev/WvqvdsmiQzg –

Trả lời

15

Phương pháp này được thực hiện trong WebKit (nghĩa là bạn cũng có thể sử dụng nó trong Safari) và trả về một đối tượng cho phép bạn vẽ thành hình ảnh CSS. Xem blog post này cho một ví dụ:

Trong nightly mới nhất, bạn có thể thử một tính năng mới: khả năng chỉ định bộ đệm hình ảnh có tên trong CSS và sau đó để vẽ vào chúng lập trình từ JavaScript. Đây là cách nó hoạt động.

background: -webkit-canvas(mycanvas);

Thay vì chỉ định một URL hình ảnh, bạn có thể chỉ định một canvas và một nhận dạng để sử dụng cho vải đó. API mới sau đây trên tài liệu sau đó có thể được sử dụng để lấy ngữ cảnh vẽ cho canvas đó.

CanvasRenderingContext getCSSCanvasContext(in DOMString contextType, in DOMString identifier, in long width, in long height);

+0

Xin lưu ý rằng phương pháp này đã không được chấp nhận và bị xóa khỏi tất cả nền tảng Chromium trong M48: https: // nhóm .google.com/a/chromium.org/forum/#! topic/blink-dev/WvqvdsmiQzg – akokskis

0

cũng không sử dụng ctx.clearRect (0, 0, w, h); đối với IE9 - nó không hoạt động sau mã này nếu bạn cố gắng vẽ thứ gì đó sau khi clearRect() bạn sẽ nhận được canvas trống