有谁知道如何在Rails中创建图形。这是因为我需要在rails中读取和显示统计信息,并且在图表中显示统计信息的最佳方式。所以有人能告诉我该怎么做?谢谢! :)
答案 0 :(得分:5)
这里有很多选择。为了尝试将内容保存在Ruby中,我建议您查看ruport gem。请注意,Ruport的最新版本是在2007年。
正如Calvin所提到的,其他选项涉及Javascript解决方案。我喜欢有两个库。第一个是D3.js,可以在这里找到:
D3非常灵活,有一些强大的数据处理工具可以处理你的数据,但是它往往需要更多的开发时间来获得更好的东西。
我建议的另一个选项是highcharts:
这个库不像D3那么灵活,但更容易获得一个非常漂亮的图表并快速运行。另一件事是它没有真正拥有D3的数据处理工具。如果您正在寻找简单的东西,我建议您首先尝试使用Highcharts。
答案 1 :(得分:3)
我一直在使用名为jqPLot的JavaScript库。它很容易上手 - 基本上,你通过JS初始化图表。但是,在那个JS中你可以使用rails脚本标签< %%>构建必要的数据数组以提供购物车。显然还有其他加载数据的方法。
作为一个简单的例子,这将是你的html页面(称之为graph.html.erb)。呈现此页面的控制器需要设置@user_stats变量,因此可以使用它来构建jqPlot的数据集。
<html>
<head>
<script type="text/javascript">
$(document).ready(function() {
var plot2 = $.jqplot('chartdiv',
<%
last_one = @user_stats.pop
%>
[[
<% @user_stats.each { |user_stat| %>
[<%= user_stat[1] %>, '<%= user_stat[0].first_name %>'],
<% } %>
[<%= last_one[1] %>, '<%= last_one[0].first_name %>']
]],
{
seriesDefaults: {
renderer:$.jqplot.BarRenderer,
// Show point labels to the right ('e'ast) of each bar.
// edgeTolerance of -15 allows labels flow outside the grid
// up to 15 pixels. If they flow out more than that, they
// will be hidden.
pointLabels: { show: true, location: 'e', edgeTolerance: -15 },
// Rotate the bar shadow as if bar is lit from top right.
shadowAngle: 135,
// Here's where we tell the chart it is oriented horizontally.
rendererOptions: {
barDirection: 'horizontal'
}
},
axes: {
yaxis: {
renderer: $.jqplot.CategoryAxisRenderer
}
}
});
</script>
</head>
<body>
<div id="chartdiv" style="height:400px;width:300px;"></div>
</body>
</html>
答案 2 :(得分:2)
实现此目的的最佳方法是使用Google Chart Tool。他们有很多常见的图表类型可以使用,所以我先看一下。
以下是代码可能类似的简单示例
// Load the Visualization API and the piechart package.
google.load('visualization', '1.0', {'packages':['corechart']});
// Set a callback to run when the Google Visualization API is loaded.
google.setOnLoadCallback(drawChartRepublican);
function drawChartRepublican() {
// Create the data table.
var data = new google.visualization.DataTable();
data.addColumn('string', 'Topping');
data.addColumn('number', 'Slices');
data.addRows([
['Newt Gingrich', <%= @gingrich_today %>],
['Mitt Romney', <%= @romney_today %>],
['Ron Paul', <%= @paul_today %>],
['Rick Perry', <%= @perry_today %>],
['Michelle Bachmann', <%= @bachmann_today %>],
['Rick Santorum', <%= @santorum_today %>],
['John Huntsman', <%= @huntsman_today %>],
['Buddy Roemer', <%= @roemer_today %>]
]);
// Set chart options
var options = {'title':'Scoreboard (<%= DateTime.now %>)', 'width':680, 'height':480};
// Instantiate and draw our chart, passing in some options.
var chart = new google.visualization.PieChart(document.getElementById('chart_div_republican'));
chart.draw(data, options);
}
在视图中,您可以通过这种方式添加图表。
<div id="chart_div_republican"></div>
答案 3 :(得分:2)
我想在我自己的rails应用程序中做一些图表时遇到了你的问题。
我建议您查看Chartkick,http://ankane.github.io/chartkick/
这是相对较新的,所以当你问起原来的问题时就没有了。它将Google图表API包装在一个简单的Rails gem中(如果您愿意,也可以指向它使用Highcharts核心)。我能够在几个小时内得到一些基本的图表......一个巨大的优点是我没有编写任何JavaScript来使它工作。我必须编写一些SQL来正确地生成数据标签,因为我所提取的数据分布在多个表中。
祝你好运!答案 4 :(得分:1)
您应该使用Javascript作为图表。您可以在技术上使用Rails和一些HTML / CSS创建它们,但您的视图会有点复杂。
我认为最好的方法是使用Rails呈现JSON数据,然后将该JSON数据导入JS库(如Flot)以呈现实际图形。