rails 3.2.1上的morris.js无法从html获取json

我在morris.js图形库上有一个奇怪的错误

这适用于graphs.js

$(document).ready(function() { Morris.Line({ element: 'annual', data: [ {y: '2012', a: 100}, {y: '2011', a: 75}, {y: '2010', a: 50}, {y: '2009', a: 75}, {y: '2008', a: 50}, {y: '2007', a: 75}, {y: '2006', a: 100} ], xkey: 'y', ykeys: ['a'], labels: ['Series A'] }); }) 

这不是graphs.js

 $(document).ready(function() { Morris.Line({ element: 'annual', data: $('#logs_chart').data('logs'), xkey: 'y', ykeys: ['a'], labels: ['Series A'] }); }) 

在相应的HTML中

我明白了

 Uncaught TypeError: Cannot call method 'match' of undefined morris.js:316 Morris.parseDate = function(date) { var isecs, m, msecs, n, o, offsetmins, p, q, r, ret, secs; if (typeof date === 'number') { return date; } m = date.match(/^(\d+) Q(\d)$/); Uncaught TypeError: Cannot call method 'match' of undefined n = date.match(/^(\d+)-(\d+)$/); 

有人遇到这个并找到了解决方案吗？

Answer 1

填充数据日志中的图形数据不起作用，因为它是一个字符串。 您需要使用JSON.parse ， jQuery.parseJSON或类似方法解析数据。

值得注意的是，您在示例中获得的数据不是严格有效的JSON，您需要转义密钥，例如：

和相应的HTML：

 $(document).ready(function() { Morris.Line({ element: 'annual', data: $.parseJSON($('#logs_chart').data('logs')), xkey: 'y', ykeys: ['a'], labels: ['Series A'] }); }) 

Answer 2

对我来说，解决方案是将json输出放在HTML末尾的脚本标记中的变量中。

像这样

并在graphs.js文件中调用此变量

 $(document).ready(function() { Morris.Line({ element: 'annual', data: json_data, xkey: 'y', ykeys: ['a'], labels: ['Series A'] }); })