search

phetsims / blackbody-spectrum

"Blackbody Spectrum" is an educational simulation in HTML5, by PhET Interactive Simulations.
GNU General Public License v3.0
1 stars 3 forks source link

Where to put Spectral Radiation label for the graph values point #29

Closed SaurabhTotey closed 6 years ago

SaurabhTotey commented 6 years ago

When making the graph values draggable point node, I have run into some issues for where the y-axis label should be placed. According to the design document, the label should be placed to the left of the y-axis similar to the image below.

screen shot 2018-07-11 at 10 37 49 am

However, this causes a few issues where there isn't enough space on the screen to put the label there: the label is intersecting with the y-axis label and the graph is getting pushed to the right and is scrunched with the thermometer.

I tried changing the placement for a few different ways, and the one that worked the best looks like the image below.

screen shot 2018-07-11 at 10 43 37 am

This doesn't look great either, but the text being on top of the dashed lines and to the right of the y-axis meant that the graph wasn't getting pushed or altered due to space constraints.

I also tried rotating the text and changing font size, but to stop pushing the graph, neither of these solutions worked because the font size had to become too small to read to stop pushing the graph. Are there any other ideas for what can be done for the placement of this label? I personally don't like how either of the above options look.

DianaTavares commented 6 years ago

This is the mock up (the values in the mockup are just examples): screen shot 2018-07-17 at 5 33 37 pm

One of the things is that the name of the axes is smaller (the same size that the "BlackBody Temperature" text). That change allows to moved the Y-axis label in the bottom of the zoom controls to give space for the numbers. The labels and the zoom controls are aligned in both axes.

The units are in the label, that way it can be deleted from the green text. That mean that the wavelength number should be in micrometer and not in nano.

Other thing is with the model, with the numbers in the Y-axe, I expected to see a value between 0 and 300 for the spectral radiance. I thought that the units that have the spectral radiance were with the intention of leaving numbers without scientific notation. I review other website and I find this curve for the same values in the pictures in this issue screen shot 2018-07-17 at 6 48 09 pm

I am going to review the model used in the sim, because with numbers without scientific notation, they can fit very well in the space in the graph. And I think that the -32 exponent is not correct with the units that we are using in the sim.

ariel-phet commented 6 years ago

Reviewed the model with @DianaTavares and it appears some correction factors are missing (mainly due to some oddness in the units of using microns for wavelength)

@SaurabhTotey you and I should also discuss the way the model is laid out briefly with @jbphet, it seems many of the factors include in the calculation are "far away" in the code, and that is not perhaps best practice. It seems to be it could be rewritten slightly in a more maintainable/clearer fashion.

SaurabhTotey commented 6 years ago

Ok, I will get started on correcting the units. The nm to μm fix should be easy, and the fix for the y axis should also be easy as it seems that the label is off by a consistent factor of 1e33. I see now that the axis labels are smaller in the design doc, so I will see if freeing up that space will allow the GraphValuesPoint labels to be where they belong without pushing the graph. Thanks!

DianaTavares commented 6 years ago

Already implemented an looks amazing! closing