Undergrad Interactive Spacetime Diagrams: Get Feedback on What I Built

[Nick-stg]

TL;DR

I am looking for feedback for an interactive spacetime diagram tool that I created.

I built the tool initially for myself to better understand how Lorentz Transforms and spacetime diagrams work. Then while trying to discuss it with a friend I need to put it online and it snowballed from there.

Now I am wondering whether there is any value for others in what I have created.

The website is http://www.spacetimeglobe.com

 

[PeterDonis]

This looks interesting!

One suggestion: the diagram is much too small, and enlarging it just moves the controls (the list of objects and adding a new object) off the bottom of the screen so I have to scroll to them. I think it would be better to put the controls on the left and/or right side of the diagram, so everything can be on screen at once with no scrolling. That would make it much easier to use.

 

[Nick-stg]

Thank you for the feedback.

I think it would be better to put the controls on the left and/or right side of the diagram,

I totally get what you are saying. I'm going to have to play around with the layout. The items are stacked to make a simpler transition to the mobile phone layout.

 

[PeterDonis]

The items are stacked to make a simpler transition to the mobile phone layout.

One way to handle that is to have different CSS for mobile vs. desktop screens, so the layout can be side by side on desktops but top and bottom on mobile.

 

[SiennaTheGr8]

Might try a flexbox with 'flex-direction: column', and then use a media query that switches to 'flex-direction: row' at a screen width of maybe 500 or 600 pixels.

 

[Nick-stg]

I made some changes, the controls now appear to the left of the diagram on desktop, and when one clicks "enlarge" the diagram takes up the full screen pushing the controls down.

One way to handle that is to have different CSS for mobile vs. desktop screens, so the layout can be side by side on desktops but top and bottom on mobile.

Might try a flexbox with 'flex-direction: column', and then use a media query that switches to 'flex-direction: row' at a screen width of maybe 500 or 600 pixels.

This was already the case. The issue was not with CSS, the issue is that there is quite a bit JS, and changes to CSS has impacts on the JS. I had to sort all that out. But it's done I tested it and hopefully there are no bugs.

 

[PeterDonis]

I made some changes, the controls now appear to the left of the diagram on desktop

Actually they appear to the right on my desktop (Firefox running on Ubuntu 16.04 with Trinity Desktop, which is probably an outlier configuration). But that's fine, it's now easy to see everything on one screenful on my desktop.

 

[Nick-stg]

Actually they appear to the right on my desktop

Yes I meant the other left!

 

[Tomas Vencl]

The diagram is nice.
Maybe more clear way then your choice :"The new object's world line will then appear on the diagram. The circles with the emojis represent events that occurred at each tick of the reference object's clock"
is the put circles with the object's emojis always to 1 second events of proper time. Then is clearly visible, that in case of 2 observers is situation symmetric.
In your choice in case of more observers, the emojis of object 1 means 1s proper time ticks and the emojis of other observers means different things which may not be transparent. But this is not wrong, only your choice and you may have some other reason for your choice.

 

[Nick-stg]

In your choice in case of more observers, the emojis of object 1 means 1s proper time ticks and the emojis of other observers means different things which may not be transparent. But this is not wrong, only your choice and you may have some other reason for your choice.

They way I set it up is that all the event are based on Object1's clock, such that when viewing from Object1's perspective all the events appear simultaneous, this includes the events occur on the wordlines of the other objects . Once you change to another object's perspective events are no longer occurring at 1 sec intervals of the observing object's clock, they occur at some shorter time intervals.

I suppose I could add a feature to show the events at 1 second intervals based of each object's clock. In which case the events would appear staggered in time all views.

 

[robphy]

I suppose I could add a feature to show the events at 1 second intervals based of each object's clock. In which case the events would appear staggered in time all views.

That's the important feature in special relativity.
To each observer, the ticks at one-second intervals on their wristwatches are more meaningful
than the ticks at 0.8-second intervals as dictated by a remote observer's wristwatch moving at relative velocity (3/5)c and the 0.6-second intervals for one at (4/5)c.

No kings. There's a democracy among inertial observers in special (and Galilean) relativity.

 

[Nick-stg]

Sorry for the delay in responding, I was working on something else and I wanted to be sure to take the time to properly reflect and respond on issue raised.

is the put circles with the object's emojis always to 1 second events of proper time. Then is clearly visible, that in case of 2 observers is situation symmetric.

The green wordline, is the "reference" worldline (for the lack of a better term). I don't necessarily mean the reference frame, although it starts as that too. Events, the emoji circles, are shown, I guess somewhat arbitrarily, at one second interval on it's proper time clock. It is the "reference" in that these events are projected to any subsequent object's worldline added to the diagram such that the projected event occurs simultaneously as viewed from the "reference's" perspective. If one then changes "reference frame" the events no longer appear as occurring simultaneously and the user immediately witnesses time dilation.

Now, for the case of adding the events to each worldline based on it's own proper time clock. The issue is that all worldlines would appear with the same length and all events would always appear at the same relative locations. In other words, there would only be a single set of spacetime intervals, and the emoji would always remain on them. To demonstrate the effect of time dilation one would need to project one worldline's event onto a another. For a one to one relationship (only 2 worldlines shown) this would be feasible, but in a one to many scenario (up to 5 in my model) it then would become visually cluttered and complex.

The final point is that a user would want the events to be referenced from a different object's worldline. That is to make the object2's events the "reference". Currently, that would simply require the user create another diagram with object2 as the reference and the other worldline are then added relative to it. Ideally I could add a button to automate that process. This would then technically achieve showing another worldline (not reference worldline) with event at its proper time clock.

Please let me know what you think.

 

[Tomas Vencl]

Maybe is enough just keep emojis and everything as is, and add another marks (smaller triangles or so) which will show the 1 second ticks of proper time on each worldline. Yes, they will be always on intersection of each worldline with green hyperbolas. Then is clear what is the proper time ticks and what is projection from green reference worldline. Propper time marks will be coincidental on green reference worldline with emojis, but on the others the positions will be different.
The possibility to choose another object as the reference and show second diagram below is also good idea. But still, I would keep some smaller propper time marks at each worldline.

 

[Nick-stg]

@Tomas
Thanks for the feedback. I will play around with the idea, I need play around and see how I could best show those marks.