juliancwirko / nft-art-maker

NFT Art Maker - generates images and metadata files, packs them into IPFS CAR files, and uploads them using nft.storage. All from provided PNG layers.
MIT License
98 stars 36 forks source link

png to svg bug #1

Closed TheCrypticCamel closed 3 years ago

TheCrypticCamel commented 3 years ago

I've been trying to run this code and it works fine when the "svgBase64DataOnly" setting is set to "false". However when set to true I receive a fatal error when trying to run 'npx nft-art-maker generate'.

I'm unsure why I'm getting this after following the video exactly? I'm very new to this so it could be something very basic on my end that I've done wrong so apologies if this is the case!

The error code I get is:

Fatal error in , line 0 Check failed: !backing_store->is_wasm_memory(). FailureMessage Object: 0xbef82a10 Trace/Breakpoint trap

Thanks for any help in advance.

juliancwirko commented 3 years ago

Hi, I would need some more info:

  1. Could you paste your .nftartmakerrc config here?
  2. What OS are you using?
  3. What version of Node? From what I am aware, there are problems with the canvas library in Node 17

Also please install it globally and check if the version is 2.2.2

npm install -g nft-art-maker
nft-art-maker --version
TheCrypticCamel commented 3 years ago

Hi, thanks so much for your response!

my .nftartmakerrc confic is here: { "description": "Magic Layers", "svgBase64DataOnly": false, "layerConfigurations": [

{
  "growEditionSizeTo": 2,
  "layersOrder": [{ "name": "background" }, { "name": "Default Fur" }, { "name": "Default Fur Arms In" }, { "name": "earrings" }, { "name": "blushing" }, { "name": "sunglasses" }, { "name": "headwear" }, { "name": "clothing" } ]
},

{
  "growEditionSizeTo": 5,
  "layersOrder": [{ "name": "background" }, { "name": "Default Fur" }, { "name": "Default Fur Arms In" }, { "name": "earrings" }, { "name": "blushing" }, { "name": "sunglasses" }, { "name": "Hoodie Arms In" } ]
},

{
  "growEditionSizeTo": 15,
  "layersOrder": [{ "name": "background" }, { "name": "Default Fur Left Arm" }, { "name": "Default Fur" }, { "name": "lefthandweapon"}, 
   { "name": "earrings" }, { "name": "blushing" }, { "name": "sunglasses" }, { "name": "headwear" }, { "name": "righthandweapon"}, { "name": "Default Fur Right Arm" }, { "name": "clothing" } ]
},

{
  "growEditionSizeTo": 20,
  "layersOrder": [{ "name": "background" }, { "name": "Default Fur Left Arm" }, { "name": "Default Fur" }, { "name": "lefthandweapon"}, 
   { "name": "earrings" }, { "name": "blushing" }, { "name": "sunglasses" }, { "name": "righthandweapon"}, { "name": "Default Fur Right Arm" }, { "name": "Hoodie Arms Out" } ]
},

{
  "growEditionSizeTo": 25,
  "layersOrder": [{ "name": "background" }, { "name": "Default Fur Left Arm" }, { "name": "Default Fur" }, { "name": "lefthandweapon"}, 
   { "name": "earrings" }, { "name": "blushing" }, { "name": "sunglasses" }, { "name": "headwear" }, { "name": "righthandweapon"}, { "name": "Default Fur Right Arm" }, { "name": "clothing" } ]
},

{
  "growEditionSizeTo": 35,
  "layersOrder": [{ "name": "background" }, { "name": "fur-type" }, { "name": "armsin" }, { "name": "earrings" }, { "name": "blushing" }, { "name": "headwearnosunglasses" }]
},

{
  "growEditionSizeTo": 45,
  "layersOrder": [{ "name": "background" }, { "name": "armoutleft" }, { "name": "lefthandweapon" }, { "name": "fur-type" }, { "name": "earrings" }, { "name": "blushing" }, { "name": "sunglasses" }, { "name": "headwear" }, { "name": "righthandweapon" }, { "name": "armoutright" }]
},

{
  "growEditionSizeTo": 55,
  "layersOrder": [{ "name": "background" }, { "name": "lefthandshield" }, { "name": "armoutleft" }, { "name": "fur-type" }, { "name": "earrings" }, { "name": "blushing" }, { "name": "sunglasses" }, { "name": "headwear" }, { "name": "righthandweapon" }, { "name": "armoutright" }]
}

], "shuffleLayerConfigurations": false, "format": { "width": 360, "height": 360 }, "rarityDelimiter": "#", "uniqueDnaTorrance": 10000, "layersDirName": "layers", "outputDirName": "output", "outputJsonDirName": "json", "outputImagesDirName": "images", "outputJsonFileName": "metadata.json", "editionNameFormat": "#", "preview": { "thumbPerRow": 20, "thumbWidth": 48, "imageRatio": 1, "imageName": "preview.png" }, "baseImgUri": "" }

