Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html>
  <head>
    <!-- 利用Google Visualization讀取Google Sheet https://www.labnol.org/code/google-sheet-d3js-visualization-200608 -->
    <script src="https://www.gstatic.com/charts/loader.js"></script>
    
    <script>
    
    // https://developers.google.com/chart/interactive/docs/quick_start
    // Load the Visualization API and the corechart package.
    google.charts.load('current', {'packages':['corechart']});
​
    // Set a callback to run when the Google Visualization API is loaded.   
    google.charts.setOnLoadCallback(init);
​
    function init() {
      // 這個例子使用的試算表是 https://docs.google.com/spreadsheets/d/1QScI5d56Kh-LGywY4WR6EvRGPcalFQYUAdqMxbFVDvk/copy
      // 將上述試算表另存副本後，你要在自己的雲端硬碟將該試算表設定成[知道連結的使用者都能查看]。
      // 然後讓程式讀取 https://docs.google.com/spreadsheets/d/瀏覽器網址列上的網址擷取序號部分/gviz/tq?sheet=工作表名稱
      // 也就是將下列的 1QScI5d56Kh-LGywY4WR6EvRGPcalFQYUAdqMxbFVDvk 更換成自己的檔案序號，以及最後部分指讀取哪個工作表。
      var url =
        'https://docs.google.com/spreadsheets/d/1QScI5d56Kh-LGywY4WR6EvRGPcalFQYUAdqMxbFVDvk/gviz/tq?sheet=工作表1';
      var query = new google.visualization.Query(url);
      query.setQuery("select * where A contains '李四'");
      query.send(processSheetsData);
    }   
    
    function processSheetsData(response) {
      var data = response.getDataTable();
      var columns = data.getNumberOfColumns();
      var rows = data.getNumberOfRows();
​
      var str = "";
      for (var r=0 ; r<rows ; r++) {
          str += data.getFormattedValue(r,0) + "(" +  data.getFormattedValue(r,1) + ")" + " 訂 " +  data.getFormattedValue(r,2) + " : " + data.getFormattedValue(r,3) + "個 <br />";
      }
      document.getElementById("demo").innerHTML = str;
    }
    
    </script>   
  </head>
​
  <body>
    <div id="demo"></div>
  </body>
​
</html>
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers