Home > Net >  Can I display google sheet data on my site? with out use embed <iframe > tag its boor
Can I display google sheet data on my site? with out use embed <iframe > tag its boor

Time:09-26

I have 1 sheet in google I want to show it in page HTML out google such as free hosting or others! I use Embed in tag but look table it's very boor. I want to show data by code! I try to connect to google sheet but I can't. Is this available? Or am I doing the impossible? Who can explain it to me? Can I do that with excel!

CodePudding user response:

Inside your html page, create

<div id="json">json here</div>

then add this javascript to retrieve data by json end point (I leave an ID and GID of mines, change as necessary)

var id = '1n-rjSYb63Z2jySS3-M0BQ78vu8DTPOjG-SZM4i8IxXI';
var gid = '0';
var url = 'https://docs.google.com/spreadsheets/d/' id '/gviz/tq?tqx=out:json&tq&gid=' gid;
fetch(url)
  .then(response => response.text())
  .then(data => document.getElementById("json").innerHTML=myItems(data.substring(47).slice(0, -2))  
  );
function myItems(jsonString){
  var json = JSON.parse(jsonString);
  var table = '<table><tr>'
  json.table.cols.forEach(colonne => table  = '<th>'   colonne.label   '</th>')
  table  = '</tr>'
  json.table.rows.forEach(ligne => {
    table  = '<tr>'
    ligne.c.forEach(cellule => {
        try{var valeur = cellule.f ? cellule.f : cellule.v}
        catch(e){var valeur = ''}
        table  = '<td>'   valeur   '</td>'
      }
    )
    table  = '</tr>'
    }
  )
  table  = '</table>'
  return table
}

tested here enter image description here

enter image description here

again thank you.

[![enter image description here][1]][1]

enter image description here link here: https://codepen.io/ahmad66377/pen/powxxRe

  • Related