Fork: 0
haya4 / www-root
Transfer to URL with SHA Find file
Newer
Older
www-root / coverage / carto_fuel.html
@hayashi hayashi on 24 Sep 2017 2 KB save
Raw Blame History 
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.  <meta charset='utf-8'/>
  5.  <link rel="stylesheet" href="../surveyor.css">
  6.  <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.4.2/react.js"></script>
  7.  <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.4.2/react-dom.js"></script>
  8.  <script type="text/javascript"><!--
  9. function getJSON(fName) {
  10.   var req = new XMLHttpRequest();
  11.  
  12.   req.onreadystatechange = function() {		  // XMLHttpRequest オブジェクトの状態が変化した際に呼び出されるイベントハンドラ
  13.     if(req.readyState == 4 && req.status == 200){ // サーバーからのレスポンスが完了し、かつ、通信が正常に終了した場合
  14.     }
  15.   };
  16.  
  17.   req.open("GET", fName, true);
  18.   req.send(null);					    // 実際にサーバーへリクエストを送信
  19. }
  20.  
  21. function parseJSON(jsData) {
  22.   var data = eval("("+ jsData +")");
  23.   var resultdata = "[json.timestamp: "+ data.timestamp +"]";
  24.   return resultdata;
  25. }
  26.  // --></script>
  27. </head>
  28. <body>
  29. <H1>OpenStreetMap coverage (バス停を指標にした網羅率)</H1>
  30. <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>
  31. <a href="https://hayashi.carto.com/builder/d570b7da-c40f-4ad4-afd5-ab99396b0863/embed"><img src="../92px-CARTO-logo.svg.png"/></a><p>国土交通省国土政策局「国土数値情報（燃料給油所データ平成２７年版）」をもとにhayashiが編集・加工したものです。</p>
  32.  
  33. <table>
  34.  <tr>
  35.   <td class="left">
  36.     <p>国土数値情報の燃料給油所位置を中心とする、200m四方の矩形領域に存在するOSMのamenity=fuelノードの評価点の合計を数える。<br/>
  37.     <br/>
  38.     評価点；<br/>
  39.     　blandがない　ーー＞　１ポイント<br/>
  40.     　fixmeがある　ーー＞　１ポイント<br/>
  41.     　blandがある　ーー＞　５０ポイント<br/>
  42.     <br/>
  43.     対象ノード；<br/>
  44.     　amenity = fuel<br/>
  45.     <br/>
  46.     レベル分け：<br/>
  47.     　評価点の合計値をもとに以下に色分けしています。<br/>
  48.     　　０ポイント　→　赤 (未入力）<br/>
  49.     　　１ポイント以上　→ 黄緑 (一次入力)<br/>
  50.     　　50ポイント以上　→　青 (入力済) <br/>
  51.     </p>
  52.   </td>
  53.   <td class="right">
  54.     <input type="button" value="データを取得する" onclick="getJSON('coverage.fuel.json')"></input>
  55.     <div id="result"></div>
  56.     <script>
  57.   var tableComponent = React.createClass({
  58.     render: function() {
  59.       return React.DOM.h1(null, 'Hello!');
  60.     }
  61.   });
  62.  
  63.       ReactDOM.render(
  64.         React.createElement(tableComponent), 
  65.         document.getElementById('result')
  66.       );
  67.     </script>
  68.   </td>
  69.  </tr>
  70. </table>
  71.  
  72. </body>
  73. </html>