jsonの文字列をチャートチャートに埋め込みますか？

Question

私は自分のamchartsにjsonを埋め込むようにしています。これはhtmlにjavascriptコードです：

<script type="text/javascript"> 
    AmCharts.makeChart("mapdiv", { 
    "type": "map", 
    "imagesSettings": { 
    "rollOverColor": "#089282", 
    "rollOverScale": 1, 
    "selectedScale": 0.5, 
    "selectedColor": "#089282", 
    "color": "#13564e", 
    "selectable": false, 
    "bringForwardOnHover": false 
    }, 
    "areasSettings": { 
    "color": "#D3D3D3", 
    "autoZoom": true 
    }, 
    "data": { 
    "map": "puertoRicoHigh" 
    }, 
    "dataLoader": { 
    "url": "http://OurServer/Service1.svc/GetLocations", 
    "format": "json", 
    "showErrors": true, 
    "postProcess": function(data, config, map) { 
     // create a new dataProvider 
     var mapData = map.data; 

     // init images array 
     if (mapData.images === undefined) 
     mapData.images = []; 

     // create images out of loaded data 
     for(var i = 0; i < data.length; i++) { 
     var image = data[i]; 
     image.type = "circle"; 
     mapData.images.push(image); 
     } 
     return mapData; 
    } 
    } 
}); 
</script> 

そして、これがjsonは、次のようになります。私は、コードにこのjsonを埋め込むしようとしてきたが、私は困っやってたんだ[{"title":"Site1","latitude":18.37,"longitude":-67.18},{"title":"Site2","latitude":18.20,"longitude":-65.80}]

そう。

それはhttpリクエストはありませんので、私が代わりにdataloaderのdataproviderを使用してみましたが、私は何か欠けている知っている：マップdataProviderはobject、ないその構造上の立証されたアレイ、ある

<script type="text/javascript"> 
    AmCharts.makeChart("mapdiv", { 
    "type": "map", 
    "imagesSettings": { 
    "rollOverColor": "#089282", 
    "rollOverScale": 1, 
    "selectedScale": 0.5, 
    "selectedColor": "#089282", 
    "color": "#13564e", 
    "selectable": false, 
    "bringForwardOnHover": false 
    }, 
    "areasSettings": { 
    "color": "#D3D3D3", 
    "autoZoom": true 
    }, 
    "data": { 
    "map": "puertoRicoHigh" 
    }, 
    "dataProvider": [{"title":"Site1","latitude":18.3764,"longitude":-67.1819},{"title":"Site2","latitude":18.2001,"longitude":-65.8081}], 
    "postProcess": function(data, config, map) { 
     // create a new dataProvider 
     var mapData = map.data; 

     // init images array 
     if (mapData.images === undefined) 
     mapData.images = []; 

     // create images out of loaded data 
     for(var i = 0; i < data.length; i++) { 
     var image = data[i]; 
     image.type = "circle"; 
     mapData.images.push(image); 
     } 
     return mapData; 
    } 
}); 
</script> 

Answer 1

をmap demos on the AmCharts website。

dataProvider: { 
    map: "puertoRicoHigh", 
    images: [ 
    {"title":"Site1","latitude":18.3764,"longitude":-67.1819, "type": "circle"}, 
    {"title":"Site2","latitude":18.2001,"longitude":-65.8081, "type": "circle"} 
    ] 
} 

デモ：

をあなたのJSONは基本的にの配列ですので、後処理方法で行く、あなたは各画像に type: "circle"を追加し、任意のさらなる処理のための必要性をスキップし、そのようなあなたの dataProviderを再構築することができますあなたの答えのための

AmCharts.makeChart("mapdiv", { 
 
    "type": "map", 
 
    "imagesSettings": { 
 
    "rollOverColor": "#089282", 
 
    "rollOverScale": 1, 
 
    "selectedScale": 0.5, 
 
    "selectedColor": "#089282", 
 
    "color": "#13564e", 
 
    "selectable": false, 
 
    "bringForwardOnHover": false 
 
    }, 
 
    "areasSettings": { 
 
    "color": "#D3D3D3", 
 
    "autoZoom": true 
 
    }, 
 
    "dataProvider": { 
 
    "map": "puertoRicoHigh", 
 
    "images": [{ 
 
     "title": "Site1", 
 
     "latitude": 18.3764, 
 
     "longitude": -67.1819, 
 
     "type": "circle" 
 
     }, 
 
     { 
 
     "title": "Site2", 
 
     "latitude": 18.2001, 
 
     "longitude": -65.8081, 
 
     "type": "circle" 
 
     } 
 
    ] 
 
    } 
 
});

<script src="//www.amcharts.com/lib/3/ammap.js"></script> 
 
<script src="//www.amcharts.com/lib/3/maps/js/puertoRicoHigh.js"></script> 
 
<div id="mapdiv" style="width: 100%; height: 400px;"></div>