0

我在原始 HTML 文件中成功使用了以下代码：

<html>
  <head>
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript">
      google.load("visualization", "1", {packages:["corechart"]});
      google.setOnLoadCallback(drawChart);
      function drawChart() {
        var data = google.visualization.arrayToDataTable([
          ['Month', '2010', '2011', '2012'],
          ['Jun',  3139285, 3266244, 3121214],
          ['Jul',  3531094, 3349940, 3214951],
          ['Aug',  3231183,  3406815, 3335187],
        ]);
        var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
            chart.draw(
              data,
              {vAxis: {minValue: 500000, maxValue: 4000000}}
            );
      }
    </script>
  </head>
  <body>
    <div id="chart_div" style="width: 450px; height: 250px;"></div>
  </body>
</html>

但是当我尝试以下列方式在 Rails 站点页面中使用相同的技术时，我无法让它工作：

index.html.erb：

<% content_for :head do %>
  <script type="text/javascript" src="https://www.google.com/jsapi"></script>
  <script type="text/javascript">
    google.load("visualization", "1", {packages:["corechart"]});
    google.setOnLoadCallback(drawChart);
    function drawChart() {
      var data = google.visualization.arrayToDataTable([
        ['Month', '2010', '2011', '2012'],
        ['Jun',  3139285, 3266244, 3121214],
        ['Jul',  3531094, 3349940, 3214951],
        ['Aug',  3231183,  3406815, 3335187],
      ]);
      var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
          chart.draw(
            data,
            {vAxis: {minValue: 500000, maxValue: 4000000}}
          );
    }
  </script>
<% end %>
...
<div id="chart_div" style="width: 317px; height: 250px;"></div>

应用程序.html.erb：

<head>
  ...
  <%= yield :head if yield :head %>
  ...
</head>

我不确定我在这里做错了什么。关于使用 Google Charts API，我有什么遗漏吗？我已经阅读了文档，但找不到任何理由说明为什么它不能像在原始 HTML 文件中那样工作。

4

0 回答 0