This is public spreadsheet created using Google Drive:
https://docs.google.com/spreadsheets/d/1hA4LKZn9yKoqnSzaI6_73GQSj_ZVpB3O0kC93QM98Vs/pubhtml
How to retrieve data from Google Spreadsheet to Javascript or JSON with new Google Spreadsheets API version 3.0 ?
You can access a cell-based basic feed using the following URL structure: https://spreadsheets.google.com/feeds/cells/1hA4LKZn9yKoqnSzaI6_73GQSj_ZVpB3O0kC93QM98Vs/od6/public/basic?alt=json . By default the feed is in XML form, however, you can request JSON format using alt=json query parameter.
This feed also supports JSONP requests, so an example of fetching this data from a browser with jQuery might look like:
var url = "https://spreadsheets.google.com/feeds/cells/1hA4LKZn9yKoqnSzaI6_73GQSj_ZVpB3O0kC93QM98Vs/od6/public/basic?alt=json";
$.ajax({
url:url,
dataType:"jsonp",
success:function(data) {
// data.feed.entry is an array of objects that represent each cell
},
});
If, alternatively, you want to keep it all in the Google environment. if you're looking for a more controlled JSON generator, check out this gist:
JSONPuller
It takes in a Spreadsheet sheet and returns an array of objects, with the row that you decide as the key (defaults to whichever row is frozen)
Cheers,
I made it work using opensheet.
Steps:
Make sure the sheet as read access - Anyone with the link can view it.
Sheet should have First row as Header row with titles
Then get the sheet data as json using the following link - https://opensheet.elk.sh/spreadsheet_id/sheet_name
Replace spreadsheet_id with your sheet id and sheet_name with your sheet name. No authentication is required.
Related
I have a working Google Sheet JSON search engine here:
https://codepen.io/Teeke/pen/gOwgvXQ?editors=0011
It reads this Google sheet:
https://docs.google.com/spreadsheets/d/1c2aJmDdLkbjW0ErfUB0sfiQ-pt6zdW5KWZgREWs0zvM/edit#gid=0
I made an exact copy of the spreadsheet, and didn't change anything:
https://docs.google.com/spreadsheets/d/1WUzfGeyOMVVOb8tbYLqHTrAk7Ii2p6l58EXG-kcgOcY/edit#gid=0
The codepen with the new spreadsheet raises the following error:
The specified GSHEET_JSON_URL does not contain JSON:
https://codepen.io/Teeke/pen/zYKNRpZ?editors=0011
$(function() {
var GSHEET_JSON_URL =
'https://spreadsheets.google.com/feeds/list/1WUzfGeyOMVVOb8tbYLqHTrAk7Ii2p6l58EXG-
kcgOcY/1/public/values?alt=json';
The urls look exactly the same.
Try to access your Google Sheets from an incognito window. Your first sheet is published while your second sheet is not.
I am very new to javascript .. and my teacher provided us with this piece of code along with html and css file which on any date you enter gives you images of mars taken from ISS..
Would anyone care to explain what is happening inside the data: {} and how to get such API URL'S? I mean from where do we get that?
var input_box=$('#div-date input');
var button=$('#div-button button');
var container2=$('#container2');
button.click(function()
{
$.ajax({
method: "GET",
url: "https://api.nasa.gov/mars-photos/api/v1/rovers/curiosity/photos",
data:
{
earth_date:parseInt(input_box.val().split('/')[2]).toString()+"-
"+parseInt(input_box.val().split('/')[1]).toString()+"-
"+parseInt(input_box.val().split('/')[0]).toString(),
api_key:"zrVafsMHD8r1SC8mHyg91mnNguuzdIoPRXGD1BvS"
},
The ajax method is a call to NASA endpoint where you are doing a GET call to the URL. I thinks this is clear.
Now, what does data?
earth_date is a value with the actual date parsed to a specific format. It get the date from the input_box with format 00/00/0000 and parse to format 0000-00-00
api_key is the key you need to authenticate and get the data.
And data itself is the way to send variables into URL. So, your url looks like this:
https://api.nasa.gov/mars-photos/api/v1/rovers/curiosity/photos?earth_date=YOUR_DATE&api_key=YOUR_API_KEY
Note that is compound by:
url+ ?earth_date + api_key.
Updated to answer the question:
The API key is a way to secure the API.
An API key is a way to identify who is calling the endpoint. So only calls that have the API key will be able to reach the endpoint (or whatever the developer want).
Is an string generated by the owner so the only way to get the API key is NASA to give it to you. I suppose NASA give free API keys, but is not a "general string" or something like that. Every organization will secure their apis in a way, NASA provide api keys to reach his 'free' endpoints.
The code in the data transform the date format '30/12/2019' to '2019-12-30' since only the later format is valid for the request.
I am using the Google Sheets API V4 to retrieve its data in JSON like below. That includes all rows, even the ones currently not shown in the Spreadsheet UI because of a filtering in one of the columns.
Is there a way to get only the shown rows or information whether a row is hidden or not?
The Google Apps Script allows such data retrieval using i.e. the .hiddenByFilter Method (see https://cloud.google.com/blog/products/application-development/using-google-sheets-filters-in-add-ons ). However, I am not able to include that in my API Query whatsoever.
$.getJSON("https://sheets.googleapis.com/v4/spreadsheets/" + SpreadsheetID + "/values/Color1!A2:Q?key=<MY_API_KEY>", function(data) {
// data.values contains the array of rows from the spreadsheet. Each row is also an array of cell values.
$(data.values).each(function() {
var location = {};
location.title = this[2];
location.latitude = parseFloat(this[10]);
location.longitude = parseFloat(this[9]);
location.institution = this[3];
//location.hidden = <?>;
locations.push(location);
});
Is there any workaround?
You can use Spreadsheets.get endpoint. Then filter sheets/data/rowData/values using sheets/data/rowMetadata/hiddenByUser field client side.
I need to extract the data from an excel sheet into csv or json format and then display the content in the form of charts(bar, pie and line) using javascript. I have been working on it since 2 days and not able to find any good source. Any help regarding this would be appreciated. Thank you.
You can also pull data from a google spreadsheet as CSV data like this:
var spreadsheet = "https://docs.google.com/spreadsheet/pub?key=youruniquekeyhere&single=true&gid=2&output=csv"
d3.csv(spreadsheet, function (error, data) {
// use your data here
});
Notice the output=csv at the end of that URL.
gid=0 is worksheet 1, gid=1 is worksheet 2 and so on. You must publish your worksheet to the web first to make it available.
In addition to Christophe Viau's tutorials, here are more resources:
https://github.com/mbostock/d3/wiki/Gallery#basic-charts
http://www.d3noob.org
I have a column in a database table that contains several urls and I was wondering what is the best way to get these urls from the database table into a javascript function.
Example code of how to approach this would be much appreciated.
Thanks.
If you can get the URLs into page items via PL/SQL code then you can access the page item values from Javascript like this:
url1 = $v('P1_URL1');
url2 = $v('P1_URL2');
For example, you could have an on-load PL/SQL process like:
select url1, url2
into :p1_url1, :p1_url2
from my_urls
where ...;
To put several URLs into an array you could use the PL/JSON library - see this example. Again, this would be PL/SQL code to put the JSON array into a page item which you can then access from Javascript using v$(). Or you could use AJAX as descrobed here.