javascript chart 2010 06 14 graphics

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

var salesweek = 23 ;    //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 to match actual sales?!?!
var budgetMay = 656000 ;

var budgetJune = 250000;

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 = 182324 ;
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
var total = 8340129             //updated in June to be lower

//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;


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('<table border="1"><tr>');
// *********************** formatting table for 2 columns *********************************
    document.write('<td align="center">');
    document.write( "GOAL: Pounds" + Comma( total ) );

        document.write('<table border="0">');   //table of % achieved


        var currentBreakPoint = parseInt( currentPercent * chartmax );

        // TO GO
        for( i = currentBreakPoint + 1 ; i <= chartmax; i++)
        {
            document.write("<tr><td>");
            //document.write( i );
            document.write('<img width="30px" height="8px" src="http://anders-wss/AndersPortal/Company%20Picture%20Galery/pound-small.png">');
            document.write("</td></tr>");
        }

        // ACHIEVED
        for( i = 1 ; i <= currentBreakPoint; i++)
        {
            document.write("<tr><td>");
            document.write('<img width="40px" height="8px" src="http://anders-wss/AndersPortal/Company%20Picture%20Galery/pound-g.png">');
            document.write("</td></tr>");
        }
        document.write("</table>");

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

// *********************** formatting table second  column *********************************

    document.write('<td align="center">');

document.write( "&nbsp; &nbsp; <i> difference: Pounds" + Comma( current - budget ) ) + "</i>";

        document.write('<table border="0">');   //table of % achieved

        var budgetBreakPoint = parseInt( budgetPercent * chartmax );

        // budgeted
        for( i= budgetBreakPoint + 1 ; i <= chartmax; i++)
        {
            document.write("<tr><td>");
            //document.write( i );
            document.write('<img width="30px" height="8px" src="pound-1.png">');
            document.write("</td></tr>");
        }

        // SPENT
        for( i = 1 ; i <= budgetBreakPoint ; i++)
        {
            document.write("<tr><td>");
                        document.write('<img width="40px" height="8px" src="http://anders-wss/AndersPortal/Company%20Picture%20Galery/pound-r.png">');

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


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


</script>
</body>
</html>
javascript chart 2010 06 14 graphics

Published

Category

~379 words

Tags
