14

I basically have small images in a table that I'd like to enlarge on mouse click. I'd like the enlarged image to appear on the center of the page. On mouse click again to remove the enlarged image. I was able to do this on Excel using a VB script that I found, but had no luck in Google Sheets. Is there a way to assign this sort of script to each image?

Similarly to this https://i.stack.imgur.com/NthPR.jpg

Kind Regards,

Alex

Itsuki Productions
  • 143
  • 1
  • 1
  • 4
  • if the image is put with a formula, a custom sidebar or dialog from a custom menu can be used to get image from selection. not possible any other way to get the zoomed image on the same sheet window. – Zig Mandel Sep 22 '15 at 13:22
  • Very disappointing that there is no native handling for this. Either the images are too small to be useful or the rows are too large to be readable. –  May 15 '19 at 13:51

5 Answers5

3

You can have google chrome add-on: Docs Image Zoomer

Test Here: Example

enter image description here

Unnati Solanki
  • 166
  • 11
2

One working with the latest version of Google Docs, in a very effective way, also allowing to download images is: Google Docs Image Zoom

Dan Ortega
  • 1,679
  • 17
  • 13
1

You can assign scripts to images but there's no way (that I can see) for the script to figure out which image is being clicked. Also the script can insert a new image but this one won't have a script assigned to it so we can't make it disappear on click.

I suppose you could assign a script that would open up the image using the HTML service like this:

Enlarge Picture on Click

But you would need to either make a separate function for each image, so it can load the source into the HTML, or identify which image is clicked somehow (I'll have a think but I don't think this can be done).

Edit: Script below. First image should run popUp1 and second image should run popUp2. There might be a more elegant solution for supplying the HTML with the different image URL but this works.

code.gs

function onOpen() {
  var ui = SpreadsheetApp.getUi();
  // Or DocumentApp or FormApp.
  ui.createMenu('Actions')
  .addItem('Authorise', 'Auth')
  .addToUi();
}

function Auth() {
  SpreadsheetApp.getActiveSpreadsheet();
}


function popUp1() {
  var html = HtmlService.createHtmlOutputFromFile('index1')
      .setSandboxMode(HtmlService.SandboxMode.IFRAME);
  html.setHeight(400);
  html.setWidth(600);
  SpreadsheetApp.getUi()
      .showModalDialog(html, 'Image');
}

function popUp2() {
  var html = HtmlService.createHtmlOutputFromFile('index2')
      .setSandboxMode(HtmlService.SandboxMode.IFRAME);
  html.setHeight(400);
  html.setWidth(600);
  SpreadsheetApp.getUi()
      .showModalDialog(html, 'Image');
}

index1.html

<form>
  <div id="closeDiv"><font face="arial" size="1">Click the image to close...</font></div>
  <img src="http://www.hdwallpapersimages.com/wp-content/uploads/2014/01/Winter-Tiger-Wild-Cat-Images-540x303.jpg" alt="DJ BBQ" style="width:540px;height:303px;" onClick="closeImage()">
</form>

<script type="text/javascript">
  function closeImage() {
    google.script.host.close();
  }
</script>

index2.html

<form>
  <div id="closeDiv"><font face="arial" size="1">Click the image to close...</font></div>
  <img src="http://www.keenthemes.com/preview/metronic/theme/assets/global/plugins/jcrop/demos/demo_files/image1.jpg" alt="DJ BBQ" style="width:540px;height:303px;" onClick="closeImage()">
</form>

<script type="text/javascript">
  function closeImage() {
    google.script.host.close();
  }
</script>
SBmore
  • 619
  • 5
  • 11
  • @Itsuki Productions Had an issue with permissions. If you're logged into your Google account you should see an "Actions" menu at the top. Run "Authorise" and then click the image and it should work. – SBmore Sep 22 '15 at 12:28
  • Yeah, is there a way to bypass the permissions? I'm not able to tell everyone to authorise and login to their google account D: – Itsuki Productions Sep 22 '15 at 15:07
  • Unfortunately certain API's require authorisation and this script uses the SpreadsheetApp API. They would only need to authorise it once but they would need to be logged in for it to work. I can't think of a workaround right now but if I do I'll let you know. – SBmore Sep 22 '15 at 15:13
  • They can't actually see the Actions > Authorize option unless everyone has the ability to edit the spreadsheet. So normal viewers, even logged in can't authorize. Is there a way around this? – Itsuki Productions Sep 22 '15 at 15:17
  • I believe people will need edit access for this to work. One workaround would be to have protection on the sheet but the clickable images in an unprotected column. I have made these changes on the above sheet as an example. If this isn't feasible for your situation I might be out of ideas. Permissions and authorisation makes certain things difficult to keep us protected from malicious scripts. – SBmore Sep 22 '15 at 16:10
1

Actually, there is an easy way now, upload the picture to google drive, paste the shareable link in the cell. click the link and select "chip".

It would look like this: enter image description here

Daniel
  • 11
  • 1
  • As it’s currently written, your answer is unclear. Please [edit] to add additional details that will help others understand how this addresses the question asked. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Mar 05 '23 at 04:43
0

Not sure if this is what you were looking for, nor if you found another solution, but if you go to insert/drawing you can paste there your full size image, insert it and then resize it within the cell. If you double click the image, the full size drawing will pop up. However this only works as an editor. not viewer nor commenter. Also, you have to click Save and close in order to go back. Neither ESC nor clicking outside closes the drawing editor.

Example: https://docs.google.com/spreadsheets/d/1KDcRQngFy1zRUrD6v2FYH-YPBivZGiUlSKt_PhjeZqU/edit#gid=0

Hope it might be helpful.

Enrique

Enrique Isa
  • 9
  • 1