simple underscore.js projects, walk through, & tutorial


Lottery DataBase Analysis - 04 (HTML Table to JSON)

So, let's start from scratch.
This is the game data as pulled directly from: http://www.calottery.com/Play/Scratchers-games/$5-Scratchers/california-lucky-for-life-832
on: 11-6-13
for: California Lucky for Life (832)


Prizes Odds 1 in Total # of Winners Prizes Claimed Prizes Available
$3,250,000 2,400,000 17 11 6
$5,000 1,200,000 34 22 12
$1,000 400,000 102 65 37
$500 12,000 3,400 2,239 1,161
$100 645 63,240 41,624 21,616
$40 350 116,620 76,812 39,808
$20 53 765,000 498,167 266,833
$15 40 1,020,000 668,467 351,533
$10 20 2,040,000 1,325,571 714,429
$5 11 3,570,000 2,287,131 1,282,869
Ticket 10 4,080,000 2,524,475 1,555,525

I've also added two more JavaScript Libraries
<script type="text/javascript" src="underscore.js"></script>
<script type="text/javascript" src="jquery-1.9_1.js"></script>
<script type="text/javascript" src="jquery.tabletojson.js"></script>

Assigned the imported table an id="gameData"

And wrapped the operative calls in an onLoadFunction():

function onLoadFunction(){
    var game832Data = $('#gameData').tableToJSON();
    document.getElementById('outputOne').innerHTML = JSON.stringify(game832Data);
}

JSON.stringify(game832Data) Yields:
1 Nada Yet

The above being a JSON object that contains all the Lottery Game #832 Data in a variable handily called:
var game832Data;

The reason this is so nice from my standpoint is that I can open this webpage in a editor (like KompoZer) and drop in any data from any California Scratchers Lottery Game I want.  So whatever I do for this example will port quickly and easily to any California Lottery Scratchers Game.



Anyway, so we have our data source, so let's use it.

    // Pluck Prize Array
    var outputTwo = _.pluck(game832Data, "Prizes");
    document.getElementById('outputTwo').innerHTML = outputTwo;

Yields an Array of the Prize Values:
2 Nada Yet



This is the same as the above (an array of Prize values) only prettier (with spaces in between so values wrap).

    // Prettify Prize Array
    var outputThree = _.map(outputTwo, function(n){return ' ' + n;});
    document.getElementById('outputThree').innerHTML = outputThree;

Yields an Array of the Prize Values:
3 Nada Yet



The following one line code is confusing code to me.  I'd hate to have to debug it.  But some folks like this.  Looks all neat, compact, and elegant to them, I suppose.

    // Odds 1 in, one line command
    document.getElementById('outputFour').innerHTML = _.map(_.pluck(game832Data, "Odds 1 in"), function(n){return ' ' + n;});

As per "Value Passed", this outputs an "Odds 1 in" array all prettified.
4 Nada Yet



But the previous was too much for me.  I'd rather code in shorter easier read lines.

    // Total # of Winners, MultiLine
    var outputFive = _.pluck(game832Data, "Total # of Winners");
    outputFive = _.map(outputFive, function(n){return ' ' + n;});
    document.getElementById('outputFive').innerHTML = outputFive;

Longer, but easier to read IMO as each line of code serves a different function.  And if there's an error, we're more likely to be able to pinpoint the culprit.

Yields an array containing the "Total # of Winners":
5 Nada Yet


Next up, doing something with the values.
Let's see if we can obtain the back of ticket odds using _.underline functions instead of using for loops.



_.moreUnderscoreProjects

© Copyright 2013 Brett Paufler



Please Note: I am an idiot.  No seriously.  The odds of my gambling odds calculations being correct are likely on par with my odds of ever winning.  You have been warned.