地域医療研究のためのGoogle Map API入門(2)

今日の目標

環境の準備

国土数値情報のダウンロード

今回利用するデータのダウンロード

シェープファイル→GeoJSON

GeoJSONファイルの中身

aichi_mesh_population.geojson: 将来人口推計メッシュ
aichi_med_providers.geojson: 医療機関

GeoJSONの読み込みと表示: ポリゴン

ファイル: 001_add_mesh_data.html

        <script>
          …(省略)…
          var mesh_data;
            $.getJSON("aichi_mesh_population.geojson", function(data) {
              mesh_data = data;
            });
            window.onload = function() {
              draw_map(c_lat,c_lng);
              add_mesh_data();
            }
            …(中略)…
            function add_mesh_data() {
              map.data.addGeoJson(mesh_data);
            }
        </script>

オブジェクトの中身を調べてみよう

        >>mesh_data
        Object {type:"FeatureCollection", crs:Object, features: Array[3928]}
        >>mesh_data.features[0]
        Object {type:"Feature", properties: Object, geometry: Object}

→propertiesというプロパティの値はどのようなものか？
Objectをクリックすると、右のパネルに、詳細が表示される。
同様に、germetryの値は何か？

propertiesの値の定義はどこに？

ポリゴンの塗り分け

ファイル: 002_color_mesh.html

        function add_mesh_data() {
          map.data.addGeoJson(mesh_data);
          map.data.setStyle(function(feature) {
            var index =
            feature.getProperty('INDEX');
            var color;
            if(index>100) {
              color = 'green';
            }
            else if(index>80) {
              color = 'yellow';
            }
            else if(index>70) {
              color = 'brown';
            }
            else {
              color = 'red';
            }
            return {
              fillColor:color,
              strokeWeight:1
            };
          });
        }

INDEX:2010年総人口数(補正なし)を100とした場合の2050年総人口数(補正なし)の指数
データの欠落をチェックする必要あり。
ファイル: 002_01_color_mesh.html

点の表示

ファイル: 003_add_med_providers.html

        var med_providers_data;
        $.getJSON("aichi_med_providers.geojson", function(data) {
          med_providers_data = data;
        });
        …
        window.onload = function() {
          draw_map(c_lat, c_lng);
          add_med_providers_data();
        }
        …
        function add_med_providers_data() {
          map.data.addGoeJson(med_providers_data);
        }

データオブジェクトを調べてみる

        >>med_providers_data
        Object {type:"FeatureCollection", crs:Object, features:Array[9347]}
        >>med_providers_data.features[0]
        Object {type:"Feature", properties:Object, geometry:Object}

条件を満たす点だけ表示する

ファイル: 004_select_hospitals.html

        function add_med_providers_data() {
          map.data.addGeoJson(med_providers_data);
          map.data.setStyle(function(feature) {
            var isHospital = feature.getProperty('P04_001');
            var providerName = feature.getProperty('P04_002');
            var isVisible;
            if(isHospital != 1) {
              isVisible = false;
            }
            else {
              isVisible = true;
            }
            return {
              visible: isVisible;
              tite: providerName;
            };
          });
        }

点とメッシュを重ねる

ファイル: 005_hosp_on_mesh.html

経度と緯度からメッシュIDを得る

ファイル: 002_02_get_mesh_id.html
参考: 緯度経度からメッシュコードを作成する方法
http://white-bear.info/archives/1400

やり残した課題