0

我正在尝试使用 morris.js ( http://www.oesmith.co.uk/morris.js/donuts.html ) 制作甜甜圈图，但是在正确格式化数据时遇到了一些问题。

目前这是数据的格式。

{"2D"=>"6768.96", "1DP"=>"293.63", "3D"=>"84.97", "1D"=>"361.83", "GR-RES"=>"19083.85", "GR-COM"=>"11254.69"}

以下是我当前的代码

<%= content_tag :div, "", id: "shipments-by-service-type", data: {shipments: @details.group(:family).sum("base_charge + discount")} %>


jQuery ->
  Morris.Donut
    element: "shipments-by-service-type"
    data: $('#shipments-by-service-type').data('shipments')

这是我将数据传递到 js 并解析以制作图表的第一次体验，任何帮助将不胜感激。

4

1 回答 1

2

因此，一旦您更正了我在上面的评论中指出的引号问题，无论是转义还是将外部引号切换为单引号，此 javascript 都会解析您的输入并为甜甜圈图做好准备

var dataArr = [];
var obj = $("#shipments-by-service-type-simple").data('shipments');
for ( var prop in obj) {
  dataArr.push({"label": prop, "value": obj[prop]});
}

Morris.Donut({
  element: 'donut-example',
  data: dataArr
});

这是jsbin。拉斐尔似乎不喜欢十进制值并且正在抛出错误。可能想要四舍五入你的价值观

于 2013-03-28T21:02:17.957 回答