Rails Rails 用 echarts 画图,如何实现图表动态更新

azpokr · 2016年05月31日 · 最后由 azpokr 回复于 2016年06月03日 · 5016 次阅读

我需要把数据库中读出来的数据画成折线图,读取方式是用户输入起始时间和结束时间,然后读出每月的花费和总和,最大值最小值,我想做成坐标和数据都是随着用户查找的数据进行更新,我用的实例变量传参解析的,但是 echarts,data 块中可以直接嵌入 ruby 代码么?还是说要把数据格成 json 格式用 ajax 读取数据?请有经验的前辈指点一下

还是说要把数据格成 json 格式用 ajax 读取数据。再加个轮询

这应该可以。以前这么做过。

#1 楼 @pathbox 那能不能用实例变量遍历呢?

折线图实时更新,你就每隔一段时间就要发送 ajax 请求新的数据, 或者用 websocket 真正做到实时更新。

#2 楼 @azpokr 可以用实例变量。直接在 controller 里面遍历好赋值给 实例变量 在 view 里面使用。你是说 多个不同的折线图或直方图 不想重复再 view 里面写 echart 的构造代码吗?这其实也可以,在 helpers 里面写个构造的模板代码,只是传不同的参数,一个页面可以渲染 n 个不同的直方图或折线图之类的区域,而 view 里面的重复代码就大大减少了

#4 楼 @pathbox 谢谢前辈,我试一下,在 controller 里面遍历是不是用 map 会比较好?

#4 楼 @pathbox 前辈,我在后台把数据用 map 遍历了@pay = Basic.where("userid = ?",params[:id]),@pay_money = @pay.map { |f| f.money },图表 data[<%= @pay_money%>],怎么图都显示不出来了呢?

#4 楼 @pathbox 前辈我后台数据是有的,但是卸载 echarts 图表区域实例变量就是 nil 了,这是怎么回事?

#8 楼 @azpokr 晚上回家帮你看下

#10 楼 @azpokr data: <%= @pay_money%> 应该是这样吧。

#11 楼 @pathbox 图出不来....,而且我的数据量有点大,时间是每天的,能不能不按照一天一天来,当数据量大的时候,自动调成按周输出?

#12 楼 @azpokr 我觉得你先简单的数据图画出来。然后再上多数据。至于按天 按周 按年 这个可以灵活选择。折线图 Y 轴 data 后面加的参数 不是 数组吗。。。图没出来查看下错误。。。浏览器 console 会报 js 错误之类的,再找原因

#13 楼 @pathbox 简单的数据(直接写上数据),可以画出,动态加载的数据,图出不来,报错 unexpected token&,好想跟 turbolinks 有关系

#13 楼 @pathbox 前辈,rails 里面有没有什么方法可以把"2012-02-02"转成 2012-02-02 呢?我取出来的时间数组 ["2012-01-02","2012-02-02"] 这样的,echarts 解析会把双引号也给解析了..

@azpokr 你存时间数组的时候不要存字符串,直接存日期应该就没问题吧,或者你把时间数组每一个元素都 to_date 一下试试

#16 楼 @ice_7 to_date 失败了,我直接把日期格式 map 成了 yyyymmdd 的格式然后 to_i 了....真是投机

需要 登录 后方可回复, 如果你还没有账号请 注册新账号