Google sheet có thể vẽ đồ thị không?

Google Charts và Google Spreadsheets được tích hợp chặt chẽ. Bạn có thể đặt Biểu đồ Google bên trong Bảng tính Google và Biểu đồ Google có thể trích xuất dữ liệu từ Bảng tính Google. Tài liệu này chỉ cho bạn cách thực hiện cả hai

Nội dung chính Show

Nhúng biểu đồ vào bảng tính
Tạo biểu đồ từ bảng tính riêng
Phạm vi nguồn truy vấn
ủy quyền
Thí dụ. Sử dụng OAuth để truy cập /gviz/tq
Sử dụng ổ đĩa. phạm vi tập tin
Google có công cụ vẽ đồ thị không?
Google Trang tính có giấy biểu đồ không?

Cho dù bạn chọn phương pháp nào, biểu đồ của bạn sẽ thay đổi bất cứ khi nào bảng tính bên dưới thay đổi

Nhúng biểu đồ vào bảng tính

Bao gồm một biểu đồ trong một bảng tính thật dễ dàng. Từ thanh công cụ Bảng tính, chọn "Chèn" rồi chọn "Biểu đồ" và bạn sẽ có thể chọn loại biểu đồ và chọn các tùy chọn khác nhau

Tạo biểu đồ từ bảng tính riêng

Thông thường, mọi người tạo Google Charts bằng cách điền vào bảng dữ liệu và vẽ biểu đồ bằng dữ liệu đó. Thay vào đó, nếu bạn muốn truy xuất dữ liệu từ Bảng tính Google, bạn sẽ truy vấn bảng tính để truy xuất dữ liệu được lập biểu đồ

function drawChart() {
  var query = new google.visualization.Query(URL);
  query.send(handleQueryResponse);
}

function handleQueryResponse(response) {
  var data = response.getDataTable();
  var chart = new google.visualization.ColumnChart(document.getElementById('columnchart'));
  chart.draw(data, null);
}

Điều này hoạt động vì Bảng tính Google hỗ trợ ngôn ngữ truy vấn Google Charts để sắp xếp và lọc dữ liệu;

Lưu ý rằng các biểu đồ không thể sử dụng các đặc quyền của người xem chúng mà không có sự cho phép rõ ràng. Bảng tính phải hiển thị với mọi người hoặc trang phải có được thông tin xác thực của người dùng cuối một cách rõ ràng như được ghi lại trong phần của trang này

Để sử dụng Bảng tính Google làm nguồn dữ liệu, bạn cần có URL của nó

Mở một bảng tính hiện có. Bảng tính này phải có định dạng mà hình ảnh hóa của bạn mong muốn và bảng tính phải được đặt đúng các đặc quyền xem. (Xem các đặc quyền của "Công khai trên web" hoặc "Bất kỳ ai có liên kết" sẽ dễ dàng nhất và các hướng dẫn trong phần này giả sử một bảng tính đã được thiết lập theo cách này. Bạn có thể hạn chế bằng cách giữ bảng tính ở chế độ "Riêng tư" và cấp cho các tài khoản Google cá nhân quyền truy cập, nhưng bạn sẽ cần làm theo bên dưới)
Sao chép URL từ trình duyệt của bạn. Xem để biết chi tiết về cách chọn phạm vi cụ thể

Cung cấp URL cho

    function drawGID() {
      var queryString = encodeURIComponent('SELECT A, H, O, Q, R, U LIMIT 5 OFFSET 8');

      var query = new google.visualization.Query(
          'https://docs.google.com/spreadsheets/d/1XWJLkAwch5GXAt_7zOFDcg8Wm8Xv29_8PWuuW15qmAE/gviz/tq?gid=0&headers=1&tq=' + queryString);
      query.send(handleQueryResponse);
    }

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

      var data = response.getDataTable();
      var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
      chart.draw(data, { height: 400 });
    }

6. Truy vấn hỗ trợ các tham số tùy chọn sau

    function drawGID() {
      var queryString = encodeURIComponent('SELECT A, H, O, Q, R, U LIMIT 5 OFFSET 8');

      var query = new google.visualization.Query(
          'https://docs.google.com/spreadsheets/d/1XWJLkAwch5GXAt_7zOFDcg8Wm8Xv29_8PWuuW15qmAE/gviz/tq?gid=0&headers=1&tq=' + queryString);
      query.send(handleQueryResponse);
    }

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

      var data = response.getDataTable();
      var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
      chart.draw(data, { height: 400 });
    }

