ｖ４ - 経済統計練習帳

<!DOCTYPE html>
<html lang="ja">
    <head>
        <meta charset="utf-8" />
        <script src="sample.js"></script>
        <script src="jquery.js"></script>
        <script src="svgpaint.js"></script>
        <script src="https://www.google.com/jsapi"></script>
        <title>信長の野望</title>
    </head>
    <body onload="sample()">
        <p id="memo"></p>
    <select name='a'>
    <option value='c1'>c1</option>
<option value='c2'>c2</option>
<option value='c3'>c3</option>
<option value='c4'>c4</option>
<option value='c5'>c5</option>
<option value='c6'>c6</option>
<option value='c7'>c7</option>
<option value='c8'>c8</option>
<option value='c9'>c9</option>
<option value='c10'>c10</option>
<option value='c11'>c11</option>
<option value='c12'>c12</option>
<option value='c13'>c13</option>
<option value='c14'>c14</option>
<option value='c15'>c15</option>
<option value='c16'>c16</option>
<option value='c17'>c17</option>
<option value='c18'>c18</option>
<option value='c19'>c19</option>
<option value='c20'>c20</option>
<option value='c21'>c21</option>
<option value='c22'>c22</option>
<option value='c23'>c23</option>
<option value='c24'>c24</option>
<option value='c25'>c25</option>
<option value='c26'>c26</option>
<option value='c27'>c27</option>
<option value='c28'>c28</option>
<option value='c29'>c29</option>
<option value='c30'>c30</option>
<option value='c31'>c31</option>
<option value='c32'>c32</option>
<option value='c33'>c33</option>
<option value='c34'>c34</option>
<option value='c35'>c35</option>
<option value='c36'>c36</option>
<option value='c37'>c37</option>
<option value='c38'>c38</option>
<option value='c39'>c39</option>
<option value='c40'>c40</option>
<option value='c41'>c41</option>
<option value='c42'>c42</option>
<option value='c43'>c43</option>
<option value='c44'>c44</option>
</select>
 <select name='b'>
    <option value='c1'>c1</option>
<option value='c2'>c2</option>
<option value='c3'>c3</option>
<option value='c4'>c4</option>
<option value='c5'>c5</option>
<option value='c6'>c6</option>
<option value='c7'>c7</option>
<option value='c8'>c8</option>
<option value='c9'>c9</option>
<option value='c10'>c10</option>
<option value='c11'>c11</option>
<option value='c12'>c12</option>
<option value='c13'>c13</option>
<option value='c14'>c14</option>
<option value='c15'>c15</option>
<option value='c16'>c16</option>
<option value='c17'>c17</option>
<option value='c18'>c18</option>
<option value='c19'>c19</option>
<option value='c20'>c20</option>
<option value='c21'>c21</option>
<option value='c22'>c22</option>
<option value='c23'>c23</option>
<option value='c24'>c24</option>
<option value='c25'>c25</option>
<option value='c26'>c26</option>
<option value='c27'>c27</option>
<option value='c28'>c28</option>
<option value='c29'>c29</option>
<option value='c30'>c30</option>
<option value='c31'>c31</option>
<option value='c32'>c32</option>
<option value='c33'>c33</option>
<option value='c34'>c34</option>
<option value='c35'>c35</option>
<option value='c36'>c36</option>
<option value='c37'>c37</option>
<option value='c38'>c38</option>
<option value='c39'>c39</option>
<option value='c40'>c40</option>
<option value='c41'>c41</option>
<option value='c42'>c42</option>
<option value='c43'>c43</option>
<option value='c44'>c44</option>
</select>
    </body>
</html>
 
 
var code = new Array();
var year = new Array();
var point = new Array();
var month = new Array();
var v = new Array();
var credit = new Array();
var cc1, cc2; 
 
function sample() {
 
    cc1 = "c1";
    cc2 = "c1";
 
    $('[name=a]').change(function () {
        var val = $('[name=a]').val();
 
        cc1 = val;
 
        f();
 
    });
 
 $('[name=b]').change(function () {
        var val2 = $('[name=b]').val();
 
        cc2 = val2;
 
        f();
 
    });
 
 
}
 
function f(){
 
 
 var query = "SELECT * FROM " +
            '1j3Npa_Tq911-p87Pz04WDoBJenyPzeamV66LtbKB';
 query = query + " where index='" + cc1 + "' and credit='" + cc2 + "'";
 
        var encodedQuery = encodeURIComponent(query);
 
        var url = ['https://www.googleapis.com/fusiontables/v1/query'];
        url.push('?sql=' + encodedQuery);
        url.push('&key=AIzaSyAH0WCAXRIdHdbI-6bnMSN4kVDDZZmGyqY');
        url.push('&callback=?');
 
 
 
        $.ajax({
            url: url.join(''),
            dataType: 'jsonp',
            success: function (data) {
                var rows = data['rows'];
 
                sx = 0;
 
                for (var i in rows) {
                    var x1 = rows[i][0];
                    var x2 = rows[i][1];
                    var x3 = rows[i][2];
                    var x4 = rows[i][3];
                    sx = sx + 1;
                    year[sx] = x1;
                    point[sx] = x4;
                }
 
                number = sx;
 
 
                paint();
 
 
            }
        });
 
 
}
 
 
function paint(){
 
str="<table  border=\"1\">";
for(s=1;s<number+1;s++){
str=str+"<tr>";
str=str+"<td>";
str=str+year[s];
str=str+"</td>";
str=str+"<td>";
str=str+point[s];
str=str+"</td>";
str=str+"</tr>";
}
str=str+"</table>";
 
 
$("#memo").html(str);
 
 
 
 
    }