john pfeiffer
  • Home
  • Categories
  • Tags
  • Archives

javascript chart 2010 06 15

<html>
<body>
<script type="text/javascript">

var salesweek = 22 ;    //this is the week just finished
//BUDGETED SALES
var budgetJanuary = 781720;
var budgetFebruary = 620161 ;
var budgetMarch = 576862 ;
var budgetApril = 699149 ;
//was 680000 but changed sometime in May

var budgetMay = 656000 ;

var budgetJune = 125000 ;
var budgetJuly = 0 ;
var budgetAugust = 0 ;
var budgetSeptember = 0 ;
var budgetOctober = 0 ;
var budgetNovember = 0 ;
var budgetDecember = 0 ;

// ACTUAL SALES
var salesJanuary =  781720;
var salesFebruary = 620161 ;
var salesMarch = 576862 ;
var salesApril = 699149 ;

var salesMay = 710237 ;
var salesJune = 102740 ;
var salesJuly = 0 ;
var salesAugust = 0 ;
var salesSeptember = 0 ;
var salesOctober = 0 ;
var salesNovember = 0 ;
var salesDecember = 0 ;


//var total = 8000000;      //this represents the year's target
//var total = 8316743;      //updated after Q1 to be higher
var total = 8502892             //updated in May to be higher

//budget for each month
var budget =
+ budgetJanuary
+ budgetFebruary
+ budgetMarch
+ budgetApril
+ budgetMay
+ budgetJune
+ budgetJuly
+ budgetAugust
+ budgetSeptember
+ budgetOctober
+ budgetNovember
+ budgetDecember;

//each month's sales
var current =
+ salesJanuary
+ salesFebruary
+ salesMarch
+ salesApril
+ salesMay
+ salesJune
+ salesJuly
+ salesAugust
+ salesSeptember
+ salesOctober
+ salesNovember
+ salesDecember;

var chartmax = 50;  //this is how large we want our chart (a scale if you will)

var currentPercent = current / total;
var budgetPercent = budget / total;

// One minus the percent achieved equals the percent still left to accomplish
// Multiplied by the chartmax so that it is a whole number of blocks on the chart
var currentBreakPoint = ((1 - currentPercent ) * chartmax);
var budgetBreakPoint = ((1 - budgetPercent ) * chartmax);




function Comma(number)
{

    number = '' + number;
    if (number.length > 3)
    {
        var mod = number.length % 3;
        var output = (mod > 0 ? (number.substring(0,mod)) : '');

        for (i=0 ; i < Math.floor(number.length / 3); i++)
        {
            if ((mod == 0) && (i == 0))
            {   output += number.substring(mod+ 3 * i, mod + 3 * i + 3);    }
            else
            {       output+= ',' + number.substring(mod + 3 * i, mod + 3 * i + 3);  }
        }
        return (output);
    }
    else{    return number;     }
}

document.write( "GOAL: Pounds" + Comma( total ) );
document.write('<table border="0"><tr>');   //formatting table for 2 columns
    document.write('<td align="center">');

        document.write('<table border="0">');   //table of % achieved
        for( i=1; i< chartmax; i++)
        {
            document.write("<tr>");

            if( i > currentBreakPoint )
            {
                document.write('<td bgcolor="#ff0000">');
            }
            else{
                document.write('<td bgcolor="#00ffff">');
            }

            document.write("</td></tr>");
        }
        document.write("</table>");

document.write('<font size="1">Sales Week ' + salesweek + ' = <b>Pounds' + Comma(current) + '</b> </font>');
    document.write("</td>");
    document.write('<td align="center">');

        document.write('<table border="0">');   //table of % achieved
        for( i=1; i< chartmax; i++)
        {
            document.write("<tr>");

            if( i > budgetBreakPoint )
            {
                document.write('<td bgcolor="#ff0000">');
            }
            else{
                document.write('<td bgcolor="#00ffff">');
            }

            document.write("</td></tr>");
        }
        document.write("</table>");
document.write('<i><font size="1">(BUDGETED = </i><b>Pounds' + Comma(budget) + '</b>)</font>');


    document.write("</td>");
document.write("</tr>");
document.write("</table>");


//document.write("<br />");
//document.write('</td></tr></table>');

</script>
</body>
</html>

  • « javascript chart 2010 06 14 graphics
  • javascript chart two column »

Published

May 29, 2016

Category

javascript

~354 words

Tags

  • chart 4
  • javascript 43