3
$\begingroup$

I am querying an API (weatherbit) which returns a moon phase number which looks like this:

0.9594168

For the 16 days I look at the numbers vary from 0.006 to 0.99. I have 8 "moon phase" icons for the full, crescent, gibbous, etc. phases. Filenames are the phase names.

How can I map the moon phase number to the phase names so I can use images with those names appropriately.

Final Update: Use moon_phase_lunation (instead of moon phase number) only

Here is the final js-react code which seems to be working well so far:

import React from 'react';
const Moon = ( data ) => {
  const lunation = Number(data.moon_phase_lunation);
  let imageToUse;
  if (lunation <= .06) imageToUse = 'new';
  if (lunation > 0.06 && lunation <= .19) imageToUse = 'waxing_crescent';
  if (lunation > 0.19 && lunation <= .31) imageToUse = 'third_quarter';
  if (lunation > 0.31 && lunation <= .44) imageToUse = 'waxing_gibbous';
  if (lunation > 0.44 && lunation <= .56) imageToUse = 'full';
  if (lunation > 0.56 && lunation <= .69) imageToUse = 'waning_gibbous';
  if (lunation > 0.69 && lunation <= .81) imageToUse = 'first_quarter';
  if (lunation > 0.81 && lunation <= .94) imageToUse = 'waning_crescent';
  if (lunation > 0.94 ) imageToUse = 'new';
  const imageURL = `/moonIcons/${imageToUse}.png`;
  return (
    <>
      <img src= { imageURL } width="20px" height="20px" />
    </>
  );
};

export default Moon;
Improve this question
$\endgroup$
5
  • $\begingroup$ Could you provide a link to the API you're using? Another number might help you distinguish waxing and waning phases. $\endgroup$
    – Mike G
    Dec 13, 2020 at 17:42
  • 1
    $\begingroup$ they also give "moon_phase_lunation" which for one value just checked was 0.95, but sure what values are used for that. url is rapidapi.com/weatherbit/api/weather and then 16 day forecast $\endgroup$
    – Michael Durrant
    Dec 13, 2020 at 18:12
  • $\begingroup$ Different but related question, you may find the question and answer posts and the comments under them illuminating (pun intended) Mapping illumination to moon phase (font) icon $\endgroup$
    – uhoh
    Dec 13, 2020 at 23:46
  • $\begingroup$ Looks good, but I think you have first and third quarters swapped. $\endgroup$
    – Mike G
    Dec 14, 2020 at 16:17
  • 1
    $\begingroup$ Yeah that kept confusing me. Ui looks right so maybe I got images right but names for those swapped. $\endgroup$
    – Michael Durrant
    Dec 14, 2020 at 16:21

2 Answers 2

Reset to default
6
$\begingroup$

The WeatherBit 16-day forecast documentation gives these output field descriptions:

  • moon_phase: Moon phase illumination fraction (0-1)
  • moon_phase_lunation: Moon lunation fraction (0 = New moon, 0.50 = Full Moon, 0.75 = Last quarter moon)

The illuminated fraction doesn't help you distinguish waxing and waning phases, so moon_phase_lunation is the value to use. One possible mapping is:

0.0 🌑 0.06 🌒 0.19 🌓 0.31 🌔 0.44 🌕 0.56 🌖 0.69 🌗 0.81 🌘 0.94 🌑 1.0

Improve this answer
$\endgroup$
4
  • $\begingroup$ Ah, that's great. bonus thanks for using the character codes. i also considered them but found them too yellow for me. luckily my backgfround is non-white so actual white moon work and look better to me $\endgroup$
    – Michael Durrant
    Dec 13, 2020 at 19:57
  • $\begingroup$ then ii considered some sort of blacfk and whote overlay but that seemed silly too $\endgroup$
    – Michael Durrant
    Dec 13, 2020 at 19:57
  • $\begingroup$ i also figured the change was a sine(/) wave which your numbers reflect so that is helpful $\endgroup$
    – Michael Durrant
    Dec 13, 2020 at 19:58
  • $\begingroup$ I expect that $\text{moon_phase} \approx \frac{1 - \cos 2 \pi ~ \text{moon_phase_lunation}}{2}$ $\endgroup$
    – Mike G
    Dec 13, 2020 at 20:07
4
$\begingroup$

It looks to me like these numbers from 0 to 1 are the amount of the moon showing, so a number near 0 is a new moon and a number near 1 is the full moon. Try

Min value Max value Phase name
0 0.05 New Moon
0.05 0.45 Waxing/Waning crescent
0.45 0.55 First/Third Quarter
0.55 0.95 Waxing/Waning gibbous
0.95 1.0 Full

If the numbers are going up, then use Waxing and First. If the numbers are going down, use Waning and Third. If it ends up that the numbers are instead the amount of moon in shadow, just reverse the order in the first two columns above.

Improve this answer
$\endgroup$
4
  • $\begingroup$ Yeah I was thinking about seeing if numebr is increasing or decreasing. However that's a bit tricky programming that. I am now hoiping the lumation will help as shown. seeing if u have thoughts on that approach and use $\endgroup$
    – Michael Durrant
    Dec 13, 2020 at 19:46
  • $\begingroup$ I am not familiar with 'lumation', but it sure looks like your code is working correctly now! $\endgroup$
    – Connor Garcia ♦
    Dec 13, 2020 at 19:48
  • 3
    $\begingroup$ It's not lumation, it's lunation. As in moon. $\endgroup$
    – hobbs
    Dec 14, 2020 at 6:40
  • 1
    $\begingroup$ Yes, lunation is the term, thanks $\endgroup$
    – Michael Durrant
    Dec 14, 2020 at 13:14

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .