I'm trying to use Google Sheets document as read-only database for my angular application.
I tried some methods to do that, but the problem with all of these methods is that they require the Sheet to be shared publicly (anyone with the link can access the sheet). But what I want is to share it with specific user using Service Account through credentials.
I'm using Angular 14
There is no reference to Angular in Google Sheets for Developers.
If you know any solution or come across an article about this topic, please share it with me.
Thank you.
Here are the steps you'll need to take in order to read from Google Sheets into Angular:
Step 1: Prepare your Google Sheet
1.) Make sure ALL the cells in your sheet are formatted as "Plain text". To do this, click in the upper-left corner of the sheet nexus where the rows and columns intersect to select all cells, then select Format > Number > Plain text from the top menu.
2.) Go to Share, then under "General Access", select "Anyone with the link", then click Done. I believe in your case that this step is optional, since you do not want the sheet to be public.
3.) Go to File > Share > Publish to web in the top menu. Set the scope of what you want to publish, then click Publish. Unfortunately in your case, this step is NOT optional!
Step 2: Fetch the Google Sheet Data
Use the following code example to fetch the raw data from your Google Sheet as plain text:
const docId = '1vLjJqvLGdaS39ccsvoU58kEWXngzV_VXtto07Ki6qVo';
const sheetId = ''; // to get a specific sheet by ID, use '&gid=###'
const url = `https://docs.google.com/spreadsheets/d/${docId}/gviz/tq?tqx=out:json${sheetId}`;
this.http.get(url, {
responseType: 'text',
}).subscribe((response: string): void => {
console.log(response);
});
Step 3: Parse the Raw Text as JSON
Use the following example to parse the raw text to JSON:
const rawJSONText = response.match(/google\.visualization\.Query\.setResponse\(([\s\S\w]+)\)/); // strip the header response
const json = JSON.parse(rawJSONText[1]);
console.log(json);
Hope this helps. Cheers!
my code:
function d3_chart() {
// sample data array
// instantiate d3plus
var visualization = d3plus.viz()
.container("#viz") // container DIV to hold the visualization
.data("./extra/acc.csv", {"filetype": "csv"}) // data to use with the visualization
.type("line") // visualization type
.y("x") // key to use for y-axis
.x("timestamp") // key to use for x-axis
.draw() // finally, draw the visualization!
}
my csv:
timestamp,x,y,z
0,2019-02-28 12:20:19.631,1.072,-0.153,10.113
1,2019-02-28 12:20:19.731,1.072,-0.153,10.419
2,2019-02-28 12:20:19.831,1.072,-0.153,9.96
3,2019-02-28 12:20:19.931,1.072,-0.153,10.113
4,2019-02-28 12:20:20.031,1.072,-0.153,10.113
5,2019-02-28 12:20:20.132,1.225,-0.153,9.96
6,2019-02-28 12:20:20.231,1.225,-0.153,9.96
7,2019-02-28 12:20:20.331,1.225,-0.153,9.96
8,2019-02-28 12:20:20.431,0.919,-0.306,9.5
9,2019-02-28 12:20:20.531,0.919,0.459,9.807
10,2019-02-28 12:20:20.631,1.225,0.153,10.113
11,2019-02-28 12:20:20.731,1.379,-1.992,10.113
12,2019-02-28 12:20:20.831,1.838,-0.306,9.653
13,2019-02-28 12:20:20.931,0.153,0.766,10.113
14,2019-02-28 12:20:21.032,0.459,1.532,10.266
15,2019-02-28 12:20:21.133,1.072,0.0,9.96
I just got getting message:
No Data Available
What is wrong? I don't find any example in internet with csv loading via this library
Or something know how graph chart from csv via general D3 with simple example?
d3plus seems to be using v3.5.15 of d3.js. Regardless of that, you will need to tell d3plus of how to load the data. Reading the API documentation it seems you will have to load the data using
d3plus.dataLoad(path, [formatter], [key], [callback]) as explained here.
Alternatively, you can use d3.js to parse your csv file and pass it as the data. To do this you can use the
d3.csv.parse(string[, accessor]) as provided in the d3.js CSV API.
Keep in mind in both cases you will need to format your timestamps in the correct time format (For d3.js Time Format API doc), for you to be able to use the time scales. Also at least for d3.js when the data is parsed from CSV all values are string values and hence you will need to change the type of the values using an type conversion function. You can read more about this in a great guide on how to read data by Learnjsdata (d3.js v3, or d3.js v5)
There are several examples out there for d3.js v3 on importing the data for processing which may be a better option overall. Also consider d3plus has not got a github commit in over a year so the library may not be well supported.
I hope this helps and at least gives you a start. If you need more help please leave a comment below.
I am retrieving a Google Calendar Resource via their Data API, which returns the following content:
<?xml version="1.0" encoding="utf-8"?>
<atom:entry xmlns:atom="http://www.w3.org/2005/Atom" xmlns:apps="http://schemas.google.com/apps/2006">
<apps:property name='resourceId' value='CR-NYC-14-12-BR'/>
<apps:property name='resourceCommonName' value='Boardroom'/>
<apps:property name='resourceDescription' value='Conference room in New York city, building 14, floor 12, Boardroom'/>
<apps:property name='resourceType' value='CR'/>
</atom:entry>
I need to get the value of one of the fields, such as resourceId and store it in a variable. How can I parse this and obtain that value? I am using Meteor JS on the server side, which uses JavaScript. Therefore, the answer needs to use JavaScript. Thank you!
For converting xml to json use: https://github.com/buglabs/node-xml2json
parser.toJson(xml, options);
Then it's simply the issue of iterating over the values.
In my Angular 1.2.18 app, I have an array of objects consisting of a location name and latitude/longitude coordinate pair. I would like to generate a KML file consisting of a list of Placemarks corresponding to this array.
It seems like a good opportunity to use Angular's $compile service to generate the KML, but for some reason, the ng-repeat directive intended to generate the Placemarks is interpreted as a #comment node in the Angular linkFn.
My KML export function is as follows:
$scope.export = function() {
$http({method: 'GET', url: 'templates/kml_export.xml'}).
success(function(data/*, status, headers, config*/) {
var element = angular.element(data);
var linkFn = $compile(element);
var result = linkFn($scope);
$log.debug(result);
}).
error(function(data, status/*, headers, config*/) {
$log.error('error while retrieving KML export template: ' + status);
$log.error(data);
}
);
};
My kml_export.xml template is as follows:
<?xml version="1.0" encoding="UTF-8"?>
<kml xmlns="http://www.opengis.net/kml/2.2">
<Document>
<name>My KML Document</name>
<open>1</open>
<Folder>
<name>Exported Locations</name>
<description>Placemarks generated from saved locations</description>
<Placemark ng-repeat="location in $storage.savedLocations">
<name>{{location.title}}</name>
<description>{{location.notes}}</description>
<Point>
<coordinates>{{location.coordinate.longitude}},{{location.coordinate.latitude}},0</coordinates>
</Point>
<LookAt>
<range>{{rangeOf(location.zoomLevel)}}</range>
<longitude>{{location.coordinate.longitude}}</longitude>
<latitude>{{location.coordinate.latitude}}</latitude>
<altitude>0</altitude>
<heading>0</heading>
<tilt>0</tilt>
<altitudeMode>clampToGround</altitudeMode>
</LookAt>
</Placemark>
</Folder>
</Document>
</kml>
$scope.$storage.savedLocations is the array of location objects, each with the properties referenced in the KML template (e.g. .title, .notes, .coordinate etc.). The $scope.export() function is called in my controller. (Yes, I'm doing DOM manipulation in the controller, sort of, but I never want to render the result in the browser, so a directive doesn't seem a suitable approach.)
In Chrome, outputting result to the console always gives the following:
I'd expected that the ng-repeat directive would have been expanded to complete the template with the data from $storage.savedLocations.
Any pointers much appreciated.
<script language="javascript" >
function GetData(cell,row){
var excel = new ActiveXObject("Excel.Application");
var excel_file = excel.Workbooks.Open("I:Work/database/72550.xls");
var excel_sheet = excel.Worksheets("CA 2012-2013 HMO Plans");
var data = excel_sheet.Cells(cell,row).Value;
document.getElementById('div1').innerText =data;
}
</script>
<input type="button" value="Hearing Services" onClick="GetData(45,2);" />
This is all in a table but I didn't think it was nec to display that, and of course file names are changed. All I need to know is how to pull from two cells at once from the same work sheet to display on a webpage. I got it working put only from one cell. How can I add another cell data to my result text?
is easier to take all the information inside a database, and do a cross join, as you usuing java, i recommend you use oracle, and so a simple cross join, depends on the head text of your excel sheets.
inside your code use odbc connection, you can simple get the connection part if you connect your database inside the sql developer.