Stat Polygon

mjshi · 2017-06-23T01:11:56+0900

Stat Polygon v1.0 by mjshi- OK for use in all projects with credit Get it here! A fancy radar chart for your stats! Commissioned by the wonderful Lonewulf123 of these very forums.Features - Customize which and how many stats to show! - Supports icon labels! - Change the colors as you like-- just be sure to use hex color codes! - Compatible with Yanfly Status Menu Core-- read help for more info Screenshots Spoiler Version History 1.0 plugin released Credit mjshi

● ARCHIVED · READ-ONLY

Started by mjshi Jun 22, 2017, 04:11 PM 51 posts Page 3 of 3 View original ↗

Hilly

#41 Apr 19, 2020, 05:55 AM Source

mjshi said:
You'd just call it in a common event with a script command.
SceneManager.push(Scene_Status);
I mean to call the polygon only,without the face,level to next exp,equipment etc etc.

Edit: I am trying to make Persona traits status,which just show the polygon and actor image.
jdoggokussj2

#42 Apr 23, 2020, 04:49 PM Source

Is there anyway to get this to work with moghunters Monogatari plugin? I tried enabling both but your plugin never shows up

maliyana

#43 Aug 2, 2020, 05:57 AM Source

Is it possible to replace the bars in Yanfly's Status Core with the basic boxes in the general status section? I'd like to put the graph side by side with those so that it doesn't look too redundant. Here's a rough edit of what I want(perhaps without Lvl, hp and mp):

EDIT: I've figured it out. I modified the code at line 240 and changed it from:

Original Code

Code:

if (Imported.YEP_StatusMenuCore) {
Window_StatusInfo.prototype.drawParameters = function() {
    var dx = indent;
    var dy = this.lineHeight() / 2;
    var dw = this.contents.width - indent;
    var dh = this.lineHeight();
    var dw2;
    var text;
    this.changeTextColor(this.systemColor());
    this.drawText(Yanfly.Param.StatusGraphText, dx, dy, dw, 'center');
    dy = this.lineHeight();
    dx = indent;
    dw -= this.standardPadding() * 2;
    for (var i = 2; i < 8; ++i) {
        dy += this.lineHeight();
        var rate = this.drawParamGauge(dx, dy, dw, i);
        this.changeTextColor(this.systemColor());
        this.drawText(TextManager.param(i), dx + 4, dy, dw - 4);
        text = Yanfly.Util.toGroup(this._actor.param(i))
        this.changeTextColor(this.normalColor());
        dw2 = dw * rate;
        this.drawText(text, dx, dy, dw2 - 4, 'right');
    }

    this.contents.SPolyDrawStatPolygon(this._actor);

    //draw text
    if (useText) {
        this.changeTextColor(textColor);
        this.contents.fontSize = this.standardFontSize() - fontDecrement;
        for (var i = 0; i < stats.length; i++) {
            this.drawText(TextManager.param(stats[i]), centerX + textOffset.x + (radius + textOffset.radial) * Math.cos(Math.PI/2 + i * 2 * Math.PI / sides), centerY + textOffset.y - (radius + textOffset.radial) * Math.sin(Math.PI/2 + i * 2 * Math.PI / sides), 160);
        }
        this.resetFontSettings();
    }

    //draw icon
    if (useIcon) {
        for (var i = 0; i < stats.length; i++) {
            this.drawIcon(iconIndexes[i], centerX + iconOffset.x + (radius + iconOffset.radial) * Math.cos(Math.PI/2 + i * 2 * Math.PI / sides), centerY + iconOffset.y - (radius + iconOffset.radial) * Math.sin(Math.PI/2 + i * 2 * Math.PI / sides));
        }
    }
};
}

to this:

New Code

Code:

