调平系统的进度条 [英] Progress Bar for Leveling System

问题描述

所以这是一个包含两个问题的问题，但是基本上我正在为我的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中得到15kp来表示他们处于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);

这篇关于调平系统的进度条的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！