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

Arrows clip in and out of visibility #92

Closed KatieWoe closed 5 years ago

KatieWoe commented 5 years ago

Test device: Dell Operating System: Win 10 Browser: Firefox Problem description: For https://github.com/phetsims/QA/issues/320. Fairly minor When the graph value arrows go over the y-axis, the left disappears so it doesn't cover a number. However, in certain locations (mostly near the bottom of the graph) parts of it can still be seen. Steps to reproduce:

  1. Refresh the sim
  2. Turn on projector mode (easier to see)
  3. Zoom in y-axis to max
  4. Adjust temp so that the left side of the curve is close to the y-axis
  5. Turn on Graph Values
  6. Grab the line on the x-axis that leads to the point. Do not let go until bug is observed
  7. Drag to the left until point is close to zero

Screenshots: arrowcorners

Troubleshooting information (do not edit):

Name: ‪Blackbody Spectrum‬ URL: https://phet-dev.colorado.edu/html/blackbody-spectrum/1.0.0-dev.16/phet/blackbody-spectrum_en_phet.html Version: 1.0.0-dev.16 2019-05-21 21:44:52 UTC Flags: pixelRatioScaling User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:67.0) Gecko/20100101 Firefox/67.0 Language: en-US Window: 1536x750 Pixel Ratio: 2.5/1 WebGL: WebGL 1.0 GLSL: WebGL GLSL ES 1.0 Vendor: Mozilla (Mozilla) Vertex: attribs: 16 varying: 30 uniform: 4096 Texture: size: 16384 imageUnits: 16 (vertex: 16, combined: 32) Max viewport: 32767x32767 OES_texture_float: true Dependencies JSON: {}
arnabp commented 5 years ago

This is related to #71. The intent was never to make the arrow completely disappear, I did want it to be somewhat visible if it, say, barely clipped the label. But the arrow at the very bottom of the axis is pretty ugly. So I'll reduce the size of the arrows so they fit. However, it'll still be clip a little when it's lined up horizontally and the clipping will be more apparent at the top. See master (phettest) and let me know how it looks @DianaTavares

DianaTavares commented 5 years ago

can the background of the label be bigger to get closer to the white vertical line of the y_axe?

Screen Shot 2019-05-23 at 4 27 34 PM

I think that it look good, but if you extend a little the background of the label to cover the arrow, it looks like only belongs to the graph and not outside.

arnabp commented 5 years ago

Arrow clipping now lines up perfectly with the leftmost side of the y axis, this should make the most sense without having any stray pixels visually, closing.

KatieWoe commented 5 years ago

Looking at https://github.com/phetsims/QA/issues/328. I saw that the point gets a little cut off now if close to the edge. I think this looks better than the alternative, so feel free to close if you agree @DianaTavares cutsoffpoint

DianaTavares commented 5 years ago

can the dot just be in front of the label black background?

arnabp commented 5 years ago

Was able to split up the dot and the arrows and put the arrows in front of the text label. I'll keep this open for testing.

KatieWoe commented 5 years ago

Looks good 1.0.0-rc.2

KatieWoe commented 4 years ago

Should this be examined @DianaTavares? peakofanarrow

DianaTavares commented 4 years ago

Do you mean that a tiny section fo the arrow still visible? I remember that @arnabp said that it is not a way to tell the arrow to disappears when it is outside the graph. For that reason, we put the background color to the value's label to cover the arrow. If we do that background bigger, it is going to cover part of the zero. Then I think that is ok the way it is now.

KatieWoe commented 4 years ago

Ok. Thanks for the clarification.