Problems with Gauge on iPad Mini

Dashboard
1

Hi,
i'm having troubles with gauges on dashboard 2.0 on a iPad mini. The "limits" value and the needle is off-set. (the problems are the same in Safari and Chrome). Looking at the same dashboard on a laptops browser everything seems fine. See pictures.

IMG_7302A4BAA4B4-1
IMG_7302A4BAA4B4-11536Ă—587 86.4 KB

Bildschirmfoto 2025-02-02 um 08.57.27
Bildschirmfoto 2025-02-02 um 08.57.27804Ă—638 21.9 KB

Is there any way to make this work? Best Chris

2

Are you using the latest version of the dashboard - 1.22.1?

3

apple doesn't (didn't*) permit competitors browsers to use there own renderer - they were all forced to use apples WebKit. Therefore this is a safari issue (no suprise there).

That said, this should not happen on WebKit. Are you using the very latest version? There was an issue with needle position in older versions.


* I think I read recently somewhere that apple was forced to allow browsers to use own renderer but I'm not sure if that is implemented by chrome or if you have the necessary iOS version to support it. I don't like/won't use apple so this may be a skewed memory

4

Yes, I am running v1.22.1.

5

Thank you. Yes I am running Dahsboard v1.22.1. Since my iPad mini gen4 is running iOS 15.8.3 (and apparently not supporting newer iOS) I guess I will be stuck there. Right? :angry: I see now, that on my iPhone (iOs 18.1.1) gauges are working properly with Safari.

6

Yes, this is a major issue with Apple devices and iOS/ipadOS in particular. This is why I recommend people don't start using newer CSS features since they will lock you out of using such devices for things like IoT and home automation local displays.

I've started making use of LightningCSS which does for CSS what ESBUILD can do for JavaScript and helps avoid the use of "new" features since you can target specific versions and cross-compile accordingly.

For folk building components, whether Web or Vue, and using CSS, I strongly recommend its use.

I've been trying to target back to iOS v12 - roughly early 2019 I think - for most of my CSS. That should cover Apple devices right back to around 2015 since Apple devices even back then tended to have reasonable timespans.

CSS, like JavaScript is going through an ongoing revolution of new features so it is doubly painful not to be able to necessarily use them. Thankfully, LightningCSS can deal with down-compiling some of those to usable CSS for older Safari versions.

PS: I think that the enforced use of alternative browsers is only applicable to the EU, I don't think Apple are allowing it elsewhere but they were forced to in the EU. And it only applies to new sales of course, it is not retrospective anyway.

7

Luckily there's more gauges you can use with dashboard 2.

1 Like