Create TeamAdd Your APIDocs
Log In
Sign Up

Moon Phase

FREEMIUM
By Moon-API.com | Updated 한 달 전 | Science
Popularity

9.6 / 10

Latency

273ms

Service Level

100%

Health Check

100%

Back to All Discussions

Zodiac Sign Not Working?

Rapid account: Dietmoonlyte
dietmoonlyte
3달 전

I have tried every possible solution and everything else loads except the Zodiac Sign for the moon. Can you please fix it? That’s the main reason I purchased the Advanced membership.

Rapid account: Moon AP Icom
MoonAPIcom Commented 3달 전

Hi Dietmoonlyte,

First off, cheers for your patience and apologies for the tardy response. We’ve had a look at the issue you mentioned regarding the Zodiac Sign data not loading as expected. After reviewing the details you’ve provided, it seems everything is in working order on our end.

The snag appears to lie in how the Zodiac Sign data is being accessed in your code. Based on the API’s response structure, the Zodiac Sign information is nested a bit deeper than your current code fetches. You’re trying to grab it directly from data.moon.zodiac_sign, but the actual data you’re after is located within data.moon.zodiac_sign.moon_sign for the moon’s sign and data.moon.zodiac_sign.sun_sign for the sun’s sign.

Here’s a quick tweak to your code that should fix the issue:

<script>
 document.addEventListener('DOMContentLoaded', function() {
  const url = 'https://moon-phase.p.rapidapi.com/advanced';
  const options = {
    method: 'GET',
    headers: {
      'X-RapidAPI-Host': 'moon-phase.p.rapidapi.com'
      'X-RapidAPI-Key': 'API_KEY_HERE'
    }
  };

  fetch(url, options)
    .then(response => response.json())
    .then(data => {
      document.getElementById('moon-phase').innerHTML = '<span id="phase-text">' + data.moon.phase_name + '</span>'; 
      // Updated line below to fetch the moon sign correctly
      document.getElementById('zodiac-sign').innerHTML = '<span id="zodiac-text">' + data.moon.zodiac.sun_sign + ' & ' + data.moon.zodiac.moon_sign + '</span>';
    })
    .catch(error => console.error('Error:', error));
  }); 
</script>

This should ensure that the Zodiac Sign information (both sun sign and moon sign) is displayed as intended. Give this a shot, and please let us know if you’re still facing any issues. We’re here to help get this sorted for you.

Best,
Luke @ Moon-API.com

Rapid account: Dietmoonlyte
dietmoonlyte Commented 3달 전

Any update? It’s been several days…

Rapid account: Moon AP Icom
MoonAPIcom Commented 3달 전

Hi dietmoonlyte, Thank you for raising this, we will look into this right away and keep you updated.
Thank you
Moon-API.com support

Rapid account: Dietmoonlyte
dietmoonlyte Commented 3달 전

For reference, here is my code. The moon phase is showing up correctly, the zodiac sign will not show up no matter what:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Moon Phase and Zodiac Sign</title>

    <style>
        #zodiac-sign, #moon-phase {
            background-color: #000;
            color: #fff;
            border-radius: 5px;
            padding: 20px;
            margin: 10px 0;
            display: inline-block;
            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
        }

        #zodiac-sign span, #moon-phase span {
            font-size: 1.2em;
            font-weight: bold;
        }
    </style>
</head>
<body>
    <p>Moon Phase: <span id="moon-phase">Loading...</span></p>
    <p>Zodiac Sign: <span id="zodiac-sign">Loading...</span></p>

    <script>
        document.addEventListener('DOMContentLoaded', function() {
            const url = 'https://moon-phase.p.rapidapi.com/advanced';
            const options = {
                method: 'GET',
                headers: {
                    'X-RapidAPI-Host': 'moon-phase.p.rapidapi.com'
                    'X-RapidAPI-Key': 'API_KEY_HERE'
                }
            };

            fetch(url, options)
                .then(response => response.json())
                .then(data => {
                    document.getElementById('moon-phase').innerHTML = '<span id="phase-text">' + data.moon.phase_name + '</span>';
                    document.getElementById('zodiac-sign').innerHTML = '<span id="zodiac-text">' + data.moon.zodiac_sign + '</span>';
                })
                .catch(error => console.error('Error:', error));
        });
    </script>
</body>
</html>

Join in the discussion - add comment below:

Login / Signup to post new comments