Join the Webstudio community

Updated 2 months ago

Canvas Tag

At a glance

A community member inquired about the lack of a canvas element creation option and whether it is planned for the near future. Other community members responded, discussing the use case of rendering interactive 3D graphics, which requires a canvas tag along with various scripts and assets. They suggested using an HTML embed component to include the canvas element, but noted potential workflow challenges with uploading assets and integrating them for deployment. The community members also discussed the iteration-friendly nature of the platform, and a representative mentioned that in the future, the platform will support integrating code components and exporting no-code components, which may address the community member's concerns.

Hey, I noticed there is no option to create a <canvas> element and I was wondering if that is planned for the near future?
B
S
8 comments
What is your use case for canvas?
rendering interactive 3D graphics
So you need a bunch of scripts and one canvas tag. Would html embed work for you?
yeah spot on, bunch of scripts, some assets including 3D files, textures, some sounds sometimes too
oh yeah i guess you're right, I could write a canvas element with id in a html embed component?
Although I'm not sure how the workflow will look because I don't think I can upload the various assets and scripts to webstudio.

I guess I would link with the cli, build locally, then manually integrate the scripts and assets for rendering in the canvas before deploying to vercel or netlify from cli.

Sounds ok, but...

If after looking at the deployment I want to make changes to the website in webstudio, it seems like I will have to essentially repeat the whole process: sync from webstudio with cli, build locally, manually integrate for canvas rendering and deploy again.

It doesn't seem very iteration friendly - which kind of surprises me because other than this webstudio is so friendly to experimentation and iteration!

Maybe I'm overlooking something and there's a better way to do it?
In the future we will support integrating code components and exporting nocode components
ok, cool - that sounds great - thanks for replying - I might have missed using the html embed element πŸ˜‚ looking forward to experiment!
Add a reply
Sign up and join the conversation on Discord