Error when trying to create an image in Node js

function BW(){
let pixels=[];
for(let i=0;i<256;i++){
pixels.push(random(0,255))
}
let l=Buffer.from(pixels);
console.log(l)

fs.createWriteStream('hi.png').write(l);
}
BW()
function BW(){
let pixels=[];
for(let i=0;i<256;i++){
pixels.push(random(0,255))
}
let l=Buffer.from(pixels);
console.log(l)

fs.createWriteStream('hi.png').write(l);
}
BW()
someone tell me how to fix this .
13 Replies
Jochem
Jochem•2y ago
you say you're getting an error, what error are you getting?
i_lost_to_loba_kreygasm
dont see any error in the code wise but when I open the file it says this file has bogus file header or smth
Jochem
Jochem•2y ago
Actual precise errors can be really helpful in diagnosing issues, it's a good idea to always include them in their entirety, including what you have to do to get that error if it's not just "run the code". If anyone doesn't know off the top of their head what's wrong, they might be able to figure it out by googling the error 🙂 But anyway, now that I have a bit more time to look at this, you're writing raw pixel values to a png file. PNGs are compressed and require headers you could probably write these pixel values to a .raw file, and open it using the appropriate software, but otherwise you'll have to find an image processing library and use that.
i_lost_to_loba_kreygasm
I tried googling the message bogus header ... , found some solutions , really not much but didnt work . So I asked here 😦 But I will try what you said What I am trying to do is basically create some random numbers , so I can generate a random black and white image will jpg work ? or .raw is the best for this ? I am just doing this for learning purposes, to learn how numbers work as data if i make sense
Jochem
Jochem•2y ago
the issue you're having is caused by images not just being a stream of pixel data, they have headers, format definitions, and a lot of other information. The way you're writing 256 bytes to a file, you'll end up with a file consisting of 256 bytes that have a value between 0 and 255, but you're missing any information about file type, how big the image is, what the numbers represent, even how many of them there are. It's just random data. There are image formats that work like that, I'm honestly not 100% sure they're .raw now that I think about it... If you want to save an easily used file format, you should use a library to take your raw pixel data and write them to a jpng or png or any other kind of image file one of the simplest image formats is bmp, and this is a very general overview of what a BMP file should look like internally. You need all these bits for a program to accept it as a bmp and display it to you:
Jochem
Jochem•2y ago
PNG and JPG are even more complicated. PNG uses pixel arrays but they're compressed using some kind of compression algorithm, they have four channels per pixel (RGBA). JPG has several different types, and use weird maths and gradients to represent image data instead of just storing pixel values
i_lost_to_loba_kreygasm
ah i think i know what you mean by compressions , i saw a video by Vox or smth So besides raw data , I also need additional infos , images are complicated then I thought , prob why I became curious btw can you tell me any specific keywords that I should google to look how image file works ?
Jochem
Jochem•2y ago
"file format description" should get you some useful resources but again, if all you want to do is have a raw pixel array and stick it in a png, there are libraries that take a Buffer and produce a valid PNG, it's just not fs.createWriteStream
i_lost_to_loba_kreygasm
ngl I tried 1 smth called node-bmp npm package ,didnt work , maybe my bad I will try looking for more 🙂 oh I have another question , its about buffers variables are a named location in memory right ? buffers are a location in memory as well right , my question is how does
var namedBuffer = Buffer.alloc(10)
var namedBuffer = Buffer.alloc(10)
, what does the namedBuffer point to ? it should point to the adress of bufffer or ?
Jochem
Jochem•2y ago
that's a level of abstraction you don't really need to worry about in Javascript, I'd say
i_lost_to_loba_kreygasm
Fair enough , was just curious haha anyway I will try those npms
Jochem
Jochem•2y ago
sorry, got a phone call, meant to add that it's abstracted away from you and will depend on the implementation of the javascript engine you're using. It's definitely not something I've ever had to think about when using javascript 🙂
Want results from more Discord servers?
Add your server