If I put my icon image in the directory where the HTML page is the following works.
var img = new google.maps.MarkerImage("icon.png");
It also works if I put it in a folder.
var img = new google.maps.MarkerImage("foldername/icon.png");
But I cannot get the following to work.
var img = new google.maps.MarkerImage("C:/foldername/icon.png");
How do you write the address when the image is not within the folder where the page is?
The URL of the icon must be publicly available on the web (your C: drive isn't).
Something like: http://<yourdomainname>/foldername/icon.png should work.
Related
I'm trying to build a website using Google App Script where I copy all elements from my google form and show it in my own website. I was able to get the details of all elements using : https://developers.google.com/apps-script/reference/forms except for the Image elements.
This link doesn't have the information to get the image URL :
https://developers.google.com/apps-script/reference/forms/image-item
I was able to fetch the BLOB but I couldn't fetch the image URL.
For example in the screenshot, I need the highlighted URL of the image in my form : https://lh6.googleusercontent.com/uZtoCzoraW7vkkrN2289pX83Y6wwaRmMjpgBySWHaT3Vm2p9DVAA7Voy4CclYp2hve6c6zzzLkh-rF1yAX9fFPTTd940WMjwVtjcyMF2XCbdQ7YKQhhCfYxSUyKztcKacWCitDy4C31f9lQ
I need the URL of the image to add in the source tag of my website.
Is there a method in google app script that can fetch me the URL of an image/video.
Solution
After taking a further look to your question, I found out I could use the Blob onject you get from the form image to create a drive file which then can be used to get its webContentLink url to be used in the web app using the Drive API.
To be able to use the Drive API in your Apps Scrip script please, in your script editor go to Resources -> Advanced Cloud Services and enable the Drive API in the dialog that will pop up.
This is the piece of code I have used for achieving what you aimed for with self explanatory comments (this is a simplified web app that only focuses on achieving your purpose):
Code.gs file
// Apps SCript function to serve the HTML file in the web
function doGet() {
return HtmlService.createHtmlOutputFromFile('test');
}
// Function to be called in the HTML that returns the URL to be used by the image tag
function getUrl() {
var form = FormApp.getActiveForm();
// Get image blob
var image = form.getItems()[0].asImageItem().getImage().getAs('image/jpeg');
// Use the image blob for creating a new drive file
var file = DriveApp.createFile(image);
// Use the Drive API get method to get the property webContentLink which will return the link
// of the image to be used in a website
var fileURL = Drive.Files.get(file.getId()).webContentLink;
return fileURL;
}
index.html
<!DOCTYPE html>
<html>
<head>
<base target="_top">
</head>
<body id="body">
<h1>MY IMAGE</h1>
<script>
// Get what our function getURL returns
google.script.run.withSuccessHandler(function(URL) {
// Create HTML image tag
var img = document.createElement('img');
// Set its source to our file's sharable URL
img.src = URL;
// Attach image element to the body
document.getElementById('body').appendChild(img);
}).getURL();
</script>
</body>
</html>
I hope this has helped you. Let me know if you need anything else or if you did not understood something. :)
I have an R markdown document which is created using a shiny app, saved as a HTML. I have inserted a logo in the top right hand corner of the output, which has been done using the following code:
<script>
$(document).ready(function() {
$head = $('#header');
$head.prepend('<img src=\"FILEPATH/logo.png\" style=\"float: right;padding-right:10px;height:125px;width:250px\"/>')
});
</script>
However, when I save the HTML output and share the output, of course the user cannot see the logo since the code is trying to find a file path which will not exist on their computer.
So, my question is - is there a way to include the logo in the output without the use of file paths? Ideally I don't want to upload the image to the web, and change the source to a web address.
You can encode an image file to a data URI with knitr::image_uri. If you want to add it in your document, you can add the html code produced by the following command in your header instead of your script:
htmltools::img(src = knitr::image_uri("FILEPATH/logo.png"),
alt = 'logo',
style = 'float: right;padding-right:10px;height:125px;width:250px')
I can't seem to figure out why my image which lives in AWS is not displaying in my HTML. I'ts simply displaying a white image with the small icon in the top right noting there is no image found (And no alt attribute).
If this is the URL to the image:
https://s3.amazonaws.com/mng-moment/test/PA/40.0103647%2C-75.2625353_1492304397972.jpg
Then shouldn't the img src be
https://s3.amazonaws.com/mng-moment/test/PA/40.0103647,-75.2625353_1492304397972.jpg
I have also tried to match the URL exactly. I tried to print out in the HTML exactly what is in the img src. I tried to take out the extension along with other miscellaneous things.
I have done some research on this and it seems like I'm doing it correctly, although clearly i'm not. Any idea what is wrong here?
Thanks for any and all help.
EDIT:
This is the code where I create the object to upload:
var blob = new Blob([dataURItoBlob(picture)], {type: 'image/jpg'});
var file = new File([blob], moment.location);
return core.upload(moment.key, moment);
I figured this out. It was this thing:
var blob = new Blob([dataURItoBlob(picture)], {type: 'image/jpg'});
var file = new File([blob], moment.location);
return core.upload(moment.key, moment);
I was foolishly not passing in the file into my upload function even though I went through the trouble of creating it. It must've been a refactoring mistake I made.
I have been scripting a few ways to make my Google site easier to manage by dynamically creating pages. I want to be able to create a directory with links to those pages.
So i was thinking something like...
var page = site.getChildByName("NEW URL");
var link = [page.getUrl()];
page = site.getChildByName("URL TO DIRECTORY").addListItem(link);
...using google apps scripts. Haven't tested this too thoroughly as of yet but it haven't been able to get the links to work in the list. I was hoping to just keep the page template as a normal webpage.
If I went that route would editing the html be the only option? Hopefully there is an easier way.
Any ideas would be great. Thanks!
here is a small test that shows a list of all the pages in your site
function doGet() {
var app=UiApp.createApplication().setTitle("Directory of this site")
var mainPanel = app.createAbsolutePanel().setStyleAttributes({background:'beige',padding:'20px'});
var scroll = app.createScrollPanel().setPixelSize(450,300);
var site = SitesApp.getSiteByUrl('https://sites.google.com/site/appsscriptexperiments/')
var pages = site.getAllDescendants()
var grid = app.createGrid(pages.length,2).setWidth(400)
for(n=0;n<pages.length;++n){
grid.setText(n, 0, pages[n].getName()).setWidget(n, 1, app.createAnchor('open', pages[n].getUrl()))
}
app.add(mainPanel.add(scroll.add(grid)))
return app
}
I suppose you know ho to use it in your sitepage but just for info for anyone else : you have to go to manage site > script apps > create a new script > save a version > deploy with appropriate authorizations and finally return to your page and insert it as a gadget (better with a border and a size of 450x300, personal pov ^^) . You can also use it as a standalone webapp using its deploy url.
I am making a chrome extension for pdf links
function getD(info, tab)
{
var url = info.srcUrl;
var sb = "http://www.abcfadsds.com/?url="+info.linkUrl;
chrome.tabs.create({"url":sb});
}
Now this works for most links but if a right click a link on google / facebook
the url generated is something like
http://www.google.co.in/url?sa=t&rct=j&q=pdf&source=web&cd......................
how do i obtain the original URL??
Usually its a variable in the url. For instance in a google links youll see something like....
url=http%3A%2F%2Fwww.aaa.com%2F
...so you just need to get the value for url from the link and unescape it.
Theres a great bit of JS for parsing a url here...
http://blog.stevenlevithan.com/archives/parseuri
...using that you could do (for a google link)...
url = parseUri('http://www.google.com/url?sa=t&rct=j&q=&esrc=s&source=web&cd=1&ved=0CDMQFjAA&url=http%3A%2F%2Fwww.aaa.com%2F&ei=g2p1T4u6HcSoiAeO8-DYDg&usg=AFQjCNECtBRRPOF1ooUuuMtNR5y7DSChGQ');
link = unescape(url.queryKey.url);