7. Chỉ định có bao nhiêu hàng là hàng tiêu đề, trong đó N là số nguyên bằng 0 hoặc lớn hơn. Chúng sẽ bị loại khỏi dữ liệu và được gán làm nhãn cột trong bảng dữ liệu. Nếu bạn không chỉ định tham số này, bảng tính sẽ đoán có bao nhiêu hàng là hàng tiêu đề. Lưu ý rằng nếu tất cả các cột của bạn là dữ liệu chuỗi, thì bảng tính có thể gặp khó khăn trong việc xác định hàng nào là hàng tiêu đề nếu không có tham số này

    function drawGID() {
      var queryString = encodeURIComponent('SELECT A, H, O, Q, R, U LIMIT 5 OFFSET 8');

      var query = new google.visualization.Query(
          'https://docs.google.com/spreadsheets/d/1XWJLkAwch5GXAt_7zOFDcg8Wm8Xv29_8PWuuW15qmAE/gviz/tq?gid=0&headers=1&tq=' + queryString);
      query.send(handleQueryResponse);
    }

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

      var data = response.getDataTable();
      var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
      chart.draw(data, { height: 400 });
    }

8. Chỉ định trang tính nào trong tài liệu nhiều trang tính sẽ được liên kết tới, nếu bạn không liên kết với trang tính đầu tiên. N là số ID của trang tính. Bạn có thể tìm hiểu số ID bằng cách điều hướng đến phiên bản đã xuất bản của trang tính đó và tìm thông số

    function drawGID() {
      var queryString = encodeURIComponent('SELECT A, H, O, Q, R, U LIMIT 5 OFFSET 8');

      var query = new google.visualization.Query(
          'https://docs.google.com/spreadsheets/d/1XWJLkAwch5GXAt_7zOFDcg8Wm8Xv29_8PWuuW15qmAE/gviz/tq?gid=0&headers=1&tq=' + queryString);
      query.send(handleQueryResponse);
    }

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

      var data = response.getDataTable();
      var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
      chart.draw(data, { height: 400 });
    }

9 trong URL. Bạn cũng có thể sử dụng tham số

    function drawGID() {
      var queryString = encodeURIComponent('SELECT A, H, O, Q, R, U LIMIT 5 OFFSET 8');

      var query = new google.visualization.Query(
          'https://docs.google.com/spreadsheets/d/1XWJLkAwch5GXAt_7zOFDcg8Wm8Xv29_8PWuuW15qmAE/gviz/tq?gid=0&headers=1&tq=' + queryString);
      query.send(handleQueryResponse);
    }

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

      var data = response.getDataTable();
      var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
      chart.draw(data, { height: 400 });
    }

0 thay cho tham số này. Gotcha. Bảng tính Google có thể sắp xếp lại thông số gid trong URL khi được xem trong trình duyệt; . Thí dụ.

    function drawGID() {
      var queryString = encodeURIComponent('SELECT A, H, O, Q, R, U LIMIT 5 OFFSET 8');

      var query = new google.visualization.Query(
          'https://docs.google.com/spreadsheets/d/1XWJLkAwch5GXAt_7zOFDcg8Wm8Xv29_8PWuuW15qmAE/gviz/tq?gid=0&headers=1&tq=' + queryString);
      query.send(handleQueryResponse);
    }

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

      var data = response.getDataTable();
      var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
      chart.draw(data, { height: 400 });
    }

    function drawGID() {
      var queryString = encodeURIComponent('SELECT A, H, O, Q, R, U LIMIT 5 OFFSET 8');

      var query = new google.visualization.Query(
          'https://docs.google.com/spreadsheets/d/1XWJLkAwch5GXAt_7zOFDcg8Wm8Xv29_8PWuuW15qmAE/gviz/tq?gid=0&headers=1&tq=' + queryString);
      query.send(handleQueryResponse);
    }

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

      var data = response.getDataTable();
      var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
      chart.draw(data, { height: 400 });
    }

3. Chỉ định trang tính nào trong tài liệu nhiều trang tính mà bạn đang liên kết tới, nếu bạn không liên kết với trang tính đầu tiên. sheet_name là tên hiển thị của sheet. Thí dụ.

    function drawGID() {
      var queryString = encodeURIComponent('SELECT A, H, O, Q, R, U LIMIT 5 OFFSET 8');

      var query = new google.visualization.Query(
          'https://docs.google.com/spreadsheets/d/1XWJLkAwch5GXAt_7zOFDcg8Wm8Xv29_8PWuuW15qmAE/gviz/tq?gid=0&headers=1&tq=' + queryString);
      query.send(handleQueryResponse);
    }

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

      var data = response.getDataTable();
      var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
      chart.draw(data, { height: 400 });
    }