if (Imported.YEP_StatusMenuCore) {
Window_StatusInfo.prototype.drawParameters = function() {
    var dx = indent;
    var dy = this.lineHeight() / 2;
    var dw = this.contents.width - indent;
    var dh = this.lineHeight();
    var dw2;
    var text;
    var rect = new Rectangle();
    rect.width = (this.contents.width - this.standardPadding()) / 2;
    rect.y = this.lineHeight() * 2;
    rect.height = this.lineHeight();
    var dx = rect.x + this.textPadding();
    var dw = rect.width - this.textPadding() * 2;
    this.drawDarkRect(rect.x, rect.y, rect.width, rect.height);
    this.changeTextColor(this.systemColor());
    this.drawText(TextManager.level, dx, rect.y, dw, 'left');
    this.changeTextColor(this.normalColor());
    text = Yanfly.Util.toGroup(this._actor.level);
    this.drawText(text, dx, rect.y, dw, 'right');
    this.drawText(Yanfly.Param.StatusParamText, dx + 9, dy, dw, 'center');
    for (var i = 0; i < 8; ++i) {
      if (i < 2) {
        rect.y += this.lineHeight();
      } else if (i === 2) {
        rect.y += this.lineHeight();
        rect.width /= 2;
        dw = rect.width - this.textPadding() * 2;
      } else if (i % 2 === 0) {
        rect.x = 0;
        dx = rect.x + this.textPadding();
        rect.y += this.lineHeight();
      } else {
        rect.x += rect.width;
        dx += rect.width;
      }
      this.drawDarkRect(rect.x, rect.y, rect.width, rect.height);
      this.changeTextColor(this.systemColor());
          this.drawText(TextManager.param(i), dx, rect.y, dw, 'left');
          this.changeTextColor(this.normalColor());
          text = Yanfly.Util.toGroup(this._actor.param(i));
          this.drawText(text, dx, rect.y, dw, 'right');
    }

    this.contents.SPolyDrawStatPolygon(this._actor);

    //draw text
    if (useText) {
        this.changeTextColor(textColor);
        this.contents.fontSize = this.standardFontSize() - fontDecrement;
        for (var i = 0; i < stats.length; i++) {
            this.drawText(TextManager.param(stats[i]), centerX + textOffset.x + (radius + textOffset.radial) * Math.cos(Math.PI/2 + i * 2 * Math.PI / sides), centerY + textOffset.y - (radius + textOffset.radial) * Math.sin(Math.PI/2 + i * 2 * Math.PI / sides), 160);
        }
        this.resetFontSettings();
    }

    //draw icon
    if (useIcon) {
        for (var i = 0; i < stats.length; i++) {
            this.drawIcon(iconIndexes[i], centerX + iconOffset.x + (radius + iconOffset.radial) * Math.cos(Math.PI/2 + i * 2 * Math.PI / sides), centerY + iconOffset.y - (radius + iconOffset.radial) * Math.sin(Math.PI/2 + i * 2 * Math.PI / sides));
        }
    }
};
}

Basically, I took the code from Yanfly's Status Core that places this table in the General tab and replaced the bar graph.

NateThe8

#44 Apr 21, 2021, 05:18 PM Source

So i know I'm an idiot for asking but its been awhile since I have done intermediate javascript: how do u replace the stats with custom stats or variables? I want to use this polygon but with my own custom stats or at the least some variable switches I have. sorry for being dumb and thx if this gets a response.

EDIT: I found a solution that just uses the $gameVariables.value() and replaced the text with an array (if u do this just make sure to not replace all of it as some of the code rewrites the actual stats) however now I want to know if there is a way to only make it appear on a single actors status page (main actor obviously)

EDIT2: I have tried "if (this._actor.actorId() == $gameActors.actor(1).actorId())" but it just removed it from all actors including the one I want it on
mjshi

#45 Apr 25, 2021, 01:55 AM Source

NateThe8 said:
So i know I'm an idiot for asking but its been awhile since I have done intermediate javascript: how do u replace the stats with custom stats or variables? I want to use this polygon but with my own custom stats or at the least some variable switches I have. sorry for being dumb and thx if this gets a response.

EDIT: I found a solution that just uses the $gameVariables.value() and replaced the text with an array (if u do this just make sure to not replace all of it as some of the code rewrites the actual stats) however now I want to know if there is a way to only make it appear on a single actors status page (main actor obviously)

