How to resize turtle canvas when exporting for web?

Hello, I hope this message finds you well! I want to export an app to the web and to resize it to a larger canvas/viewport. I am able to play with the HTML and CSS to get the viewport itself to open larger, but the turtle canvas seems to stay put at the original 320x450 resolution. I am not sure what element I need to change.

The turtle canvas seems to be initialized when I open the index.html file. I can then retroactively change the resolution through inspect element, but then the strokes/lines of the turtle become square. I can also see that the turtle is able to move beyond the bounds of the turtle canvas; maybe it is something to do with the viewport only. Thank you for your help!

Hi @mp.michaelpham,

That sounds like a really cool project! This forum is intended for teachers using the CS Principles course in their classrooms. Your project is a little beyond the scope of what we can officially support here, but perhaps someone else in the community has expertise and will be able to assist.

Thanks!
–Michael K.

Hello,

I have actually resolved the problem. I looked around a bit more into applab-api.js and I found that changing these lines/values resizes the turtle canvas. Thanks for reaching out, I really appreciate it!

By the way, the project is a random color painter/generator :-).

1 Like