Đây là một ví dụ hoàn chỉnh

Dưới đây là hai cách để vẽ biểu đồ này, một cách sử dụng tham số

    function drawGID() {
      var queryString = encodeURIComponent('SELECT A, H, O, Q, R, U LIMIT 5 OFFSET 8');

      var query = new google.visualization.Query(
          'https://docs.google.com/spreadsheets/d/1XWJLkAwch5GXAt_7zOFDcg8Wm8Xv29_8PWuuW15qmAE/gviz/tq?gid=0&headers=1&tq=' + queryString);
      query.send(handleQueryResponse);
    }

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

      var data = response.getDataTable();
      var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
      chart.draw(data, { height: 400 });
    }

5 và cách còn lại sử dụng tham số

    function drawGID() {
      var queryString = encodeURIComponent('SELECT A, H, O, Q, R, U LIMIT 5 OFFSET 8');

      var query = new google.visualization.Query(
          'https://docs.google.com/spreadsheets/d/1XWJLkAwch5GXAt_7zOFDcg8Wm8Xv29_8PWuuW15qmAE/gviz/tq?gid=0&headers=1&tq=' + queryString);
      query.send(handleQueryResponse);
    }

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

      var data = response.getDataTable();
      var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
      chart.draw(data, { height: 400 });
    }

0. Nhập một trong hai URL vào trình duyệt sẽ tạo ra cùng một kết quả/dữ liệu cho biểu đồ

GID

    function drawGID() {
      var queryString = encodeURIComponent('SELECT A, H, O, Q, R, U LIMIT 5 OFFSET 8');

      var query = new google.visualization.Query(
          'https://docs.google.com/spreadsheets/d/1XWJLkAwch5GXAt_7zOFDcg8Wm8Xv29_8PWuuW15qmAE/gviz/tq?gid=0&headers=1&tq=' + queryString);
      query.send(handleQueryResponse);
    }

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

      var data = response.getDataTable();
      var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
      chart.draw(data, { height: 400 });
    }

Tờ_______9

Phạm vi nguồn truy vấn

The query source URL specifies what part of a spreadsheet to use in the query: a specific cell, range of cells, rows, or columns, or a whole spreadsheet. Specify the range using the "range=" syntax, for example:

    function drawGID() {
      var queryString = encodeURIComponent('SELECT A, H, O, Q, R, U LIMIT 5 OFFSET 8');

      var query = new google.visualization.Query(
          'https://docs.google.com/spreadsheets/d/1XWJLkAwch5GXAt_7zOFDcg8Wm8Xv29_8PWuuW15qmAE/gviz/tq?gid=0&headers=1&tq=' + queryString);
      query.send(handleQueryResponse);
    }

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

      var data = response.getDataTable();
      var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
      chart.draw(data, { height: 400 });
    }

Dưới đây là một vài ví dụ chứng minh cú pháp

    function drawGID() {
      var queryString = encodeURIComponent('SELECT A, H, O, Q, R, U LIMIT 5 OFFSET 8');

      var query = new google.visualization.Query(
          'https://docs.google.com/spreadsheets/d/1XWJLkAwch5GXAt_7zOFDcg8Wm8Xv29_8PWuuW15qmAE/gviz/tq?gid=0&headers=1&tq=' + queryString);
      query.send(handleQueryResponse);
    }

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

      var data = response.getDataTable();
      var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
      chart.draw(data, { height: 400 });
    }

7 - Một phạm vi từ ô A1 đến B10

    function drawGID() {
      var queryString = encodeURIComponent('SELECT A, H, O, Q, R, U LIMIT 5 OFFSET 8');

      var query = new google.visualization.Query(
          'https://docs.google.com/spreadsheets/d/1XWJLkAwch5GXAt_7zOFDcg8Wm8Xv29_8PWuuW15qmAE/gviz/tq?gid=0&headers=1&tq=' + queryString);
      query.send(handleQueryResponse);
    }

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

      var data = response.getDataTable();
      var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
      chart.draw(data, { height: 400 });
    }

