Fork: 0
haya4 / www-root
Transfer to URL with SHA Find file
Newer
Older
www-root / coverage / busstop.html
@hayashi hayashi on 28 Nov 2017 5 KB busstop; timestamp2
Raw Blame History 
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.  <meta charset='utf-8'/>
  5.  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6.  <title>OpenStreetMap coverage (amenity=fuel)</title>
  7.  <link rel="stylesheet" href="../surveyor.css">
  8.  <link rel="stylesheet" href="../lib/leaflet-0.7.3/leaflet.css"/>
  9. </head>
  10. <body>
  11. <div id="wrap">
  12.     <div class="header">
  13.         <H1>OpenStreetMap coverage (バス停を指標にした網羅率)</H1>
  14.         <div id="map" style="height: 720px; width: 98%;"></div>
  15.         <div id="timestamp2"></div><br/>
  16.         <div id="source"></div>
  17.         <p>（旧版）2017-10-08時点での状況は<a href="https://hayashi.carto.com/builder/48b1de25-3aac-491d-8cee-95d747add887/embed">CARTO</a>にて参照可能です　<img src="../92px-CARTO-logo.svg.png"/></p>
  18.  
  19.         <hr/>
  20.     </div>
  21.  
  22.     <div id="inner">
  23.         <div id="mainWrap">
  24.             <p>以下のデータは月に２〜３回程度の頻度で更新を行う予定です。</p>
  25.             <p class="middle"><a href='http://surveyor.mydns.jp/owncloud/s/fx3xjafbd66c1us'><img src="../logo_postgis.jpg" alt="PostGISの使い方" class="PostGIS"/></a>　<img src="../qgis-logo_anita02.png" alt="QGISでの表示" id="QGISlogo"/></p>
  26.             <p>'QGIS’を使ってPostGISデータベースにあるデータを直接見ることで、GSの入力状況(入力済み／未入力)を詳細に知ることができます。マッピング計画の参考にしてください。</p>
  27.             <img src="QGIS_busstop_20171007.png" alt="QGISでの表示" class="qgisimage"/><br/>
  28.             <ul>
  29.                 <li>QGISの設定定義ファイル[<a href='busstop_00_All.qgs'>busstop_00_All.qgs</a>]をダウンロード可能です。(for QGIS v2.14)</li>
  30.                 <li>「<a href='http://surveyor.mydns.jp/owncloud/s/fx3xjafbd66c1us'>QGISの使い方</a>」説明書をダウンロード可能です。</li>
  31.             </ul>            
  32.  
  33.             <br/>
  34.             <hr/>
  35.             <br/>
  36.  
  37.             <p>国土数値情報のバス停位置を中心とする、300m以内に存在するOSMのバス停ノードの評価点の合計を数える。<br/>
  38.                 また、nameが同一ならば600m以内にまでのノードも評価点に加える。<br/>
  39.                 ※ 2017-10-01 ポイントの集計方法を変更しました。以前からここのPostGISデータを利用しているかたはQGSファイルを更新してください。
  40.             <br/>
  41.             評価点:<br/>
  42.               ２個以上のバス停がある　→　3ポイント<br/>
  43.               １個のバス停がある　→　2ポイント<br/>
  44.               nameがない　→　1ポイント<br/>
  45.               fixmeがある_→ 1ポイント<br/>
  46.             <br/>
  47.             対象ノード:<br/>
  48.               node: [highway=bus_stop]<br/>
  49.               node: [highway=disused:bus_stop]<br/>
  50.               area: [amenity=bus_station]<br/>
  51.               node: [public_transport=platform] and [bus=yes]<br/>
  52.               node: [public_transport=stop_position] and [bus=yes]<br/>
  53.             <br/>
  54.             レベル分け:<br/>
  55.               評価点の合計値をもとに以下に色分けしています。<br/>
  56.                 0ポイント　→　赤 (未入力）<br/>
  57.                 1ポイント　→ オレンジ (一次入力)<br/>
  58.                 2ポイント　→　黄緑 (入力済) <br/>
  59.                 3ポイント　→　緑 (入力済) <br/>
  60.             </p>
  61.         </div>
  62.  
  63.         <div id="sideWrap">
  64.             <div id="timestamp"></div>
  65.             <table>
  66.                 <caption>マッピングカバー率 都道府県別</caption>
  67.                 <thead>
  68.                     <tr>
  69.                         <th>code</th>
  70.                         <th>都道府県</th>
  71.                         <th>標本数</th>
  72.                         <th>カバー率(%)</th>
  73.                     </tr>
  74.                 </thead>
  75.                 <tbody id="data_list"></tbody>
  76.             </table>
  77.         </div>
  78.         <div class="clear"><hr /></div>
  79.     </div>
  80. </div>
  81. <script src="../lib/leaflet-0.7.3/leaflet-src.js"></script>
  82. <script src="../lib/Leaflet.MapboxVectorTile.js"></script>
  83. <script src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
  84.  
  85.  <script>
  86. window.addEventListener('DOMContentLoaded', function() {
  87.     $.getJSON("/gitbucket/yuu/osmCoverageBin/raw/master/GML_BUSSTOP/coverage.busstop.json", function(data) {
  88.         var count = 0 ;
  89.         $("#timestamp").append("<p>" + data.timestamp + "</p>") ;
  90.         $("#timestamp2").append("<p>上図は " + data.timestamp + " での状況<br/>   赤: 未入力, オレンジ: とりあえず入力済み, 蛍光グリーン: 入力済み</p>") ;
  91.         $("#source").append("国土交通省国土政策局「" + data.sourcedata + "」をもとにhayashiが編集・加工したものです。") ;
  92.         $(data.coverage).each(function() {
  93.             $("#data_list").append("<tr id=\"data_id" + count + "\"></tr>") ;
  94.             $("#data_list #data_id" + count).append("<td class='code'>" + this.code + "</td>") ;
  95.             $("#data_list #data_id" + count).append("<td class='name'>" + this.name + "</td>") ;
  96.             $("#data_list #data_id" + count).append("<td class='denominator'>" + this.denominator + "</td>") ;
  97.             $("#data_list #data_id" + count).append("<td class='par'>" + this.par + "</td>") ;
  98.             count++ ;
  99.         });
  100.     });
  101.     
  102.     var tileDate = '/gitbucket/yuu/osmCoverageBin/raw/master/GML_BUSSTOP/tileDate.json';
  103.     $.getJSON(tileDate, function(data) {
  104.         $("#timestamp2").append("<p>上図は " + data.date + " での状況<br/>   赤: 未入力, オレンジ: とりあえず入力済み, 蛍光グリーン: 入力済み</p>") ;
  105.     });
  106. });
  107.  </script>
  108. <script src="busstop.js"></script>
  109.  
  110. </body>
  111. </html>