-- It runs absolutely perfect until I change the svgBase64DataOnly to true.

I'm running this all on a raspberry Pi on the Raspbian OS (unsure if this has been causing me problems too..)

Node version i'm running is v16.13.0, I did run into the canvas library problem in Node v17 but eventually managed to fix it by running this version..

The version of nft-art-maker being used is v2.2.2..

Thanks again for your help!

juliancwirko commented 3 years ago

I haven't tested anything yet, but could you run the same on Mac or Linux computers? Also, if you could try to check it in a smaller format, it would be helpful. Because SVG output in this tool is for tiny art pieces designed to be handled as on-chain art, the tool that runs that could have some limitations for big images. But I am just guessing, and I need to find more time and test it with bigger images. I want to eliminate these two cases for now.

TheCrypticCamel commented 3 years ago

Intriguing, yea I've changed the width + height back to 48 x 48 but the error still persists.. The png images I'm using are 48x48 so I was hoping to use this to scale up the 48x48 images to ~360x360 when displayed and not lose the resolution quality..

I will have a look at testing it on a mac/proper linux system.

juliancwirko commented 3 years ago

Ok, so for 48x48, the problem still occurs, so yes, please try on a Mac/Linux computer. If you have more logs, it would also be helpful.

TheCrypticCamel commented 3 years ago

I have now tested this on a Mac system and it works as intended! Now I just have to figure out how to generate the images from the svg data at the res I want..

Thanks so much for your help 👍

juliancwirko commented 3 years ago

If you need separate .svg files, you could run all base64 strings (in metadata.json), which starts with data:image/svg+xml;base64,.... through tools like: https://base64.guru/converter/decode/image/svg, in this case, it is manual work, but I believe that there are tools that could automate this. I don't plan to add it for now, but maybe in the future because I can see cases where it can be helpful.

Or you could paste it in the browser's address and then save it as .svg

TheCrypticCamel commented 3 years ago

That's perfect! I've got one more quick question for you which is the difference between having one metadata.json file or an individual .json file for each NFT? Is there any reason it's different in this compared to in hash lips? (Please excuse my noobishness here if it's a silly question!)

juliancwirko commented 3 years ago

Hashlips is more standardized, and a lot is happening there. My tool is still sort of a concept, so for now, I took only the basics. I test it only with the Elrond blockchain for now. When I find that separate metadata for every asset will be required, I will probably add it. So, please let me know if you have such a use case.

TheCrypticCamel commented 3 years ago

Interesting! yea so I'm very new to developing anything really, but have been swept away by the NFT craze over the past year+ paying close attention to everything that has been going on.. I have created PNG layers to make a 10k generative art project which I would like to release specifically on Elrond (Obviously I've made things harder for myself further by picking a more early stage chain, but Elrond is my favourite which offers in my opinion the solutions to a lot of issues). They also must generate on chain. I would then hope to build a marketplace for people to specifically trade this project and a DAO to go with it. That's the dream anyway but my coding skills/lack of knowledge is definitely holding me back. So I was just intrigued as to whether this code would effectively do the same as hash lips even without the specific metadata.json file for each nft, or whether it would need to be changed in order to mint the collection. If you have any interest in launching this kind of project let me know, I'd love to get somebody on board who actually knows what they're doing!

juliancwirko commented 3 years ago

Generally, when you have a lot of data which describes the NFT, it is probably better to do something like that: https://devnet-explorer.elrond.com/nfts/EGIRLS-3efe32-05, and I see the use case for separate JSON files in such case.

At least for now, I want to store minimal data in attributes on-chain, the best would be to keep everything on-chain, but of course, it will generate a bigger cost of minting and transactions. I am also interested in supporting small pieces of art on-chain and not using ipfs. I am aware that the price will probably be much higher, but I like the idea. Here are my tests: https://twitter.com/JulianCwirko/status/1454534528253505537

Anyway, I am aware that the official approach will probably be similar to the link above. I can't wait to see how the official Elrond NFT marketplace will work :)

TheCrypticCamel commented 3 years ago

I see! Well as I am planning to launch an on-chain art project not using ipfs it'd be great to have your input.. Let me know of any channel (eg. discord) where we can discuss this more in detail if you are interested in supporting our project!

Thanks again for all your help, I'm having big struggles trying to get any of this working but I suppose that is to be expected 👍