rveitch
4/25/2016 - 4:39 PM

Pull in a live-updating data feed with Google Spreadsheets, dump content from specified cells to a web page.

Pull in a live-updating data feed with Google Spreadsheets, dump content from specified cells to a web page.

<!DOCTYPE html>
<html lang="en">
    <head>
    <title>Live election parser using Google Spreadsheets</title>
    
    <!-- Adapted from a Michelle Minkoff joint: http://michelleminkoff.com/2010/11/22/using-google-spreadsheets-as-your-database/ -->

    <link rel="stylesheet" type="text/css" href="http://dataomaha.com/media/base.css" />
    <link rel="stylesheet" type="text/css" href="http://dataomaha.com/media/super-styles.css">
    
    <script type='text/javascript'>       
    //<![CDATA[
        function displayContent(json) {
            var japp = (json.feed.entry[120].gsx$candidatename.$t).trim();
            var jappresults = (json.feed.entry[120].gsx$candidatepercentage.$t * 100).toFixed(2);
            var koenig = (json.feed.entry[121].gsx$candidatename.$t).trim();
            var koenigresults = (json.feed.entry[121].gsx$candidatepercentage.$t * 100).toFixed(2);
            var election = '<h2>' + japp + ': ' + jappresults + '&#37;' + '<br/>' + koenig + ': ' + koenigresults + '&#37;' + '</h2>' + '<div style="text-align:center;">' + '<img src="http://chart.googleapis.com/chart?chs=600x225&cht=p&chco=084594&chd=t:' + json.feed.entry[120].gsx$candidatepercentage.$t + ',' + json.feed.entry[121].gsx$candidatepercentage.$t + '&chl=' + japp + ' (' + json.feed.entry[120].gsx$candidatevotes.$t + ' votes)' + '|' + koenig + ' (' + json.feed.entry[121].gsx$candidatevotes.$t + ' votes)' + '" width="600" height="225" alt="' + japp + ': ' + jappresults + '&#37;  /  ' + koenig + ': ' + koenigresults + '&#37;" title="' + japp + ': ' + jappresults + '&#37;  /  ' + koenig + ': ' + koenigresults + '&#37;" />' + '</div>';
            document.getElementById('results').innerHTML = election 
        }
    //]]>
    </script>

    </head>

<body>

<div class="container">
<div id="results"></div>
</div>

<script src="http://spreadsheets.google.com/feeds/list/0Ag4MM37uq7FmdDlqUnRoekRtSFEyNDIwN2c0RjBTaGc/od6/public/values?alt=json-in-script&amp;callback=displayContent" type="text/javascript"></script>
 
</body>

</html>