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.
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.