Page 1 of 8 123 ... LastLast
Results 1 to 20 of 144
  1. #1
    Administrator 1ApRiL's Avatar
    Join Date
    2011-02-12
    Location
    Waiblingen, Germany
    Posts
    1,525
    BFBC2 PC
    1ApRiL
    NFS World
    1APRIL
    BF2
    1ApRiL
    BF3 PC
    1ApRiL

    BF4Stats.com Graphics coding

    If you would like to create your own graphics, you might watch this video which explains a lot.



    There is also a code documentation available: http://bf4stats.com/docs/DHFGRS_docs.txt

    How you create a progress bar


    How you create a function to get the best weapon



    If you have any questions, here is the right thread for it.
    Admin of bfhstats.com / bf4stats.com / bf3stats.com | Twitter

  2. #2

    Re: BF4Stats.com Graphics coding

    Hi, just a quick question on the rank images, or more so the names of smaller images?

    using this currently.

    filed.player.rank.imgLarge

    tried various guesses like imgMedium, img_tiny etc etc, just can't seem to get it right.

  3. #3
    Administrator 1ApRiL's Avatar
    Join Date
    2011-02-12
    Location
    Waiblingen, Germany
    Posts
    1,525
    BFBC2 PC
    1ApRiL
    NFS World
    1APRIL
    BF2
    1ApRiL
    BF3 PC
    1ApRiL

    Re: BF4Stats.com Graphics coding

    Click at the right side on available data. You will see that there is no other size than that. You can resize the rank image for your need with w and h properties of the image function.
    Btw. this red shadow around the rank number is a bug on that server with the png libarary. I will try to fix that later.
    Admin of bfhstats.com / bf4stats.com / bf3stats.com | Twitter

  4. #4
    Administrator HigH_HawK's Avatar
    Join Date
    2006-03-15
    Location
    UK / GER
    Posts
    1,381

    Re: BF4Stats.com Graphics coding

    Example of resizing the rank image:

    PHP Code:
    image({file:pd.player.rank.imgLargex:1y:20w:70h:70}); 
    In this case the image will be resized to 70x70 pixel

    x = horizontal line
    y = vertical line
    w = width of the image
    h = height of the image

  5. #5

    Re: BF4Stats.com Graphics coding

    Got it, thanks. :-)

  6. #6
    New User Webster88PL's Avatar
    Join Date
    2012-10-26
    Location
    Poland
    Posts
    3
    BFBC2 360
    DJDIDO88
    BF2
    DJDIDO88
    BF3 360
    DJDIDO88
    MOHW 360
    DJDIDO88

    Re: BF4Stats.com Graphics coding

    does not work for me progressbar

    drawProgressBar({x:220,y:70,w:85,h:20,bgColor:'CCC CCC',barColor:'ff0000'});

    //w,h,x,y bgColor,barColor,font,size,fontColor
    function drawProgressBar(opt) {
    var w=opt.w;
    opt.fill=opt.bgColor;
    rectangle(opt);

    opt.fill=opt.barColor;

    if(!pb.player || !pd.player.rank !pd.player.rank.next) return;

    opt.w=Math.round(pd.player.rank.next.relProg/100*opt.w);

    rectangle (opt);

    opt.color=opt.fontColor;
    opt.x=Math.round(w/2+opt.x);
    opt.y+=opt.h*0.8;
    opt.text=nf(pd.player.rank.next.relProg)+'%';
    text(opt);
    What am I doing wrong?

  7. #7
    Administrator 1ApRiL's Avatar
    Join Date
    2011-02-12
    Location
    Waiblingen, Germany
    Posts
    1,525
    BFBC2 PC
    1ApRiL
    NFS World
    1APRIL
    BF2
    1ApRiL
    BF3 PC
    1ApRiL

    Re: BF4Stats.com Graphics coding

    I think you forgot there something. This is the original function.

    Code:
    // w,h,x,y,bgColor,barColor,font,size,fontColor
    function drawProgressBar(opt) {
      var w=opt.w;
      
      opt.fill=opt.bgColor;
      rectangle(opt);
      
      opt.fill=opt.barColor;
      
      if(!pd.player || !pd.player.rank || !pd.player.rank.next) return;
      
      opt.w=Math.round(pd.player.rank.next.relProg/100*opt.w);
      rectangle(opt);
      
      opt.color=opt.fontColor;
      opt.x=Math.round(w/2+opt.x);
      opt.y+=opt.h*0.8;
      opt.text=nf(pd.player.rank.next.relProg)+'%';
      text(opt);
      
    }
    This is the sort weapons function:
    Code:
    function sortWeaponsBy(field) {
      if(!pd || !pd.weapons) return;
      
      pd.weapons.sort(function(a,b){
        var val_a,val_b;
        if(a && a.stat) val_a=a.stat[field];
        if(b && b.stat) val_b=b.stat[field];
        
        if(val_a<val_b) return 1;
        if(val_a>val_b) return -1;
        return 0;    
      });
      
    }
    Admin of bfhstats.com / bf4stats.com / bf3stats.com | Twitter

  8. #8
    New User Webster88PL's Avatar
    Join Date
    2012-10-26
    Location
    Poland
    Posts
    3
    BFBC2 360
    DJDIDO88
    BF2
    DJDIDO88
    BF3 360
    DJDIDO88
    MOHW 360
    DJDIDO88

    Re: BF4Stats.com Graphics coding

    its work, thank you

  9. #9
    Octopuss
    Gast

    Re: BF4Stats.com Graphics coding

    Is it possible to add country flags images functionality to the graphics?

  10. #10
    Administrator HigH_HawK's Avatar
    Join Date
    2006-03-15
    Location
    UK / GER
    Posts
    1,381

    Re: BF4Stats.com Graphics coding

    Unfortunately this is not possible because some people don't share enough information of their Battlelog account.

  11. #11
    Octopuss
    Gast

    Re: BF4Stats.com Graphics coding

    Oh, you're right. I somehow thought country was chosen automatically based on IP address or something, since I can't remember any BF3 profile without country information.

    edit: I figured out the graphics - probably in some dirty way, but it seems to work. I am not entirely sure how to center the % in progress bar though. It always sits on the top side.
    Last edited by Octopuss; 2013-11-14 at 22:31.

  12. #12
    Administrator HigH_HawK's Avatar
    Join Date
    2006-03-15
    Location
    UK / GER
    Posts
    1,381

    Re: BF4Stats.com Graphics coding

    Do you have an example of the graphic where we can see the percentage sitting at the wrong place? May be we can help you.

    //EDIT: Try to play around with the X/Y axis numbers.
    Last edited by HigH_HawK; 2013-11-15 at 11:05.

  13. #13
    New User Webster88PL's Avatar
    Join Date
    2012-10-26
    Location
    Poland
    Posts
    3
    BFBC2 360
    DJDIDO88
    BF2
    DJDIDO88
    BF3 360
    DJDIDO88
    MOHW 360
    DJDIDO88

    Re: BF4Stats.com Graphics coding

    im no angle this image:
    Code:
      image({file:pd.dogtags.advanced.img,x:495,y:135,w:85,h:45,angle:0});
      image({file:pd.dogtags.basic.img,x:435,y:135,w:85,h:45,angle:0});
    change angle=resize

  14. #14
    New User
    Join Date
    2011-11-20
    Posts
    15
    BFBC2 PC
    xConx
    BF2
    FreedomFighter2k5
    BF3 PC
    iCo77

    Re: BF4Stats.com Graphics coding

    Thank you 1ApRiL for he tutorials vids. Keep up the good work!

    One question, is there a way to assign a z-index value so that one element overlaps another?
    Last edited by ico77; 2013-11-15 at 14:09.


  15. #15
    Administrator HigH_HawK's Avatar
    Join Date
    2006-03-15
    Location
    UK / GER
    Posts
    1,381

    Re: BF4Stats.com Graphics coding

    I am not sure if there is a way of assigning a z-index. What are you trying to do?

  16. #16
    New User
    Join Date
    2011-11-20
    Posts
    15
    BFBC2 PC
    xConx
    BF2
    FreedomFighter2k5
    BF3 PC
    iCo77

    Re: BF4Stats.com Graphics coding

    I would like to show the Player name on top of the Rank Image.


    EDIT I think I got it. Whichever you put first in the code is going to show on bottom.
    Last edited by ico77; 2013-11-15 at 14:41.


  17. #17
    Octopuss
    Gast

    Re: BF4Stats.com Graphics coding

    In the shadowtext function I see this weird colour code: '000000-80'. I have no idea if it's hex math or something, but what the resulting code really is?

  18. #18
    Administrator 1ApRiL's Avatar
    Join Date
    2011-02-12
    Location
    Waiblingen, Germany
    Posts
    1,525
    BFBC2 PC
    1ApRiL
    NFS World
    1APRIL
    BF2
    1ApRiL
    BF3 PC
    1ApRiL

    Re: BF4Stats.com Graphics coding

    Quote Originally Posted by Octopuss View Post
    In the shadowtext function I see this weird colour code: '000000-80'. I have no idea if it's hex math or something, but what the resulting code really is?
    See: http://bf4stats.com/docs/DHFGRS_docs.txt
    Code:
    Color format
    ---------------------------------------------------------------------------
    A color is composed of 4 values. Red, Green, Blue and Alpha.
    Red, Green and Blue are numbers between 0 and 255.
    Alpha can be between 0 (full opacity) and 127 (full transparency).
    
    Following formats can be used:
    	RGB in HEX format: 'RRGGBB' eg: 'ff0000' for red
    	RGBA in HEX + number: 'RRGGBB-A' eg: 'ff0000-80' for a see through red
    	As single number eg: 0x50ff0000 for a see through red
    	As object with numbers eg: {r:255,g:0,b:0,a:80} for a see through red
    Admin of bfhstats.com / bf4stats.com / bf3stats.com | Twitter

  19. #19
    Octopuss
    Gast

    Re: BF4Stats.com Graphics coding

    How could I miss that?
    Thank you.

  20. #20

    Re: BF4Stats.com Graphics coding

    Is there a way to display Vehicle specific stats? i Got some idea's, but my coding skills are 0,0
    Can you help me out with the code of possible, or point me in the right way?

    | i5-3570K@4.2Ghz | HD7970 Ghz| Samsung C830 256gb SSD | 8Gb 1.6Ghz mem | Asus 278HE 144hz" |Astro A40 2013 |

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
P-STATS NETWORK FORUM LOGIN CREATE ACCOUNT