在amcharts中使用JSON - 如何修改JSON輸出（Ruby on Rails）

我想使用amcharts，我想用JSON格式化我的圖表的數據。但是，似乎amcharts接受的語法不是有效的JSON。在amcharts中使用JSON - 如何修改JSON輸出（Ruby on Rails）

這裏是該數據用於硬編碼amchart圖表的JavaScript代碼：

var chartData = [{ 
      country: "Czech Republic", 
      litres: 301.90 
     }];

下面是代碼，如果我想創建嵌入紅寶石同一圖表：

控制器

@chart_data = [{"country": "Czech Republic", "litres": 301.90}]

查看

var chartData = <%= @chart_data.to_json %>;

的valid JSON輸出：

[{"country": "Czech Republic", "litres": 301.90}]

然而，什麼amcharts接受的是：

[{country: "Czech Republic", litres: 301.90}]

因此，我的圖表不工作，因爲amcharts不接受有效的JSON。那麼有沒有一種方法可以創建「無效的」JSON而不用國家和公升的雙引號？還是有更好的方式來獲取amcharts接受的形式的數據？任何幫助將不勝感激。

下面是完整的JavaScript：

<script type="text/javascript"> 
     var chart; 
     var legend; 

     var chartData = [{ 
      country: "Czech Republic", 
      litres: 301.90 
     }, { 
      country: "Ireland", 
      litres: 201.10 
     }, { 
      country: "Germany", 
      litres: 165.80 
     }, { 
      country: "Australia", 
      litres: 139.90 
     }, { 
      country: "Austria", 
      litres: 128.30 
     }, { 
      country: "UK", 
      litres: 99.00 
     }, { 
      country: "Belgium", 
      litres: 60.00 
     }]; 

     AmCharts.ready(function() { 
      // PIE CHART 
      chart = new AmCharts.AmPieChart(); 
      chart.dataProvider = chartData; 
      chart.titleField = "country"; 
      chart.valueField = "litres"; 
      chart.outlineColor = "#FFFFFF"; 
      chart.outlineAlpha = 0.8; 
      chart.outlineThickness = 2; 

      // WRITE 
      chart.write("chartdiv"); 
     }); 
    </script>

來源

2012-04-02 diasks2

您能否提供一個您對amcharts打電話的例子嗎？ – 2012-04-02 23:38:33

嗨喬，我添加了上面的完整的JavaScript的一個例子。除此之外，唯一的其他部分是包括可以從他們的網站下載的amcharts.js文件。我希望那是你的意思。如果沒有，請告訴我。 – diasks2 2012-04-03 01:13:49

在您給出的示例中，amCharts不會讀取JSON，而是瀏覽器的JS引擎，然後代碼將生成的對象傳遞給amCharts。但任何瀏覽器都應該處理解析正確的JSON。這裏究竟發生了什麼？ – 2013-04-18 15:18:11

我會在這裏失去了點，但如果你不使用@chart_data其他地方，你可以只建立在控制器中的僞JSON數據串並刪除在.to_json呼叫您的看法：

控制器：

@chart_data = "[{country: \"Czech Republic\", litres: 301.90}]" #build this string dynamically

查看：

var chartData = <%= @chart_data %>;

如果您正在使用@chart_data其他地方，你還可以創建一個@formatted_chart_data

如果你想使用AJAX來減少開銷當圖表沒有顯示你可以添加什麼也不做的動作，但你的回報圖表數據，並從您的JS調用它：

控制器：

def get_formatted_chart_data 
    chart_data = "[{country: \"Czech Republic\", litres: 301.90}]" 
    render :text => chart_data 
end

抑或是動態的構建是最困難的部分字符串？

來源

2012-04-03 05:52:02 Mishaux

感謝Mishaux，這是非常有幫助的，並給了我很多工作。我認爲動態構建字符串是很難的部分，但您的回答幫助我開始朝着正確的方向發展。謝謝！ – diasks2 2012-04-03 14:53:29

這是一個[教程]（http://www.diasks2.com/post/21827658042/ruby-on-rails-tutorial-a-dynamic-amcharts-graph）通過獲取amcharts圖表來獲取數據數據庫。 – diasks2 2012-04-26 02:59:13

來自amCharts：「amCharts並不直接支持JSON，它不會加載外部數據文件或任何東西，它只是使用原生JavaScript數據對象，所以它真的取決於瀏覽器的JS解析器它可以或不可以的數據格式讀。」

http://www.amcharts.com/forum/viewtopic.php?id=7049

我假設你有一個以上的圖表，並建立了自定義字符串格式化每個可能比較容易使用默認JSON或Rabl的格式來有點麻煩。

什麼，你也可以做的是創造一個常見的JavaScript功能，並使用正則表達式一點的JSON過濾到amCharts友好format.and

function CleanJSONForAMCharts(json) { 
    return json.replace(/"(\w+)"\s*:/g, '$1:'); 
}

現在這仍然是當然是一個字符串，而不是現在的對象amCharts陣列期待。在傳遞給dataProvider之前，必須在返回的字符串上調用Eval（）。

//sample data that would have been returned from a RESTful service or another JSON returning method 
var chartData = CleanJSONForAMCharts("[{\"title\":\"sample 1\",\"value\":130},{\"title\":\"sample 2\",\"value\":26}]"); 

var chart = new AmCharts.AmSerialChart(); 
chart.categoryField = "title"; 
chart.dataProvider = eval(chartData); 

var graph = new AmCharts.AmGraph(); 
graph.valueField = "value"; 
graph.type = "column"; 
graph.fillAlphas = 1; 
chart.addGraph(graph); 

chart.write("chartdiv");

來源

2013-06-11 16:18:55 catalpa

在amcharts中使用JSON - 如何修改JSON輸出（Ruby on Rails）

回答

相關問題