search

phetsims / resistance-in-a-wire

"Resistance in a Wire" is an educational simulation in HTML5, by PhET Interactive Simulations.
http://phet.colorado.edu/en/simulation/resistance-in-a-wire
GNU General Public License v3.0
1 stars 4 forks source link

[mirror inputs] Drawing phenomenon when area is minimum #112

Closed ghost closed 6 years ago

ghost commented 7 years ago

Test device:

MacBook Air (13-inch, Early 2015)

Operating System:

macOS Sierra 10.12.6 (16G29)

Browser:

Safari Version 11.0 (12604.1.38.1.7)

Problem description:

There is a "drawing" phenomenon when area is minimum. This was discovered testing mirror inputs wrapper. This is for phetsims/QA/issues/53. This is similar to phetsims/resistance-in-a-wire/issues/108.

Steps to reproduce:

  1. Slide the area to it's minimum value.
  2. Move cursor around.

Screenshots:

oct-13-2017 15-50-25

phet-steele commented 7 years ago

@jessegreenberg...I'm going to jump the gun on assuming we will need help from @jonathanolson. Co-assigning to him.

jessegreenberg commented 7 years ago

In phetsims/ohms-law#68, we added preventFit to fix an issue where components were jostling during use. Really just a shot in the dark, but could that be related?

jonathanolson commented 7 years ago

This looks like the browser is having issues with how large the font ends up being. Maybe the mouse movement triggers the refresh on the top one (no clue).

Does this happen with rootRenderer=canvas?

jessegreenberg commented 7 years ago

@jonathanolson I cannot reproduce this problem with rootRenderer=canvas, that seems to fix it.

jessegreenberg commented 7 years ago

@jonathanolson is renderer: canvas for the letters in this sim a recommended fix?

EDIT: verified that fixes the problem for safari, not sure about implications for other platforms. EDIT2: Just tested chrome, performance is a bit worse when R is very large with renderer: canvas.

jonathanolson commented 7 years ago

Forcing that may affect performance and/or font/shape antialiasing.

@ariel-phet, should I look into workarounds for the specific case, so that we wouldn't have to force Canvas in this situation?

jonathanolson commented 7 years ago

See https://github.com/phetsims/resistance-in-a-wire/issues/108#issuecomment-340611488 for potential workarounds.

ariel-phet commented 7 years ago

@jonathanolson I am fine with forcing canvas unless it is brutal on performance. My quick look at font shape/aliasing seemed acceptable. I would rather not look into work around if not necessary.

@jessegreenberg perhaps only force canvas on safari? I would be fine with that

jessegreenberg commented 7 years ago

One recommendation from #108 was to rasterize text to images and scale that way. I tried that in #108, but I am still seeing this problem

jessegreenberg commented 6 years ago

In #108, this was fixed by rendering with canvas when using safari. Marking as fixed, pending testing.

phet-steele commented 6 years ago

Fixed in macOS 10.13.1, iOS 11.0.3, and iOS 9.3.5.