Как использовать несколько контекстов холста?

Question

Я хотел бы использовать experimental-webgl, а также контекст холста 2d. После того, как я нарисовал 3D-объекты, я хочу нарисовать над ними несколько 2D-объектов.

Как мне это сделать?

Answer 1

Вам нужен отдельный холст. Вы можете положить другой холст поверх первого, это не считается плохой практикой.

Answer 2

Вы не можете использовать несколько контекстов для одного элемента canvas.В WebKit это явно упоминается в источнике :

// A Canvas can either be "2D" or "webgl" but never both.

Если вы запрашиваете другой контекст, вы получаете null:

    if ((type == "webkit-3d") ||
        (type == "experimental-webgl")) {
        if (m_context && !m_context->is3d())
            return 0;

(такесли вы запрашиваете 3D-контекст, когда у вас уже есть другой контекст, вы получаете null.)

То, что вам, вероятно, нужно, - это два элемента canvas - один для 3D-материала, а другой для 2D-материала.Если вы поместите их друг на друга, они будут действовать как два слоя, и вы сможете рисовать на каждом холсте независимо друг от друга.