Fork: 0
haya4 / www-root
Browse code
ランキングテーブルの表示成功
gh-pages master
1 parent 6f1897b commit 4e21b7eee9197bc33d002b8c397199ede33bd242
@hayashi hayashi authored on 24 Sep 2017
Patch
Unified Split
Showing 3 changed files
View
100
■■■■■
 coverage/carto_fuel.html
<head>
<meta charset='utf-8'/>
<title>OpenStreetMap coverage (amenity=fuel)</title>
<link rel="stylesheet" href="../surveyor.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.4.2/react.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.4.2/react-dom.js"></script>
<script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
<script type="text/javascript">
<script>
window.addEventListener('DOMContentLoaded', function() {
var req = new XMLHttpRequest();
 
req.onreadystatechange = function() { // XMLHttpRequest オブジェクトの状態が変化した際に呼び出されるイベントハンドラ
if(req.readyState == 4 && req.status == 200){ // サーバーからのレスポンスが完了し、かつ、通信が正常に終了した場合
}
};
 
req.open("GET", fName, true);
req.send(null); // 実際にサーバーへリクエストを送信
$.getJSON("coverage.fuel.json", function(data) {
var count = 0 ;
$("#timestamp").append("<p>" + data.timestamp + "</p>") ;
$("#source").append("国土交通省国土政策局「" + data.sourcedata + "」をもとにhayashiが編集・加工したものです。") ;
$(data.coverage).each(function() {
$("#data_list").append("<tr id=\"data_id" + count + "\"></tr>") ;
$("#data_list #data_id" + count).append("<td class='code'>" + this.code + "</td>") ;
$("#data_list #data_id" + count).append("<td class='name'>" + this.name + "</td>") ;
$("#data_list #data_id" + count).append("<td class='denominator'>" + this.denominator + "</td>") ;
$("#data_list #data_id" + count).append("<td class='par'>" + this.par + "</td>") ;
count++ ;
})
})
});
 
function parseJSON(jsData) {
var data = eval("("+ jsData +")");
var resultdata = "[json.timestamp: "+ data.timestamp +"]";
return resultdata;
}
</script>
</script>
</head>
<body>
<div id="wrap">
<div class="header">
<H1>OpenStreetMap coverage (燃料給油所を指標にした網羅率)</H1>
<iframe width="100%" height="720" frameborder="0" src="https://hayashi.carto.com/builder/d570b7da-c40f-4ad4-afd5-ab99396b0863/embed" allowfullscreen webkitallowfullscreen mozallowfullscreen oallowfullscreen msallowfullscreen></iframe>
<a href="https://hayashi.carto.com/builder/d570b7da-c40f-4ad4-afd5-ab99396b0863/embed"><img src="../92px-CARTO-logo.svg.png"/></a><p>国土交通省国土政策局「国土数値情報（燃料給油所データ平成２７年版）」をもとにhayashiが編集・加工したものです。</p>
<a href="https://hayashi.carto.com/builder/d570b7da-c40f-4ad4-afd5-ab99396b0863/embed"><img src="../92px-CARTO-logo.svg.png"/></a>
<div id="source"></div>
<br/>
<hr/>
</div>
 
<div id="inner">
<div id="mainWrap">
</p>
</div>
 
<div id="sideWrap">
 
<div id="result"></div>
<script>
 
var tableComponent = React.createClass({
render: function() {
return React.DOM.table(
null,
React.DOM.tr(
null,
React.DOM.th(null,"code"),
React.DOM.th(null,"都道府県"),
React.DOM.th(null,"標本数"),
React.DOM.th(null,"カバー率(%)")
)
);
}
});
 