8 - Hàng 5-7

    function drawGID() {
      var queryString = encodeURIComponent('SELECT A, H, O, Q, R, U LIMIT 5 OFFSET 8');

      var query = new google.visualization.Query(
          'https://docs.google.com/spreadsheets/d/1XWJLkAwch5GXAt_7zOFDcg8Wm8Xv29_8PWuuW15qmAE/gviz/tq?gid=0&headers=1&tq=' + queryString);
      query.send(handleQueryResponse);
    }

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

      var data = response.getDataTable();
      var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
      chart.draw(data, { height: 400 });
    }

9 - Cột D-F

    function drawSheetName() {
      var queryString = encodeURIComponent('SELECT A, H, O, Q, R, U LIMIT 5 OFFSET 8');

      var query = new google.visualization.Query(
          'https://docs.google.com/spreadsheets/d/1XWJLkAwch5GXAt_7zOFDcg8Wm8Xv29_8PWuuW15qmAE/gviz/tq?sheet=Sheet1&headers=1&tq=' + queryString);
      query.send(handleSampleDataQueryResponse);
    }

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

      var data = response.getDataTable();
      var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
      chart.draw(data, { height: 400 });
    }

0 - 70 ô đầu tiên trong cột A

    function drawSheetName() {
      var queryString = encodeURIComponent('SELECT A, H, O, Q, R, U LIMIT 5 OFFSET 8');

      var query = new google.visualization.Query(
          'https://docs.google.com/spreadsheets/d/1XWJLkAwch5GXAt_7zOFDcg8Wm8Xv29_8PWuuW15qmAE/gviz/tq?sheet=Sheet1&headers=1&tq=' + queryString);
      query.send(handleSampleDataQueryResponse);
    }

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

      var data = response.getDataTable();
      var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
      chart.draw(data, { height: 400 });
    }

1 - Cột A từ hàng 70 đến hết

    function drawSheetName() {
      var queryString = encodeURIComponent('SELECT A, H, O, Q, R, U LIMIT 5 OFFSET 8');

      var query = new google.visualization.Query(
          'https://docs.google.com/spreadsheets/d/1XWJLkAwch5GXAt_7zOFDcg8Wm8Xv29_8PWuuW15qmAE/gviz/tq?sheet=Sheet1&headers=1&tq=' + queryString);
      query.send(handleSampleDataQueryResponse);
    }

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

      var data = response.getDataTable();
      var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
      chart.draw(data, { height: 400 });
    }

2 - B5 đến cuối hàng 5

    function drawSheetName() {
      var queryString = encodeURIComponent('SELECT A, H, O, Q, R, U LIMIT 5 OFFSET 8');

      var query = new google.visualization.Query(
          'https://docs.google.com/spreadsheets/d/1XWJLkAwch5GXAt_7zOFDcg8Wm8Xv29_8PWuuW15qmAE/gviz/tq?sheet=Sheet1&headers=1&tq=' + queryString);
      query.send(handleSampleDataQueryResponse);
    }

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

      var data = response.getDataTable();
      var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
      chart.draw(data, { height: 400 });
    }

3 - D3 đến cuối cột D

    function drawSheetName() {
      var queryString = encodeURIComponent('SELECT A, H, O, Q, R, U LIMIT 5 OFFSET 8');

      var query = new google.visualization.Query(
          'https://docs.google.com/spreadsheets/d/1XWJLkAwch5GXAt_7zOFDcg8Wm8Xv29_8PWuuW15qmAE/gviz/tq?sheet=Sheet1&headers=1&tq=' + queryString);
      query.send(handleSampleDataQueryResponse);
    }

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

      var data = response.getDataTable();
      var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
      chart.draw(data, { height: 400 });
    }

4 - Từ đầu cột C đến C10

ủy quyền

Google Trang tính yêu cầu thông tin đăng nhập của người dùng cuối để truy cập bảng tính riêng tư thông qua Google Visualization API ("/tq requests")

Ghi chú. Bảng tính được chia sẻ cho "bất kỳ ai có liên kết đều có thể xem" không yêu cầu thông tin xác thực. Thay đổi cài đặt chia sẻ của bảng tính của bạn dễ dàng hơn nhiều so với việc triển khai ủy quyền

