Skip to content

Commit 3d0fb5e

Browse files
committed
Working version for both
1 parent d54dba8 commit 3d0fb5e

File tree

1 file changed

+12
-14
lines changed
  • libraries/Camera/extras/WebSerialCamera

1 file changed

+12
-14
lines changed

libraries/Camera/extras/WebSerialCamera/app.js

Lines changed: 12 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -25,9 +25,8 @@ let config = {
2525

2626
const imageWidth = 320; // Adjust this value based on your bitmap width
2727
const imageHeight = 240; // Adjust this value based on your bitmap height
28-
const bytesPerPixel = 2; // Adjust this value based on your bitmap format
29-
// const mode = 'RGB565'; // Adjust this value based on your bitmap format
30-
const mode = 'GRAYSCALE'; // Adjust this value based on your bitmap format
28+
const mode = 'RGB565'; // Adjust this value based on your bitmap format
29+
// const mode = 'GRAYSCALE'; // Adjust this value based on your bitmap format
3130
const totalBytes = imageWidth * imageHeight * config[mode].bytesPerPixel;
3231

3332
// Set the buffer size to the total bytes. This allows to read the entire bitmap in one go.
@@ -167,22 +166,21 @@ function renderBitmap(bytes, width, height) {
167166
canvas.height = height;
168167
const bytesPerPixel = config[mode].bytesPerPixel;
169168
const BYTES_PER_ROW = width * bytesPerPixel;
170-
const BYTES_PER_COL = height * bytesPerPixel;
171169

172170
const imageData = ctx.createImageData(canvas.width, canvas.height);
173-
const data = imageData.data;
171+
const dataContainer = imageData.data;
174172

175-
for (let row = 0; row < BYTES_PER_ROW; row++) {
176-
for (let col = 0; col < BYTES_PER_COL; col++) {
177-
const dataIndex = (row * BYTES_PER_ROW) + (col * bytesPerPixel);
178-
const pixelValue = getPixelValue(bytes, dataIndex, bytesPerPixel);
173+
for (let row = 0; row < height; row++) {
174+
for (let col = 0; col < width; col++) {
175+
const sourceDataIndex = (row * BYTES_PER_ROW) + (col * bytesPerPixel);
176+
const pixelValue = getPixelValue(bytes, sourceDataIndex, bytesPerPixel);
179177
const [r, g, b] = config[mode].convert(pixelValue);
180178

181-
const idx = ((row * width) + col) * 4;
182-
data[idx] = r; // Red channel
183-
data[idx + 1] = g; // Green channel
184-
data[idx + 2] = b; // Blue channel
185-
data[idx + 3] = 255; // Alpha channel (opacity)
179+
const pixelIndex = ((row * width) + col) * 4;
180+
dataContainer[pixelIndex] = r; // Red channel
181+
dataContainer[pixelIndex + 1] = g; // Green channel
182+
dataContainer[pixelIndex + 2] = b; // Blue channel
183+
dataContainer[pixelIndex + 3] = 255; // Alpha channel (opacity)
186184
}
187185
}
188186
ctx.clearRect(0, 0, canvas.width, canvas.height);

0 commit comments

Comments
 (0)