GeoJsonのamchartはgeoJsonに何が問題なのですか？

Question

ammChartsには比較的新しく、geoJSONファイルを作成するのは初めての試みです。

次は私にGeoJSONファイルです：これは私が達成しようとしているものです

GeoJSON file

： example

私は私にGeoJSONをロードすると、これは何が起こるかです：

したがって、1つのポリゴンだけが積極的に動作しています。何らかの理由で私は問題があり、コードのjsfiddleやcodepenを作成できませんでした。私は自分のgeoJSONで何かが間違っていると信じています。他のランダムなGeojsonファイルがロードされていて、amchartsによって作成されたcodepenで正常に動作します。

私はgeojson.ioを使用してgeoJsonを作成しています。

Answer 1

geoJSONの問題は、IDが不足していることです。 AmChartsのマップには、各地域ごとに固有のIDが必要です。いずれの地域にも"id"プロパティが設定されていないため、デフォルトではすべてnullになり、いずれかの領域のみが強調表示されます。私はまた、あなたがの名前を取得しますように変換されたオブジェクトに"title"属性を追加する例を修正

{ 
    "type": "FeatureCollection", 
    "features": [ 
    { 
     "type": "Feature", 
     "properties": { 
     "division": "Muzaffarabad", 
     "district": "Muzaffarabad", 
     "id": "Muzaffarabad", 
// ... others omitted 

：私はあなたのJSONを変更し、そのような各地域の地区と同じ値でIDを追加しました変更されたファイルとサンプルコードで

for(var i = 0; i < svg.length; i++) { 
    var path = svg[i]; 
    var attrs = path.match(/\w+=".*?"/g); 
    var area = {}; 
    for(var x = 0; x < attrs.length; x++) { 
     var parts = attrs[x].replace(/"/g, '').split("="); 
     var key = fieldMap[parts[0]] || parts[0]; 
     area[key] = parts[1]; 
    } 
    //added for hover-over balloons 
    area["title"] = area["id"]; 
    mapVar.svg.g.path.push(area); 
    } 

Here's a demo：あなたは、デフォルトで、その上にカーソルを置くエリア。完全に変更されたgeoJSONファイルhereが見つかります。