Đối với những trường hợp chia sẻ liên kết không phải là giải pháp khả thi, nhà phát triển sẽ cần thay đổi mã của họ để chuyển sang OAuth 2. 0 chứng chỉ được ủy quyền cho phạm vi API Google Trang tính (https. //www. googleapis. com/auth/bảng tính)

Thông tin cơ bản khác về OAuth 2. 0 có sẵn trong Sử dụng OAuth 2. 0 để truy cập Google API

Thí dụ. Sử dụng OAuth để truy cập /gviz/tq

Điều kiện tiên quyết. Nhận ID khách hàng từ Bảng điều khiển dành cho nhà phát triển của Google

Bạn có thể tìm thấy hướng dẫn chi tiết hơn về cách tích hợp với Nền tảng nhận dạng của Google tại Đăng nhập bằng Google và Tạo dự án Google API Console và ID ứng dụng khách

Để có được mã thông báo OAuth cho người dùng cuối, trước tiên bạn phải đăng ký dự án của mình với Bảng điều khiển dành cho nhà phát triển của Google và lấy ID khách hàng

Từ bảng điều khiển dành cho nhà phát triển, hãy tạo ID ứng dụng khách OAuth mới
Chọn ứng dụng Web làm loại ứng dụng của bạn
Chọn bất kỳ tên nào;
Thêm tên miền của bạn (và bất kỳ miền thử nghiệm nào) làm Nguồn gốc JavaScript được ủy quyền
Để trống URI chuyển hướng được ủy quyền

Sau khi nhấp vào Tạo, hãy sao chép ID khách hàng để tham khảo sau này. Bí mật khách hàng là không cần thiết cho bài tập này

Cập nhật trang web của bạn để có được thông tin đăng nhập OAuth

Google cung cấp thư viện

    function drawSheetName() {
      var queryString = encodeURIComponent('SELECT A, H, O, Q, R, U LIMIT 5 OFFSET 8');

      var query = new google.visualization.Query(
          'https://docs.google.com/spreadsheets/d/1XWJLkAwch5GXAt_7zOFDcg8Wm8Xv29_8PWuuW15qmAE/gviz/tq?sheet=Sheet1&headers=1&tq=' + queryString);
      query.send(handleSampleDataQueryResponse);
    }

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

      var data = response.getDataTable();
      var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
      chart.draw(data, { height: 400 });
    }

5 giúp đơn giản hóa đáng kể quy trình lấy chứng chỉ OAuth. Mẫu mã bên dưới sử dụng thư viện này để lấy thông tin xác thực (yêu cầu ủy quyền nếu cần) và chuyển thông tin xác thực kết quả tới điểm cuối /gviz/tq

thử nghiệm. html

    function drawGID() {
      var queryString = encodeURIComponent('SELECT A, H, O, Q, R, U LIMIT 5 OFFSET 8');

      var query = new google.visualization.Query(
          'https://docs.google.com/spreadsheets/d/1XWJLkAwch5GXAt_7zOFDcg8Wm8Xv29_8PWuuW15qmAE/gviz/tq?gid=0&headers=1&tq=' + queryString);
      query.send(handleQueryResponse);
    }

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

      var data = response.getDataTable();
      var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
      chart.draw(data, { height: 400 });
    }

0bản trình diễn. js

    function drawGID() {
      var queryString = encodeURIComponent('SELECT A, H, O, Q, R, U LIMIT 5 OFFSET 8');

      var query = new google.visualization.Query(
          'https://docs.google.com/spreadsheets/d/1XWJLkAwch5GXAt_7zOFDcg8Wm8Xv29_8PWuuW15qmAE/gviz/tq?gid=0&headers=1&tq=' + queryString);
      query.send(handleQueryResponse);
    }

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

      var data = response.getDataTable();
      var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
      chart.draw(data, { height: 400 });
    }

Sau khi ủy quyền thành công,

    function drawSheetName() {
      var queryString = encodeURIComponent('SELECT A, H, O, Q, R, U LIMIT 5 OFFSET 8');

      var query = new google.visualization.Query(
          'https://docs.google.com/spreadsheets/d/1XWJLkAwch5GXAt_7zOFDcg8Wm8Xv29_8PWuuW15qmAE/gviz/tq?sheet=Sheet1&headers=1&tq=' + queryString);
      query.send(handleSampleDataQueryResponse);
    }

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

      var data = response.getDataTable();
      var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
      chart.draw(data, { height: 400 });
    }

6 sẽ trả lại tất cả các chi tiết thông tin xác thực, bao gồm cả

    function drawSheetName() {
      var queryString = encodeURIComponent('SELECT A, H, O, Q, R, U LIMIT 5 OFFSET 8');

      var query = new google.visualization.Query(
          'https://docs.google.com/spreadsheets/d/1XWJLkAwch5GXAt_7zOFDcg8Wm8Xv29_8PWuuW15qmAE/gviz/tq?sheet=Sheet1&headers=1&tq=' + queryString);
      query.send(handleSampleDataQueryResponse);
    }

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

      var data = response.getDataTable();
      var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
      chart.draw(data, { height: 400 });
    }

