hdr-canvas 0.0.1 → 0.0.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +14 -0
- package/dist/hdr-canvas.cjs +24 -0
- package/dist/hdr-canvas.cjs.map +1 -1
- package/dist/hdr-canvas.d.ts +2 -0
- package/dist/hdr-canvas.js +24 -0
- package/dist/hdr-canvas.js.map +1 -1
- package/dist/hdr-canvas.min.js +1 -1
- package/dist/hdr-canvas.min.js.map +1 -1
- package/package.json +1 -1
- package/src/Uint16Image.ts +28 -0
- package/three/HDRWebGPUBackend.js +1 -1
package/README.md
CHANGED
@@ -2,6 +2,10 @@
|
|
2
2
|
|
3
3
|
This Module contains a collection of functions and classes to work with the HDR support for HTML `canvas` elements i chrome based browsers. This should only be considered as proof of concept or alpha code, don't use it in production environments.
|
4
4
|
|
5
|
+
## Perfomance
|
6
|
+
|
7
|
+
This module is intended as a proof of concept (PoC), especially operations on the `ImageData` arrays are not optimized, e.g. quite slow.
|
8
|
+
|
5
9
|
# Feature detection
|
6
10
|
|
7
11
|
Import the required function(s):
|
@@ -101,3 +105,13 @@ Use it as you'll do with a `WebGPURenderer`.
|
|
101
105
|
```javascript
|
102
106
|
renderer = new HDRWebGPURenderer({ canvas: canvas, antialias: true });
|
103
107
|
```
|
108
|
+
|
109
|
+
---
|
110
|
+
|
111
|
+
# TODO
|
112
|
+
|
113
|
+
The following things might be improved:
|
114
|
+
|
115
|
+
- Try to detect change of screen for HDR detection
|
116
|
+
- Improve speed
|
117
|
+
- Provide WebWorker
|
package/dist/hdr-canvas.cjs
CHANGED
@@ -5821,6 +5821,23 @@ class Uint16Image {
|
|
5821
5821
|
this.data.set(fn(this.data[i], this.data[i + 1], this.data[i + 2], this.data[i + 3]), i);
|
5822
5822
|
}
|
5823
5823
|
}
|
5824
|
+
static async loadSDRImageData(url) {
|
5825
|
+
return fetch(url)
|
5826
|
+
.then((response) => response.blob())
|
5827
|
+
.then((blob) => {
|
5828
|
+
return createImageBitmap(blob);
|
5829
|
+
})
|
5830
|
+
.then((bitmap) => {
|
5831
|
+
const { width, height } = bitmap;
|
5832
|
+
const offscreen = new OffscreenCanvas(width, height);
|
5833
|
+
const ctx = offscreen.getContext("2d");
|
5834
|
+
ctx === null || ctx === void 0 ? void 0 : ctx.drawImage(bitmap, 0, 0);
|
5835
|
+
return ctx;
|
5836
|
+
})
|
5837
|
+
.then((ctx) => {
|
5838
|
+
return ctx === null || ctx === void 0 ? void 0 : ctx.getImageData(0, 0, ctx === null || ctx === void 0 ? void 0 : ctx.canvas.width, ctx === null || ctx === void 0 ? void 0 : ctx.canvas.height);
|
5839
|
+
});
|
5840
|
+
}
|
5824
5841
|
static fromImageData(imageData) {
|
5825
5842
|
const i = new Uint16Image(imageData.width, imageData.height);
|
5826
5843
|
if (imageData.colorSpace == "srgb") {
|
@@ -5834,6 +5851,13 @@ class Uint16Image {
|
|
5834
5851
|
}
|
5835
5852
|
return i;
|
5836
5853
|
}
|
5854
|
+
static async fromURL(url) {
|
5855
|
+
return Uint16Image.loadSDRImageData(url).then((data) => {
|
5856
|
+
if (data !== undefined) {
|
5857
|
+
return Uint16Image.fromImageData(data);
|
5858
|
+
}
|
5859
|
+
});
|
5860
|
+
}
|
5837
5861
|
setImageData(imageData) {
|
5838
5862
|
this.width = imageData.width;
|
5839
5863
|
this.height = imageData.height;
|