Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

All comments

  • PhoenixDev22 16,950

    @PhoenixDev22

    Submitted

    Hello community, This is my solution for this frontend challenge. I've learnt a lot making for sure. Any suggestions how to optimize the JavaScript(Using less code), please feel free and leave a feedback. Thanks in advance

    @MohammedDuke

    Posted

    great work your solution better alot than my i've learnt alot form you code like how you to center component . i don't know if my js code can help you

    
    let chart = document.querySelectorAll("li.chart");
    let amount = document.querySelectorAll(".amount");
    
    // GET Data From json file and add to HTML File
    function chartsRepo() {
      fetch("./data.json")
        .then((response) => {
          return response.json();
        })
        .then((data) => {
          for (var i = 0; i < data.length; i++) {
            chart[i].style.height = data[i].amount + "%";
            amount[i].style.bottom = data[i].amount + 1 + "%";
            amount[i].innerHTML = "$" + data[i].amount;
          }
        });
    }
    chartsRepo();
    
    // Add Active & Remove
    chart.forEach((el) => {
      el.addEventListener("click", () => {
        chart.forEach((ele) => ele.classList.remove("active"));
        el.classList.add("active");
      });
    });
    

    hope good day for you

    Marked as helpful

    0