Rendering blocks to images

I’m trying to render code to images so I found this lovely source of information. I edited the fiddle so I could render MakeCode Arcade blocks instead of microbit blocks.

So I was able to convert

animation.runMovementAnimation(mySprite, [], 500, false);

to


which is great but is it possible to remove the on start block? I just want to have the singular block by itself. (Just like how you guys render docs for these blocks)

Also on a side note, do we have to use an iframe to render blocks or is there an API already in place for this? The iframe takes quite a bit of time to load, not sure if that is just the entire blockly renderer loading or something else…

2 Likes

Isnt that already in the animation category?

? That is in the animation category.

This block is in the animation category.
Screenshot 2024-04-10 9.50.46 AM

Add the snippetMode option around line 57:

            f.contentWindow.postMessage({
                type: "renderblocks",
                id: pre.id,
                code: pre.innerText,
                options: {
                	packageId: pre.getAttribute("pub"),
                  snippetMode: true
                }
            }, "https://arcade.makecode.com/");
1 Like

Wow! I’m so surprised I managed to miss that haha, thanks!

I think I need some more sleep… :sweat_smile:

I wonder what the plus symbol is supposed to be for :thinking: