Updating Graphics on Webpage

1

I’m using GlowScript to display interactive 3D graphics on a website.

I imagine I would mainly be using HTML and JavaScript for this.

I would like to have a button to have a user step between graphics. The graphics in each step would be similar with slight modifications.

I would want to have common code for all graphics and additional code for each of them. But besides that I’m not sure how the code should be structured. I’m also not sure if it would be best for the URL to change as it switches between graphics.

I realize this questions is a bit vague, but I’m mainly just looking for guidance on the general approach.

Thanks!

2

Do you know how to do DOM manipulation?

https://www.theodinproject.com/courses/foundations/lessons/dom-manipulation

A more modern approach would be to learn some library/framework, like React, Vue, or Svelte.

3

I watched the videos and I read the article.

Thinking about it more, I don’t think it would be very difficult. I’m thinking I could just have a variable for the stage number which would change when the buttons are toggled. It would then be an input to a function which would clear the canvas and create a new graphic.

I realize I didn’t use refer to any DOM manipulation techniques, but does this approach seem reasonable?

4

Seems reasonable enough. Although without knowing more about the actual implementation it’s hard to say much.

1 Like