SVG for Sun Wind and Baro blocks

As discussed in another topic, some dashboard blocks look “ugly” on a (very) large monitor display.
The wind, barometer, sun rings and their arrows are drawn using “canvas scripts” generating pixel images.

Using higher resolution “photos” is tested, but AFAIK these photos are not available for all the different units used.
Also the 24 hour clock in the sun block should have the “sunlight” part above and the night part below.

Therefor I attach a set of the three block scripts which are using SVG to draw the images.

Only the “brave” should test these. always make a backup copy of the current scripts.

Question:
The advantage of the canvas scripts, is that there is only essential information.
The photo and SVG scripts use more complex detailed images.
I think it will be wiser to have both versions in a next release ?
This needs an extra easyweather-setting to switch between Canvas or SVG

Wim

P.S. The moon-block and the rain block are next to be converted to SVG.


svg_blocks.zip (18 KB)

Voted for both to give users a choice, but have to say I’m quite happy with my old version 1907 canvas blocks (with my small changes) on a 17" monitor. I don’t have a smart phone, either :slight_smile:

I prefer simplicity. . .

Since I look 90% on my smartphone WQHD+ 3040x1440, svg is clearly my favorite…

Sperber

Hi Wim,
I tried it right away!

I like it…
All my work for free … :frowning:
I don’t know exactly what I like better;)
At first I wanted to add the sharp arrows to my version, but unfortunately it’s not that easy.
You didn’t take a background svg; (

How do I get the background in the middle transparent?
It’s already very light on the black design …

Now I’m trying to put the arrows a little inwards and make them smaller. So that you can read the scale correctly.

The sun.php is a little too big and is cut off in the zoom …

Great job !! Did you write everything by hand with the values ??? You are crazy :slight_smile:

THX Sperber


At least Wim’s arrows will show the correct baro values :smiley:

I dont have a car :slight_smile:
95% of the time I don’t know what I’m doing … I just do it :slight_smile:

That “to white” will be done later, adjust the color by css

Now I’m trying to put the arrows a little inwards and make them smaller. So that you can read the scale correctly.
The sun.php is a little too big and is cut off in the zoom …
To big, indeed. Noted, thanks
Great job !! Did you write everything by hand with the values ??? You are crazy :slight_smile:
THX Sperber
Yes you have to write it by hand if you want to program it.
The visitor switches from C (metric) to F(US) and the dials should change also.
The clock should show am / pm if set to 12-hour time.
The WindDirs should be translated to the visitors language.
a.s.o.
One can use a SVG generation tool if one needs a very fine graphic item. But most of these weather SVG’s needs to display data which changes often.

Wim

Yes cool that it works like that …

I sat in the garden and thought it would be cool, just use my SVG as a background and that’s it;)
Think there is no background svg :frowning:

I make it in Photoshop and then convert it to svg.

Now I can’t tinker anything anymore …

PS:

When I insert my background svg, it is always on top of your svg.
How do I get the background svg really as a background? #-o

I voted for both but really like the svg.
Tom
https://www.shermanctweather.org/pwsWDLakeviewRd/

I used the svg. Love them

Nice work