EDIT2: I have tried "if (this._actor.actorId() == $gameActors.actor(1).actorId())" but it just removed it from all actors including the one I want it on

In response to your last edit, try:
if (this._actor.actorId() == ACTOR_ID)
and replace ACTOR_ID with the ID of the actor you want it to display on.
crow28

#46 Apr 27, 2021, 08:30 AM Source

Hello. I can't download it. Can I upload it somewhere else?
mjshi

#47 May 11, 2021, 12:12 AM Source

crow28 said:
Hello. I can't download it. Can I upload it somewhere else?

You need to click "Raw" (which leads you to here: https://raw.githubusercontent.com/mjshi/RPGMakerRepo/master/StatPolygon.js) then right click and click "save as". Sorry it's a little confusing (github can be sometimes :kaoswt2: )

Zakarijazh

#48 May 22, 2021, 11:57 AM Source

maliyana said:

Original Code

Code:

if (Imported.YEP_StatusMenuCore) {
Window_StatusInfo.prototype.drawParameters = function() {
    var dx = indent;
    var dy = this.lineHeight() / 2;
    var dw = this.contents.width - indent;
    var dh = this.lineHeight();
    var dw2;
    var text;
    this.changeTextColor(this.systemColor());
    this.drawText(Yanfly.Param.StatusGraphText, dx, dy, dw, 'center');
    dy = this.lineHeight();
    dx = indent;
    dw -= this.standardPadding() * 2;
    for (var i = 2; i < 8; ++i) {
        dy += this.lineHeight();
        var rate = this.drawParamGauge(dx, dy, dw, i);
        this.changeTextColor(this.systemColor());
        this.drawText(TextManager.param(i), dx + 4, dy, dw - 4);
        text = Yanfly.Util.toGroup(this._actor.param(i))
        this.changeTextColor(this.normalColor());
        dw2 = dw * rate;
        this.drawText(text, dx, dy, dw2 - 4, 'right');
    }

    this.contents.SPolyDrawStatPolygon(this._actor);

    //draw text
    if (useText) {
        this.changeTextColor(textColor);
        this.contents.fontSize = this.standardFontSize() - fontDecrement;
        for (var i = 0; i < stats.length; i++) {
            this.drawText(TextManager.param(stats[i]), centerX + textOffset.x + (radius + textOffset.radial) * Math.cos(Math.PI/2 + i * 2 * Math.PI / sides), centerY + textOffset.y - (radius + textOffset.radial) * Math.sin(Math.PI/2 + i * 2 * Math.PI / sides), 160);
        }
        this.resetFontSettings();
    }

    //draw icon
    if (useIcon) {
        for (var i = 0; i < stats.length; i++) {
            this.drawIcon(iconIndexes[i], centerX + iconOffset.x + (radius + iconOffset.radial) * Math.cos(Math.PI/2 + i * 2 * Math.PI / sides), centerY + iconOffset.y - (radius + iconOffset.radial) * Math.sin(Math.PI/2 + i * 2 * Math.PI / sides));
        }
    }
};
}

to this:

New Code

Code:

if (Imported.YEP_StatusMenuCore) {
Window_StatusInfo.prototype.drawParameters = function() {
    var dx = indent;
    var dy = this.lineHeight() / 2;
    var dw = this.contents.width - indent;
    var dh = this.lineHeight();
    var dw2;
    var text;
    var rect = new Rectangle();
    rect.width = (this.contents.width - this.standardPadding()) / 2;
    rect.y = this.lineHeight() * 2;
    rect.height = this.lineHeight();
    var dx = rect.x + this.textPadding();
    var dw = rect.width - this.textPadding() * 2;
    this.drawDarkRect(rect.x, rect.y, rect.width, rect.height);
    this.changeTextColor(this.systemColor());
    this.drawText(TextManager.level, dx, rect.y, dw, 'left');
    this.changeTextColor(this.normalColor());
    text = Yanfly.Util.toGroup(this._actor.level);
    this.drawText(text, dx, rect.y, dw, 'right');
    this.drawText(Yanfly.Param.StatusParamText, dx + 9, dy, dw, 'center');
    for (var i = 0; i < 8; ++i) {
      if (i < 2) {
        rect.y += this.lineHeight();
      } else if (i === 2) {
        rect.y += this.lineHeight();
        rect.width /= 2;
        dw = rect.width - this.textPadding() * 2;
      } else if (i % 2 === 0) {
        rect.x = 0;
        dx = rect.x + this.textPadding();
        rect.y += this.lineHeight();
      } else {
        rect.x += rect.width;
        dx += rect.width;
      }
      this.drawDarkRect(rect.x, rect.y, rect.width, rect.height);
      this.changeTextColor(this.systemColor());
          this.drawText(TextManager.param(i), dx, rect.y, dw, 'left');
          this.changeTextColor(this.normalColor());
          text = Yanfly.Util.toGroup(this._actor.param(i));
          this.drawText(text, dx, rect.y, dw, 'right');
    }

    this.contents.SPolyDrawStatPolygon(this._actor);

    //draw text
    if (useText) {
        this.changeTextColor(textColor);
        this.contents.fontSize = this.standardFontSize() - fontDecrement;
        for (var i = 0; i < stats.length; i++) {
            this.drawText(TextManager.param(stats[i]), centerX + textOffset.x + (radius + textOffset.radial) * Math.cos(Math.PI/2 + i * 2 * Math.PI / sides), centerY + textOffset.y - (radius + textOffset.radial) * Math.sin(Math.PI/2 + i * 2 * Math.PI / sides), 160);
        }
        this.resetFontSettings();
    }

    //draw icon
    if (useIcon) {
        for (var i = 0; i < stats.length; i++) {
            this.drawIcon(iconIndexes[i], centerX + iconOffset.x + (radius + iconOffset.radial) * Math.cos(Math.PI/2 + i * 2 * Math.PI / sides), centerY + iconOffset.y - (radius + iconOffset.radial) * Math.sin(Math.PI/2 + i * 2 * Math.PI / sides));
        }
    }
};
}

Basically, I took the code from Yanfly's Status Core that places this table in the General tab and replaced the bar graph.
View attachment 153803

I tried this and got it to work but how did you get the graph to line up perfectly side-by-side?

No matter what I do, the graph always starts at the bottom of the text section, even when adjusting the X/Y values...

maliyana

#49 Jun 12, 2021, 05:50 PM Source

Zakarijah said:
I tried this and got it to work but how did you get the graph to line up perfectly side-by-side?

No matter what I do, the graph always starts at the bottom of the text section, even when adjusting the X/Y values...
Can you post a screenshot?
Zakarijazh

#50 Jun 13, 2021, 10:25 AM Source

maliyana said:
Can you post a screenshot?
I actually figured it out last week. I thought I had to do its placement from my screen resolution or something but yea... I got it :)
ThreeSixNine

