简体   繁体   English

如何使用Chartkick在Rails中混合列和折线图?

[英]How can I mix a column and line chart in Rails using Chartkick?

I would like to present graphs in my rails app. 我想在我的rails应用程序中显示图表。 I was able to find a lot of projects that could do that, as Chartkick . 作为Chartkick ,我能够找到许多可以做到这一点的项目。 But I would like to have charts like this one , where I max lines and columns. 不过,我想有一个像图这一个 ,在那里我最大行和列。 Is there any project that is able to draw this kind of graphs? 有没有能够绘制这种图形的项目? I was not able to find anything on chartkick's website or Google. 我无法在chartkick的网站或Google上找到任何内容。

You could do it like this using chartkick: 你可以使用chartkick这样做:

= column_chart(@your_data, library: { :series => { 0 => { type: "line"} } })

This will set the first series in @your_data as the line chart. 这会将@your_data中的第一个系列设置为折线图。 Of course you can set every other series in that as well just exchange the "0" for another number. 当然你可以设置其他所有系列,只需将“0”换成另一个数字即可。

I hope this helps! 我希望这有帮助!

This can be done in Javascript using something like: 这可以使用以下内容在Javascript中完成:

new Chartkick.AreaChart("chart", [{"name":"Series 1","data":{"2013-03-11 00:00:00 -0700":3,"2013-03-31 00:00:00 -0700":5}},{"name":"Series 2","data":{"2013-02-10 00:00:00 -0800":0,"2013-02-17 00:00:00 -0800":0}},{"name":"Series 3","data":{"2013-02-10 00:00:00 -0800":0,"2013-02-17 00:00:00 -0800":1}}], { library: { series: { 0: { color: "blue" }, 1: { type: "line", color: "yellow" }, 2: { type: "line", color: "green" } } } }  );

Series 2 and 3 will be lined, and Series 1 will be an area chart. 系列2和3将衬里,系列1将是面积图。 :) :)

(This is primarily a response to JNM's question on Timo's answer, but I can't reply to comments at the moment. :/ ) (这主要是对JNM关于Timo答案的问题的回应,但我目前无法回复评论。:/)

Google Visualization Combo charts should be able to do what you are looking for Google Visualization Combo charts应该能够满足您的需求

Have a look at documentation for more info 查看文档以获取更多信息

Js Fiddle Js Fiddle

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM