Google Maps API：フィーチャコレクションのgetFeatureByIdが機能しない

Question

フィーチャコレクションデータオーバーレイの特定のフィーチャのスタイルを変更しようとしています。これは私のJSONの抜粋です：

{ 
 
    "type": "FeatureCollection", 
 
    "features": [ 
 
    { 
 
     "type": "Feature", 
 
     "id": 1, 
 
     "properties": { 
 
     "name": "1 CBD - Bankenviertel", 
 
     "color": "transparent", 
 
     "isHovered": false, 
 
     "isActive": false 
 
     }, 
 
     "geometry": { 
 
     "type": "Polygon", 
 
     "coordinates": [ 
 
      [ 
 
      [ 
 
       8.67279430349, 
 
       50.1143807311 
 
      ], 
 
      [ 
 
       8.67280054398, 
 
       50.1143975981 
 
      ] 
 
     ] 
 
     ] 
 
     } 
 
    }

、これが私のmap.js

map.data.loadGeoJson('some.json'); 
 
console.log(map.data.getFeatureById(1));

から関連するスニペットであると私は常に取得していますコンソールの "未定義"。

私はここで間違っていますか？

おかげで、

ロバート

Answer 1

あなたは、コールバック関数内map.data.getFeatureById(1)を呼び出す必要があります（これにGeoJSONがロードされる前に、それは実行されません）。 the documentationから

：

loadGeoJson（URL：文字列、オプション：？Data.GeoJsonOptions、コールバック：？機能（アレイ））

戻り値：なし

荷重GeoJS

proof of concept fiddle

コードスニペット：

var geocoder; 
 
var map; 
 

 
function initialize() { 
 
    var map = new google.maps.Map(
 
    document.getElementById("map_canvas"), { 
 
     zoom: 4, 
 
     center: { 
 
     lat: -28, 
 
     lng: 137 
 
     }, 
 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
 
    }); 
 
    // map.data.addGeoJson(geoJson); 
 
    map.data.loadGeoJson(
 
    'https://api.myjson.com/bins/1teyu', {}, 
 
    function(features) { 
 
     console.log(map.data.getFeatureById(1)); 
 
     console.log(map.data.getFeatureById(1).getProperty("letter")); 
 
    }); 
 
} 
 
google.maps.event.addDomListener(window, "load", initialize);

html, 
 
body, 
 
#map_canvas { 
 
    height: 100%; 
 
    width: 100%; 
 
    margin: 0px; 
 
    padding: 0px 
 
}

<script src="https://maps.googleapis.com/maps/api/js"></script> 
 
<div id="map_canvas"></div>