javascript - GeoJson amchart mapy, čo je zle na geoJson?

Som relatívne nový v ammCharts a toto je môj prvý pokus vytvoriť aj súbor geoJSON.

Nasleduje môj súbor geoJson:

Súbor GeoJSON

Toto je to, čo sa snažím dosiahnuť: príklad

Keď načítam svoj geoJson, stane sa toto:

Takže aktívne pracuje iba jeden polygón. Z nejakého dôvodu mám problémy a nemohol som vytvoriť jsfiddle alebo codepen toho kódu. Verím, že niečo je zle v mojom geoJSON, pretože som načítal iné náhodné súbory GeoJSON a tie fungujú v poriadku s codepen vytvoreným amcharts, ale ten môj nefunguje.

Používam geojson.io na vytváranie geoJsonu.

Odpoveď č. 1

Problém s vaším geoJSON je, že neobsahuje ID. Mapy AmCharts vyžadujú jedinečné ID pre každú oblasť. Keďže vo vašich oblastiach nie je nastavená žiadna "id" vlastnosť, všetky budú predvolene nastavené na null, čo umožní zvýrazniť iba jednu oblasť. Upravil som váš JSON a pridal ID s rovnakou hodnotou ako okres v každej oblasti takto:

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

Tiež som upravil príklad, aby som pridal atribút "title" do konvertovaného objektu, takže pri jeho prechode myšou dostanete meno oblasti predvolene:

  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);
  }

Tu je ukážka s upraveným súborom a ukážkovým kódom. Plne upravený súbor geoJSON nájdete tu.