Question

有谁知道如何在Rails中创建图形。这是因为我需要在rails中读取和显示统计信息，并且在图表中显示统计信息的最佳方式。所以有人能告诉我该怎么做？谢谢！：）

Answer 1

这里有很多选择。为了尝试将内容保存在Ruby中，我建议您查看ruport gem。请注意，Ruport的最新版本是在2007年。

正如Calvin所提到的，其他选项涉及Javascript解决方案。我喜欢有两个库。第一个是D3.js，可以在这里找到：

http://d3js.org/

D3非常灵活，有一些强大的数据处理工具可以处理你的数据，但是它往往需要更多的开发时间来获得更好的东西。

我建议的另一个选项是highcharts：

http://www.highcharts.com/

这个库不像D3那么灵活，但更容易获得一个非常漂亮的图表并快速运行。另一件事是它没有真正拥有D3的数据处理工具。如果您正在寻找简单的东西，我建议您首先尝试使用Highcharts。

Answer 2

我一直在使用名为jqPLot的JavaScript库。它很容易上手 - 基本上，你通过JS初始化图表。但是，在那个JS中你可以使用rails脚本标签＆lt; %%＆gt;构建必要的数据数组以提供购物车。显然还有其他加载数据的方法。

作为一个简单的例子，这将是你的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>

Answer 3

实现此目的的最佳方法是使用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>

Answer 4

我想在我自己的rails应用程序中做一些图表时遇到了你的问题。

我建议您查看Chartkick，http://ankane.github.io/chartkick/

这是相对较新的，所以当你问起原来的问题时就没有了。它将Google图表API包装在一个简单的Rails gem中（如果您愿意，也可以指向它使用Highcharts核心）。我能够在几个小时内得到一些基本的图表......一个巨大的优点是我没有编写任何JavaScript来使它工作。我必须编写一些SQL来正确地生成数据标签，因为我所提取的数据分布在多个表中。

祝你好运！

Answer 5

您应该使用Javascript作为图表。您可以在技术上使用Rails和一些HTML / CSS创建它们，但您的视图会有点复杂。

我认为最好的方法是使用Rails呈现JSON数据，然后将该JSON数据导入JS库（如Flot）以呈现实际图形。

如何在Rails中创建图形？

5 个答案: