Line length by sunrise sunset

I have a line 200 pixels in length that equals 24 hours. I have a hash mark that moves by smooth rotation, starting at midnight and moving to the right along the line. I want to put another line on top of the first line with the length to start at sunrise and end at sunset. This line will depict the daylight hours.
I’m new at expressions, so any help is greatly appreciated. I am not using the pro version.


Hey . Nice Idea . There are guys that have done this stuff but it is difficult to find . I will try help . You must have a Basic grasp of the Progress fill thing .
You have to get the hrs time of sunrise *60 and the minutes of sun rise and add them together . The same for sunset . So if you subtract the SR mins from the SS mins you have the daylight duration . You can use #DISDAYTIME# To switch on and off the progress . I think you know how to scale the Line / Progress over the 200 PX.
The general rule on the Community as you may know is to Help People to get there rather than do it for them . Make a start and let us see where you get .
I would actually use a Shape layer Rectangle ( fill 0 to 1 ). Sometimes an Image is not possible to Zero the tail and it will scale will Scale . Perhaps easier if I show you .


Here is a quick test . My CAD annoyingly puts a Transparent border round anything I draw . I know how to deal with it but this is just for illustration . You will see that it simulates with the Time Machine slider . Note I have changed the pivot orientation of my drawn square . Check Align .
You will see the point is that it is scaled from the edge of the image and not the visible bit so it will never stay rooted on the left .
Let us know if you struggle to find the SR SS Tags you can do maths with .


This is hard to QC without simulating future sunrise times but you can get started with this for your daylight shape layer

X Position: (((34+#WSUNRISEH24#*8))+(#WSUNRISEM#*2))
Width: ((80+#WSUNSETH24#*.7)+(#WSUNSETM#*.02))

Play with the numbers until you get something close enough. But It think you can only check it once a day


Thank you. I’ll play around with that.


Thank you, pandaKrusher. I’ll start with these and let you know how I finish up.


Im no mathematician, but i just play around with the numbers until it works.
I have a day progress bar with daylight block and sun progress indicators in some of my watch faces

Below i have created a template with inspection on.
NOTE : The formulas below are not displaying correctly, some editor issue i think. Be sure to copy formula from the creator template.

In the template example…

  1. The day period bar starts at X=22 and Width=265.

  2. The daytime block has X= (22+(#WSUNRISEH24#10.65)+((10.65/60)#WSUNRISEM#))
    Where 22 is the X value of day period.
    The Width =

  3. The circle (sun progress) is X=

Now the GUESSWORK is to amend the value “10.65” in all occurences so the the circle and daytime block align at the correct sunrise and sunset points. This will need to change dependent on the starting X position and width values in 1. Day period bar.

It might not be perfect, but looks great and works for me.
Someone out there can probably achieve this simpler, but this is how i did it.
Hope it helps you, and does not confuse you more!

Tip…use the time machine slider to set the current day and time sunset and sunrise values to check alignment, and also check sliding from 00:00 to 23:59. You have to have date set todays date for the sunrise/sunset values to be available in creator.


Hey the Cavalry Has turned up for this one . Interesting the different maths styles All do the same Job .
@gmthesarge please keep an eye on my test . It is a WIP . I have tried hard to do the maths in the Peters Perfectly Descriptive Mathematics Format . Please note on Creator the SR SS are reported for L.A. and I am not sure if they ever change . But you probably know that .


Yes, pandakrusher’s formula definately looks simplier… the values 30 and 84 are the bits which confuse me…plus all the other bits…hence why my version is so complicated!! :rofl:

I’ve added another example to my template using pandaKrushers and RussellCressers example code.
Again dependent on the width of the progress bar you have to adjust the values to align.
I now have 2 code examples for this stuff!


The 30 and 84 are just buffers to align the daylight bar with OP’s 24-hour bar they listed in the original question. Those can be adjusted to nudge the asset’s starting points, similar to your “10.65” in the Sunrise to Sunset layer.

The difference between these two is that mine has an X position based on #WSUNRISEH24#, so the starting placement will scoot depending on sunrise time, but the 24-hour line will remain static:

Although I like the idea of combining both and have a solid 24-hour circle move linearly like OP describes in addition to a ring for day progress, and the two will overlap at exactly midday. I think? Noon on the equinox?


I’ve updated the formula again as there was an issue using fixed offsets that did not align correctly to sunset/sunrise periods for other timezones.

In the METHOD2 example, the beginning of the formulas in X and Width fields adjust as follows

‘33’ is the x position value of the day bar
‘247’ is the width value of the day bar
So if your day bar is Width 200 starting at X position 60, you just amend the formulas replacing 33 with 60 and 247 with 200.
Daybar X=33, Width=247
X=60, Width=200

Day progress X=(33+(((#DWFHS#)/360)*247))

And Sunrise to sunset



Wow. I have really gotten an education. Thanks to everyone. I’ll post up my finished face tomorrow. You guys rock!


Thanks again everyone! I was able to figure it out using PandaKrusher’s method. I’ve copied a lot of the comments for future use. Great info in the comments.


Nice face. Check your sunrise/sunset time formats. Seems to always show as 12 hour format regardless if watch time format is 24 hour format. Instead of 07:14, should be 19:14

1 Like

That’s correct. Turns out I can’t make that optional in the free version of creator. Thanks for the heads up.

1 Like

This is great. Thank you!

1 Like

Most things are possible in non premium watches.
Triple tapping the watch face shows the cog to open the settings page where you can toggle the time format (12/24hr) and unit system.

As always with facer there are several ways of displaying the sunrise/set times.
This is one way of doing it:

Sunset text 12/24 hour

Sunrise text 12/24 hour


Very nice! Thank you

1 Like

Ok. Here’s the final product after extensive tweaking. Bare with me, I’m just learning this coding. It’s harder than designing a bridge. I ended up using the method that suggested above. I’ll have to monitor it each sunrise and sunset for a while to make sure that I have it right. Again, a big thank you to everyone. I’ve copied all of the different suggestions to a work sheet that I keep for reference.