нарисовать круговую диаграмму, используя внешний URL-адрес в Google-диаграмме - PullRequest
Новая
       44

нарисовать круговую диаграмму, используя внешний URL-адрес в Google-диаграмме

0 голосов
/ 16 апреля 2019

Я пытаюсь использовать эту электронную таблицу Google , чтобы нарисовать круговую диаграмму с помощью API Google Chart.Я правильно получаю результат запроса обратно.Но, пытаясь сгенерировать таблицу данных, используя результат запроса, я эта ошибка

Как вы можете видеть, я также добавил метки к каждому результату запроса.Но ошибка остается. 

<html>

<head>
  <!--Load the AJAX API-->
  <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
  <script type="text/javascript">
    // Load the Visualization API and the controls package.
    google.charts.load("current", {
      packages: ["corechart"]
    });

    // Set a callback to run when the Google Visualization API is loaded.
    google.charts.setOnLoadCallback(initialize);

    // Callback that creates and populates a data table,
    // instantiates a dashboard, a range slider and a pie chart,
    // passes in the data and draws it.
    function initialize() {
      var opts = {
        sendMethod: "auto"
      };
      // Replace the data source URL on next line with your data source URL.
      var query = new google.visualization.Query(
        "https://docs.google.com/spreadsheets/d/1SfDouyZc9wKj1PGyIXL3rbYKav4oDyRXzxEWDgSIqkY/edit?usp=sharing",
        opts
      );

      // Optional request to return only column C and the sum of column B, grouped by C members.
      // query.setQuery("select sum(G), sum(E),sum(F),sum(G)-sum(J) label sum(G) 'Total Scripts', sum(E) 'New Scripts'\
      // ,sum(F) 'Refills', sum(G)-sum(J) 'Script Lift' ");
      query.setQuery("select sum(G),sum(E) label sum(G) 'Total Scripts', sum(E) 'New Scripts'");
      // Send the query with a callback function.
      query.send(handleQueryResponse);
    }

    function handleQueryResponse(response) {
      if (response.isError()) {
        alert("Error in query: " + response.getMessage() + " " + response.getDetailedMessage());
        return;
      }

      console.log(response);
      // Called when the query response is returned.
      var data = response.getDataTable();
      var chart = new google.visualization.PieChart(document.getElementById("Maestro_script_data_1"));
      chart.draw(data, {
        title: "Script Summary",
        width: 500,
        height: 500,
        pieSliceText: "value",
        legend: "bottom",
        pieHole: 0.3
      });

    }
  </script>
</head>

<body>
  <!--Div that will hold the dashboard-->
  <div id="FirstSummary">
    <table class="columns">
      <tr>
        <td>
          <div id="Maestro_script_data_1" style="border: 1px solid #ccc"></div>
        </td>
        <td>
          <div id="Maestro_script_data_2" style="border: 1px solid #ccc"></div>
        </td>
      </tr>
    </table>
  </div>
</body>

</html>

Будет действительно полезно, если кто-то может помочь мне, как можно решить эту проблему, как правильно отобразить два агрегированных данных, запрашиваемых круговой диаграммой.

...