From 09dbcc12d576d709f3c2904172020885b52d7b96 Mon Sep 17 00:00:00 2001 From: 1chandu Date: Thu, 22 Aug 2019 15:21:14 -0700 Subject: [PATCH] Add EXT_float_blend to feature table --- .../webgl/context/has-features.md | 8 ++++--- docs/developer-guide/extensions.md | 6 ++--- .../src/features/webgl-features-table.js | 13 +++++++---- modules/webgl/test/features/features.spec.js | 23 ++++++++++++++++--- 4 files changed, 37 insertions(+), 13 deletions(-) diff --git a/docs/api-reference/webgl/context/has-features.md b/docs/api-reference/webgl/context/has-features.md index af6343feda..3c15f77c7d 100644 --- a/docs/api-reference/webgl/context/has-features.md +++ b/docs/api-reference/webgl/context/has-features.md @@ -102,7 +102,7 @@ A partial list of features that are only available in WebGL2: ### Optional Feature Detection -The WebGL standard comes with an elaborate "extension" system allowing applications to check for the availability of features beyond the base WebGL1 and WebGL2 standards. These extensions tend to be rather technical, plus they have to be used differently in WebGL1 and WebGL2, so luma provides a simplified feature detection system. +The WebGL standard comes with an elaborate "extension" system allowing applications to check for the availability of features beyond the base WebGL1 and WebGL2 standards. These extensions tend to be rather technical, plus they have to be used differently in WebGL1 and WebGL2, so luma provides a simplified feature detection system. Following table lists all the available features, and their support under WebGL1 and WebGL2 , `NO` implies not supported, 'YES' implies supported and `*` implies supported through an extension. Parameters to `hasFeatures`: @@ -119,11 +119,13 @@ Parameters to `hasFeatures`: | `FEATURES.TEXTURE_FLOAT` | **YES** | * | Floating point (`Float32Array`) textures can be created and set as samplers (Note that filtering and rendering need to be queried separately, even in WebGL2) [`OES_texture_float`](https://developer.mozilla.org/en-US/docs/Web/API/OES_texture_float) | | `FEATURES.TEXTURE_HALF_FLOAT` | **YES** | | Half float (`Uint16Array`) textures can be created and set as samplers [`OES_texture_half_float`](https://developer.mozilla.org/en-US/docs/Web/API/OES_texture_half_float) [`WEBGL_color_buffer_float`](https://developer.mozilla.org/en-US/docs/Web/API/WEBGL_color_buffer_float) | | `FEATURES.MULTIPLE_RENDER_TARGETS` | **YES** | * | `Framebuffer`s can have multiple color attachments that fragment shaders can access, see `Framebuffer.drawBuffers` [`WEBGL_draw_buffers`](https://developer.mozilla.org/en-US/docs/Web/API/WEBGL_draw_buffers) | -| `FEATURES.COLOR_ATTACHMENT_RGBA32F` | | * | Floating point `Texture`s using the `GL.RGBA32F` format are renderable and readable [`EXT_color_buffer_float`](https://developer.mozilla.org/en-US/docs/Web/API/EXT_color_buffer_float) [`WEBGL_color_buffer_float`](https://developer.mozilla.org/en-US/docs/Web/API/WEBGL_color_buffer_float) | +| `FEATURES.COLOR_ATTACHMENT_RGBA32F` | * | * | Floating point `Texture`s using the `GL.RGBA32F` format are renderable and readable [`EXT_color_buffer_float`](https://developer.mozilla.org/en-US/docs/Web/API/EXT_color_buffer_float) [`WEBGL_color_buffer_float`](https://developer.mozilla.org/en-US/docs/Web/API/WEBGL_color_buffer_float) | | `FEATURES.COLOR_ATTACHMENT_FLOAT` | * | **NO** | Floating point `Texture`s are renderable and readable, i.e. can be attached to `Framebuffer`s and written to from fragment shaders, and read from with `readPixels` etc. Note that the formats include `GL.RGBA32F`. [`EXT_color_buffer_float`](https://developer.mozilla.org/en-US/docs/Web/API/EXT_color_buffer_float) | | `FEATURES.COLOR_ATTACHMENT_HALF_FLOAT`| * | **NO** | Half float format `Texture`s are renderable and readable[`EXT_color_buffer_half_float`](https://developer.mozilla.org/en-US/docs/Web/API/EXT_color_buffer_half_float) | +| `FEATURES.FLOAT_BLEND`| * | * | Blending with 32-bit floating point color buffers[`EXT_float_blend`](https://developer.mozilla.org/en-US/docs/Web/API/EXT_float_blend) | | [`WEBGL_depth_texture`](https://developer.mozilla.org/en-US/docs/Web/API/WEBGL_depth_texture) | -| `FEATURES.TEXTURE_DEPTH_BUFFERS` | **YES** | * | Depth buffers can be stored in `Texture`s, e.g. for shadow map calculations [| **GLSL | `TEXTURE_FILTER_LINEAR_FLOAT` | **Yes** | * | Linear texture filtering for floating point textures [`OES_texture_float_linear`](https://developer.mozilla.org/en-US/docs/Web/API/OES_texture_float_linear) | +| `FEATURES.TEXTURE_DEPTH_BUFFERS` | **YES** | * | Depth buffers can be stored in `Texture`s, e.g. for shadow map calculations | +| `TEXTURE_FILTER_LINEAR_FLOAT` | **YES** | * | Linear texture filtering for floating point textures [`OES_texture_float_linear`](https://developer.mozilla.org/en-US/docs/Web/API/OES_texture_float_linear) | | `FEATURES.TEXTURE_FILTER_LINEAR_HALF_FLOAT` | **Yes** | * | Linear texture filtering for half float textures [`OES_texture_half_float_linear`](https://developer.mozilla.org/en-US/docs/Web/API/OES_texture_half_float_linear) | | `FEATURES.TEXTURE_FILTER_ANISOTROPIC` | * | * | Anisotropic texture filtering [`EXT_texture_filter_anisotropic`](https://developer.mozilla.org/en-US/docs/Web/API/EXT_texture_filter_anisotropic) | | `FEATURES.SRGB` | **YES** | * | sRGB encoded rendering is available [`EXT_sRGB`](https://developer.mozilla.org/en-US/docs/Web/API/EXT_sRGB) | diff --git a/docs/developer-guide/extensions.md b/docs/developer-guide/extensions.md index fa3f50803c..321fc1dc3c 100644 --- a/docs/developer-guide/extensions.md +++ b/docs/developer-guide/extensions.md @@ -51,7 +51,9 @@ Note that many of these extensions are no longer available in WebGL2 as the func | `OES_texture_float_linear` | Enables linear filter for float textures | | | `OES_fbo_render_mipmap` | Render to specific texture mipmap level | | | `EXT_sRGB` | sRGB encoded rendering | | +| `WEBGL_color_buffer_float` | framebuffer render to 32 bit float color buffer | | | `EXT_color_buffer_half_float` | framebuffer render to half float color buffer | | +| `EXT_float_blend` | blending with 32-bit floating point color buffers | | ## WebGL2 Extensions @@ -61,7 +63,6 @@ These extensions expose various OpenGL ES 3.1 and 3.2 features that are often av | Extension | Enables | luma.gl support | | --- | --- | --- | | EXT_color_buffer_float | framebuffer render to float color buffer | | -| WEBGL_color_buffer_float | frame buffer render of various floating point format | | ## Proposed Extensions @@ -71,7 +72,6 @@ Khronos lists a couple of proposed extensions. They will be considered by luma.g | Extension | Enables | luma.gl support | | --- | --- | --- | | `EXT_clip_cull_distance` (WebGL2) | hardware clip/cull planes (ES3.2) | N/A | -| `EXT_float_blend` | 32 bit color blending | N/A | | `EXT_texture_storage` | texture storage effiency | N/A | | `WEBGL_debug` | Debug events | N/A | | `WEBGL_dynamic_texture` | frequently changin textures | N/A | @@ -84,7 +84,7 @@ Used to query if the GPU supports specific proprietary compressed texture format The primary advantage of compressed texture formats is that in contrast to JPGs or PNGs, they do not have to be decompressed to be used by the GPU. As a non-scientific guideline, compressed texture formats might achieve about 4x compression, compared to say 16x compression for JPEG. So while they are usually slower to load, but they could allow 4x more textures to be stored in the same amount of GPU memory. -The main issue of compressed texture formats is that they tend to be highly propietary (patent-encumbered) and there tends to be royalty requirements when using them. +The main issue of compressed texture formats is that they tend to be highly propietary (patent-encumbered) and there tends to be royalty requirements when using them. Note that (presumably due to patent issues), finding a compressed texture format which is supported across a range of target devices can be challenging. To side-step patent issues when using these formats an application would typically: diff --git a/modules/webgl/src/features/webgl-features-table.js b/modules/webgl/src/features/webgl-features-table.js index 4b1be273c3..26406434e8 100644 --- a/modules/webgl/src/features/webgl-features-table.js +++ b/modules/webgl/src/features/webgl-features-table.js @@ -1,5 +1,3 @@ -import {isWebGL2} from '../webgl-utils'; - // TODO - this should be the default export, test cases need updating export const FEATURES = { WEBGL2: 'WEBGL2', @@ -12,7 +10,10 @@ export const FEATURES = { // FEATURES ELEMENT_INDEX_UINT32: 'ELEMENT_INDEX_UINT32', + + // BLENDING BLEND_EQUATION_MINMAX: 'BLEND_EQUATION_MINMAX', + FLOAT_BLEND: 'FLOAT_BLEND', // TEXTURES: '// TEXTURES', RENDERBUFFERS COLOR_ENCODING_SRGB: 'COLOR_ENCODING_SRGB', @@ -39,8 +40,9 @@ export const FEATURES = { }; // Defines luma.gl "feature" names and semantics +// Format: 'feature-name: [WebGL1 support, WebGL2 support] / [WebGL1 and WebGL2 support]', when support is 'string' it is the name of the extension export default { - [FEATURES.WEBGL2]: [gl => isWebGL2(gl)], + [FEATURES.WEBGL2]: [false, true], // API SUPPORT [FEATURES.VERTEX_ARRAY_OBJECT]: ['OES_vertex_array_object', true], @@ -50,7 +52,10 @@ export default { // FEATURES [FEATURES.ELEMENT_INDEX_UINT32]: ['OES_element_index_uint', true], + + // BLENDING [FEATURES.BLEND_EQUATION_MINMAX]: ['EXT_blend_minmax', true], + [FEATURES.FLOAT_BLEND]: ['EXT_float_blend'], // TEXTURES, RENDERBUFFERS [FEATURES.COLOR_ENCODING_SRGB]: ['EXT_sRGB', true], @@ -67,7 +72,7 @@ export default { // FRAMEBUFFERS, TEXTURES AND RENDERBUFFERS [FEATURES.COLOR_ATTACHMENT_RGBA32F]: ['WEBGL_color_buffer_float', 'EXT_color_buffer_float'], [FEATURES.COLOR_ATTACHMENT_FLOAT]: [false, 'EXT_color_buffer_float'], - [FEATURES.COLOR_ATTACHMENT_HALF_FLOAT]: [false, 'EXT_color_buffer_half_float'], + [FEATURES.COLOR_ATTACHMENT_HALF_FLOAT]: ['EXT_color_buffer_half_float'], // GLSL extensions [FEATURES.GLSL_FRAG_DATA]: ['WEBGL_draw_buffers', true], diff --git a/modules/webgl/test/features/features.spec.js b/modules/webgl/test/features/features.spec.js index f21f3bd28e..a2b085b1d8 100644 --- a/modules/webgl/test/features/features.spec.js +++ b/modules/webgl/test/features/features.spec.js @@ -29,7 +29,6 @@ const WEBGL_FEATURES = { TEXTURE_HALF_FLOAT: true, COLOR_ATTACHMENT_FLOAT: false, - COLOR_ATTACHMENT_HALF_FLOAT: false, // GLSL extensions GLSL_FRAG_DATA: true, @@ -45,6 +44,24 @@ test('webgl#caps#imports', t => { t.end(); }); +test('webgl#caps#hasFeatures (WebGL1)', t => { + const {gl} = fixture; + const UNSUPPORTED_WEBGL1_FEATURES = [FEATURES.WEBGL2, FEATURES.COLOR_ATTACHMENT_FLOAT]; + + t.notOk(hasFeatures(gl, UNSUPPORTED_WEBGL1_FEATURES), 'hasFeatures should return false'); + t.end(); +}); + +test('webgl#caps#hasFeatures (WebGL2)', t => { + const {gl2} = fixture; + const SUPPORTED_WEBGL2_FEATURES = [FEATURES.VERTEX_ARRAY_OBJECT, FEATURES.INSTANCED_RENDERING]; + + if (gl2) { + t.ok(hasFeatures(gl2, SUPPORTED_WEBGL2_FEATURES), 'hasFeatures should return true'); + } + t.end(); +}); + test('webgl#caps#getFeatures', t => { const {gl} = fixture; @@ -58,7 +75,7 @@ test('webgl#caps#getFeatures', t => { t.end(); }); -test('webgl#caps#hasFeatures(WebGL1)', t => { +test('webgl#caps#hasFeature(WebGL1)', t => { const {gl} = fixture; t.ok(typeof hasFeatures === 'function', 'hasFeatures defined'); @@ -71,7 +88,7 @@ test('webgl#caps#hasFeatures(WebGL1)', t => { t.end(); }); -test('webgl#caps#hasFeatures(WebGL2)', t => { +test('webgl#caps#hasFeature(WebGL2)', t => { const {gl2} = fixture; if (gl2) {