問題描述

所以這是一個 2 個問題，但基本上我正在為我的 Discord 機器人 (Discord.js) 制作排名/等級系統，并且我在下一個級別的進度條上遇到問題.到目前為止，這是我所得到的:

So this is kind of 2 questions in one, but basically I'm making a ranking/leveling system for my Discord bot (Discord.js) and I'm having problems with a progress bar for the next level. Here's what I've got so far:

        const x = "□";
        let progressBarArr = [x,x,x,x,x,x,x,x,x,x,x,x,x,x,x,x,x,x,x,x,x,x,x,x,x,x,x,x,x,x,x,x,x,x,x];

        let currentLevel = Math.ceil(result.allocatedExp/1000)*1000;
        if (currentLevel < 1000) currentLevel = 1000;

        let progressBar = "["+progressBarArr.fill("=", Math.ceil(result.allocatedExp/currentLevel)*35).join('')+"]"

每增加 1,000 XP，您就會升級，因此假設用戶的 XP 為 1234，他們將達到 1 級，并且達到 2 級的 23%.我只需要在進度條類型樣式.我現在擁有的代碼有效，但前提是他們的 XP 低于 1k，否則欄總是滿的.

Every 1,000 XP You gain you level up, So say the XP for a user is 1234 they would be level 1 and 23% of the way to level 2. I just need to show that in a progress-bar type style. The code I have right now works but only if they have under 1k XP, otherwise the bar is always full.

我的另一個問題對大多數人來說很可能是微不足道的，但我被它難住了，假設用戶有 15k xp，我如何從 15000 中得到 15 來表示他們是 15 級?

The other question I have is most likely trivial for most people but I'm stumped by it, say a user has 15k xp, how would I get the 15 from 15000 to say that they're level 15?

謝謝！

推薦答案

只需使用Math.floor(xp/1000)即可獲取玩家當前等級.

Just take Math.floor(xp / 1000) to get the player's current level.

對于進度條，使用模 1000 來檢查玩家在最后 1000 和下 1000 之間的距離，然后將結果乘以 35 來計算要顯示多少 =:

For the progress bar, use modulo 1000 to check how far the player is between the last 1000 and the next 1000, and multiply the result by 35 to figure out how many =s to display:

const showBar = xp => {
  const currentLevel = Math.floor(xp / 1000);
  const progress = (xp % 1000) / 1000;
  const progressOutOf35 = Math.round(progress * 35);
  
  const x = "□";
  const barStr = `[${'='.repeat(progressOutOf35)}${'□'.repeat(35 - progressOutOf35)}]`;
  console.log(barStr + ', currntly at level ' + currentLevel);
};

showBar(1500);
showBar(3900);
showBar(15000);

這篇關于調平系統進度條的文章就介紹到這了，希望我們推薦的答案對大家有所幫助，也希望大家多多支持html5模板網！