7 có thể được thêm vào các yêu cầu /gviz/tq

Để biết thêm thông tin về cách sử dụng thư viện gapi để xác thực, hãy xem

Xác thực bằng Thư viện ứng dụng Google API cho JavaScript
Cách sử dụng CORS để truy cập Google API

Sử dụng ổ đĩa. phạm vi tập tin

Ví dụ trước sử dụng phạm vi API Google Trang tính, cho phép đọc và ghi quyền truy cập vào tất cả nội dung bảng tính của người dùng. Tùy thuộc vào ứng dụng, điều này có thể dễ dãi hơn mức cần thiết. Đối với quyền truy cập chỉ đọc, hãy sử dụng bảng tính. phạm vi chỉ đọc cấp quyền truy cập chỉ đọc vào trang tính của người dùng và thuộc tính của họ

ổ đĩa. phạm vi tệp (https. //www. googleapis. com/auth/ổ đĩa. tệp) chỉ cấp quyền truy cập vào những tệp mà người dùng mở rõ ràng bằng bộ chọn tệp Google Drive, được khởi chạy qua API bộ chọn

Việc sử dụng Bộ chọn sẽ thay đổi quy trình của ứng dụng của bạn. Thay vì dán URL hoặc có bảng tính được mã hóa cứng như trong ví dụ trên, người dùng phải sử dụng hộp thoại Bộ chọn để chọn bảng tính mà họ muốn trang của bạn truy cập. Thực hiện theo , sử dụng

    function drawSheetName() {
      var queryString = encodeURIComponent('SELECT A, H, O, Q, R, U LIMIT 5 OFFSET 8');

      var query = new google.visualization.Query(
          'https://docs.google.com/spreadsheets/d/1XWJLkAwch5GXAt_7zOFDcg8Wm8Xv29_8PWuuW15qmAE/gviz/tq?sheet=Sheet1&headers=1&tq=' + queryString);
      query.send(handleSampleDataQueryResponse);
    }

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

      var data = response.getDataTable();
      var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
      chart.draw(data, { height: 400 });
    }

8 thay cho

    function drawSheetName() {
      var queryString = encodeURIComponent('SELECT A, H, O, Q, R, U LIMIT 5 OFFSET 8');

      var query = new google.visualization.Query(
          'https://docs.google.com/spreadsheets/d/1XWJLkAwch5GXAt_7zOFDcg8Wm8Xv29_8PWuuW15qmAE/gviz/tq?sheet=Sheet1&headers=1&tq=' + queryString);
      query.send(handleSampleDataQueryResponse);
    }

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

      var data = response.getDataTable();
      var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
      chart.draw(data, { height: 400 });
    }

Google có công cụ vẽ đồ thị không?

Giới thiệu về Công cụ biểu đồ của Google . Hãy dùng thử bộ sưu tập phong phú các công cụ dữ liệu và biểu đồ tương tác của chúng tôi.

Google Trang tính có giấy biểu đồ không?

Mẫu Google Trang tính được liên kết ở gần đầu trang. Để sử dụng mẫu Google Trang tính và in giấy kẻ ô vuông , hãy làm theo các hướng dẫn sau. Nhấp vào liên kết đến mẫu, sau đó nhấp vào “Sử dụng Mẫu” Nhấp vào tab có giấy biểu đồ mà bạn muốn in.

programming sheet

Google sheet có thể vẽ đồ thị không?

Nhúng biểu đồ vào bảng tính

Tạo biểu đồ từ bảng tính riêng

Phạm vi nguồn truy vấn

ủy quyền

Thí dụ. Sử dụng OAuth để truy cập /gviz/tq

Điều kiện tiên quyết. Nhận ID khách hàng từ Bảng điều khiển dành cho nhà phát triển của Google

Cập nhật trang web của bạn để có được thông tin đăng nhập OAuth

Sử dụng ổ đĩa. phạm vi tập tin

Google có công cụ vẽ đồ thị không?

Google Trang tính có giấy biểu đồ không?

Bài Viết Liên Quan

Quảng Cáo

Có thể bạn quan tâm

Toplist được quan tâm

Quảng cáo

Xem Nhiều

Quảng cáo

Chúng tôi

Điều khoản

Trợ giúp

Mạng xã hội