search

phetsims / curve-fitting

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

Layer equation accordion box on top with some transparency #126

Closed amanda-phet closed 5 years ago

amanda-phet commented 5 years ago

We would like the equation accordion box to be layered on top of the points, error lines, error bars, and labels. It should have a white fill with at least 0.8 opacity (might need to play with values to get it right so that it is easy to read when any labels are behind it).

SaurabhTotey commented 5 years ago

I have moved the equation to the front and given it an opacity of 0.8. Here's what it looks like in master on a busy graph. Objects below the equation are still draggable.

graphequationinfront
amanda-phet commented 5 years ago

@kathy-phet what do you think? I think it looks good, but the thing that bothers me right now is that I can see the 10 label on the y-axis. So, this solution works well with points layered behind the equation, but I don't like constantly seeing that 10. Since we will be changing the bounds of the graphing area with #130 I will wait to make a final opinion.

kathy-phet commented 5 years ago

To fix that issue that Amanda notes, you can do what I said, basically make the expanded box have 2 fill layers - one that is behind the points but infront of the axis - that is solid white, and a second that is in front of the points that is a transparent white.

A bit tricky for sure, but I believe we have done this sort of thing in other sims. @SaurabhTotey could ask on the dev channel about it.

SaurabhTotey commented 5 years ago

This should be an easy fix, but the code will look slightly weird. I'll assign this to myself and get to work on this solution.

SaurabhTotey commented 5 years ago

Now the equation is layered such that the accordion box is on top of everything, and there is also a background behind the accordion box that is behind everything except for the graph axes. Points are still grabbable from under the equation.

Below is what it looks like.

graphempty graphbusy
SaurabhTotey commented 5 years ago

I'll experiment further with this once I tackle #130.

SaurabhTotey commented 5 years ago

Assigning to @amanda-phet to review and see whether the opaque layer of the equation in front of the axes but behind the points is still needed (which is what is on master right now). If not, I can revert back to having the equation only have the semi-transparent layer that will show everything below it including the axes.

kathy-phet commented 5 years ago

I think it looks good with the layering.

amanda-phet commented 5 years ago

I think this is working nicely.