drawXpPieChart

Tracks and estimates hourly XP rate in Nitro Type races

이 스크립트는 직접 설치하는 용도가 아닙니다. 다른 스크립트에서 메타 지시문 // @require https://update.greasyfork.org/scripts/501962/1418071/drawXpPieChart.js을(를) 사용하여 포함하는 라이브러리입니다.

이 스크립트를 설치하려면 Tampermonkey, Greasemonkey 또는 Violentmonkey와 같은 확장 프로그램이 필요합니다.

이 스크립트를 설치하려면 Tampermonkey와 같은 확장 프로그램을 설치해야 합니다.

이 스크립트를 설치하려면 Tampermonkey 또는 Violentmonkey와 같은 확장 프로그램이 필요합니다.

이 스크립트를 설치하려면 Tampermonkey 또는 Userscripts와 같은 확장 프로그램이 필요합니다.

이 스크립트를 설치하려면 Tampermonkey와 같은 확장 프로그램이 필요합니다.

이 스크립트를 설치하려면 유저 스크립트 관리자 확장 프로그램이 필요합니다.

(이미 유저 스크립트 관리자가 설치되어 있습니다. 설치를 진행합니다!)

이 스타일을 설치하려면 Stylus와 같은 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 Stylus와 같은 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 Stylus와 같은 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 유저 스타일 관리자 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 유저 스타일 관리자 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 유저 스타일 관리자 확장 프로그램이 필요합니다.

(이미 유저 스타일 관리자가 설치되어 있습니다. 설치를 진행합니다!)

// ==UserScript==
// @name         drawXpPieChart
// @version      3.5
// @description  Tracks and estimates hourly XP rate in Nitro Type races
// @author       TensorFlow - Dvorak
// @match        *://*.nitrotype.com/race
// @match        *://*.nitrotype.com/race/*
// @license      MIT
// ==/UserScript==

function drawXpPieChart() {
  const canvas = document.getElementById('xpPieChart');
  const ctx = canvas.getContext('2d');

  const data = [
    { label: 'Placement', value: xpCategories.placement, cumulative: cumulativeXpCategories.placement, color: '#ff6384' },
    { label: 'Accuracy', value: xpCategories.accuracy, cumulative: cumulativeXpCategories.accuracy, color: '#36a2eb' },
    { label: 'Wampus', value: xpCategories.wampus, cumulative: cumulativeXpCategories.wampus, color: '#cc65fe' },
    { label: 'Friends', value: xpCategories.friends, cumulative: cumulativeXpCategories.friends, color: '#4caf50' },
    { label: 'Gold Bonus', value: xpCategories.goldBonus, cumulative: cumulativeXpCategories.goldBonus, color: '#ffeb3b' },
    { label: 'Speed', value: xpCategories.speed, cumulative: cumulativeXpCategories.speed, color: '#f44336' },
    { label: 'Other', value: xpCategories.other, cumulative: cumulativeXpCategories.other, color: '#ffce56' }
  ].filter(category => category.value > 0); // Filter out categories with value 0

  const total = data.reduce((acc, category) => acc + category.value, 0);

  ctx.clearRect(0, 0, canvas.width, canvas.height);

  let startAngle = 0;
  data.forEach(category => {
    const sliceAngle = (category.value / total) * 2 * Math.PI;
    ctx.beginPath();
    ctx.moveTo(150, 150); // Adjusted for smaller canvas
    ctx.arc(150, 150, 150, startAngle, startAngle + sliceAngle); // Adjusted for smaller canvas
    ctx.closePath();
    ctx.fillStyle = category.color;
    ctx.fill();

    // Draw labels centered within the slice and as far away from the center as possible
    const midAngle = startAngle + sliceAngle / 2;
    const labelX = 150 + (150 - 20) * Math.cos(midAngle); // Adjusted for smaller canvas
    const labelY = 150 + (150 - 20) * Math.sin(midAngle); // Adjusted for smaller canvas
    ctx.fillStyle = "#fff";
    ctx.textAlign = "center";
    ctx.font = "bold 12px Arial";
    ctx.fillText(`${category.label} (${formatNumber(category.cumulative)})`, labelX, labelY);

    startAngle += sliceAngle;
  });
}