#51 Jul 21, 2021, 06:29 PM Source
@mjshi I just wanted to say thanks for this plugin! I'm a big fan of visual information and this supplements Yanfly's stat graph perfectly!

Setup

So I am trying to figure out how to implement the setup referenced in this message:

@Harken_W No problem! Also, if you want to make that polygon anywhere else but also have the icons/text etc just copy/paste the relevant portions later on labelled "//draw icon" and "//draw text", respectively.
I have tried pasting and copying the code in a few different locations but I have not been able to see the icons. I successfully added the stat polygon to Mr. Trivel's Party Manager Scene, but I'm not sure where to add the code to show the icons in the scene.

-EDIT-
I figured it out. I simply had to redefine all the variables being used in the drawIcon function. I did this by first importing the draw Icon function into the Party Manager plugin. Next, I imported all the variables set to the plugin parameters at the top of the StatPolygon plugin. Visual Studio Code showed me which variables were being used and which were not, so it was easy to figure out which ones needed to be redefined.

I actually left most of them as they were but changed them to something like this:
JavaScript:
var stats = PluginManager.parameters("StatPolygon")["Stats to Draw"].split(", ").map(Number);
to reference the parameter set in the StatPolygon plugin.

Lastly, it was just a matter of changing the Center X and Center Y variables to match the polygon.