繁体   English   中英

显示带有分析数据的Google图表

[英]Displaying Google Charts with Analytics Data

我正在尝试显示不同类型的图,然后Google嵌入API将允许(带有趋势线的散点图),因此我尝试添加Google可视化API的某些功能,但现在除了空白页。 我觉得我只是在这里缺少一些基本的东西。 我在下面的Rails应用程序中包含了完整的HTML文件。

   <% if user_signed_in? %>

   <script>
      (function(w,d,s,g,js,fs){
        g=w.gapi||(w.gapi={});g.analytics={q:[],ready:function(f){this.q.push(f);}};
        js=d.createElement(s);fs=d.getElementsByTagName(s)[0];
        js.src='https://apis.google.com/js/platform.js';
        fs.parentNode.insertBefore(js,fs);js.onload=function(){g.load('analytics');};
      }(window,document,'script'));
  </script>

  <script type="text/javascript" src="https://www.google.com/jsapi"></script>

  <div id="embed-api-auth-container"></div>
  <div id="view-selector-container"></div>

  <script>

    gapi.analytics.ready(function() {

      gapi.analytics.auth.authorize({
        container: 'embed-api-auth-container',
        clientid: '569463958059-27mgpdu206e08j3s463mf33u750cqcrg.apps.googleusercontent.com',
      });



  /**
     * Create a new ViewSelector instance to be rendered inside of an
     * element with the id "view-selector-container".
     */
    var viewSelector = new gapi.analytics.ViewSelector({
      container: 'view-selector-container'
    });

    // Render the view selector to the page.
    viewSelector.execute();




    google.load("visualization", "1", {packages:["corechart"]});
        google.setOnLoadCallback(drawChart);


    function drawChart() {
          var data = new google.visualization.arrayToDataTable([
            query: {
              metrics: 'ga:sessions',
              dimensions: 'ga:date',
              'start-date': '30daysAgo',
              'end-date': 'yesterday'
            },
          });

          var options = {
            trendlines: {
              0: {
                type: 'polynomial',
                degree: 3,
                visibleInLegend: true,
              }
            }
          };

      report.on('success', function(response) {
        console.log(response);
      });

      report.execute();

      var chart = new google.visualization.ScatterChart(document.getElementById('chart_div'));

      viewSelector.on('change', function(ids) {
        chart.draw(data, options);
    });

  });
  </script>




    <% else %>
        <p>
            <%= link_to "Log In", new_user_session_path , class: "btn btn-default" %>
            <%= link_to "Sign up", new_user_registration_path , class: "btn btn-primary" %>
        </p>
    <% end %>


  </div>

暂无
暂无

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

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