ReactDOM.render(
React.createElement(tableComponent),
document.getElementById('result')
);
</script>
<div id="timestamp"></div>
<table>
<thead>
<tr>
<th>code</th>
<th>都道府県</th>
<th>標本数</th>
<th>カバー率(%)</th>
</tr>
</thead>
<tbody id="data_list"></tbody>
</table>
</div>
<div class="clear"><hr /></div>
</div>
</div>
View
290
■■■■■
 coverage/coverage.fuel.json
{
"timestamp": "2017-09-23",
"timestamp": "2017-09-24",
"sourcedata": "国土数値情報　燃料給油所データ 平成２８年(2016)",
"coverage": [
{
"code": 0,
"name": "全国",
"denominator": 53016,
"par": 25.46,
},
{
"par": 25.46
}
, {
"code": 1,
"name": "北海道",
"denominator": 3286,
"par": 33.20,
},
{
"par": 33.20
}
, {
"code": 2,
"name": "青森県",
"denominator": 824,
"par": 21.84,
},
{
"par": 21.84
}
, {
"code": 3,
"name": "岩手県",
"denominator": 734,
"par": 11.44,
},
{
"par": 11.44
}
, {
"code": 4,
"name": "宮城県",
"denominator": 718,
"par": 63.09,
},
{
"par": 63.09
}
, {
"code": 5,
"name": "秋田県",
"denominator": 704,
"par": 9.94,
},
{
"par": 9.94
}
, {
"code": 6,
"name": "山形県",
"denominator": 786,
"par": 47.07,
},
{
"par": 47.07
}
, {
"code": 7,
"name": "福島県",
"denominator": 1246,
"par": 21.75,
},
{
"par": 21.75
}
, {
"code": 8,
"name": "茨城県",
"denominator": 1902,
"par": 15.72,
},
{
"par": 15.72
}
, {
"code": 9,
"name": "栃木県",
"denominator": 1120,
"par": 18.66,
},
{
"par": 18.66
}
, {
"code": 10,
"name": "群馬県",
"denominator": 1140,
"par": 20.35,
},
{
"par": 20.35
}
, {
"code": 11,
"name": "埼玉県",
"denominator": 1924,
"par": 32.17,
},
{
"par": 32.17
}
, {
"code": 12,
"name": "千葉県",
"denominator": 1974,
"par": 27.51,
},
{
"par": 27.51
}
, {
"code": 13,
"name": "東京都",
"denominator": 1950,
"par": 63.33,
},
{
"par": 63.33
}
, {
"code": 14,
"name": "神奈川県",
"denominator": 1668,
"par": 56.77,
},
{
"par": 56.77
}
, {
"code": 15,
"name": "新潟県",
"denominator": 1660,
"par": 9.88,
},
{
"par": 9.88
}
, {
"code": 16,
"name": "富山県",
"denominator": 714,
"par": 7.14,
},
{
"par": 7.14
}
, {
"code": 17,
"name": "石川県",
"denominator": 618,
"par": 15.86,
},
{
"par": 15.86
}
, {
"code": 18,
"name": "福井県",
"denominator": 498,
"par": 17.67,
},
{
"par": 17.67
}
, {
"code": 19,
"name": "山梨県",
"denominator": 648,
"par": 28.24,
},
{
"par": 28.24
}
, {
"code": 20,
"name": "長野県",
"denominator": 1572,
"par": 18.13,
},
{
"par": 18.13
}
, {
"code": 21,
"name": "岐阜県",
"denominator": 1278,
"par": 11.35,
},
{
"par": 11.35
}
, {
"code": 22,
"name": "静岡県",
"denominator": 1878,
"par": 50.85,
},
{
"par": 50.85
}
, {
"code": 23,
"name": "愛知県",
"denominator": 2668,
"par": 36.47,
},
{
"par": 36.47
}
, {
"code": 24,
"name": "三重県",
"denominator": 1010,
"par": 20.79,
},
{
"par": 20.79
}
, {
"code": 25,
"name": "滋賀県",
"denominator": 588,
"par": 27.89,
},
{
"par": 27.89
}
, {
"code": 26,
"name": "京都府",
"denominator": 768,
"par": 44.79,
},
{
"par": 44.79
}
, {
"code": 27,
"name": "大阪府",
"denominator": 1734,
"par": 27.22,
},
{
"par": 27.22
}
, {
"code": 28,
"name": "兵庫県",
"denominator": 1862,
"par": 17.13,
},
{
"par": 17.13
}
, {
"code": 29,
"name": "奈良県",
"denominator": 510,
"par": 26.47,
},
{
"par": 26.47
}
, {
"code": 30,
"name": "和歌山県",
"denominator": 552,
"par": 9.42,
},
{
"par": 9.42
}
, {
"code": 31,
"name": "鳥取県",
"denominator": 402,
"par": 16.42,
},
{
"par": 16.42
}
, {
"code": 32,
"name": "島根県",
"denominator": 590,
"par": 3.39,
},
{
"par": 3.39
}
, {
"code": 33,
"name": "岡山県",
"denominator": 1044,
"par": 6.23,
},
{
"par": 6.23
}
, {
"code": 34,
"name": "広島県",
"denominator": 1296,
"par": 14.27,
},
{
"par": 14.27
}
, {
"code": 35,
"name": "山口県",
"denominator": 812,
"par": 29.31,
},
{
"par": 29.31
}
, {
"code": 36,
"name": "徳島県",
"denominator": 616,
"par": 35.06,
},
{
"par": 35.06
}
, {
"code": 37,
"name": "香川県",
"denominator": 614,
"par": 57.98,
},
{
"par": 57.98
}
, {
"code": 38,
"name": "愛媛県",
"denominator": 988,
"par": 10.93,
},
{
"par": 10.93
}
, {
"code": 39,
"name": "高知県",
"denominator": 598,
"par": 21.74,
},
{
"par": 21.74
}
, {
"code": 40,
"name": "福岡県",
"denominator": 1584,
"par": 10.04,
},
{
"par": 10.04
}
, {
"code": 41,
"name": "佐賀県",
"denominator": 548,
"par": 8.03,
},
{
"par": 8.03
}
, {
"code": 42,
"name": "長崎県",
"denominator": 802,
"par": 8.73,
},
{
"par": 8.73
}
, {
"code": 43,
"name": "熊本県",
"denominator": 1118,
"par": 4.65,
},
{
"par": 4.65
}
, {
"code": 44,
"name": "大分県",
"denominator": 840,
"par": 6.79,
},
{
"par": 6.79
}
, {
"code": 45,
"name": "宮崎県",
"denominator": 742,
"par": 15.77,
},
{
"par": 15.77
}
, {
"code": 46,
"name": "鹿児島県",
"denominator": 1442,
"par": 14.77,
},
{
"par": 14.77
}
, {
"code": 47,
"name": "沖縄県",
"denominator": 446,
"par": 36.55,
},
],
"par": 36.55
}
]
}
View
surveyor.css