Make a pictrure view from the tour

Q&A about the latest versions
FunnyUncle
Posts: 69
Joined: Wed Apr 04, 2018 10:18 pm

Tue Feb 02, 2021 2:21 pm

Hallo,
please does anybody know, how to make a "button" to take picture from the view in the tour and save it as JPG or to choose share to social media?

Thanks for help.

Milos
User avatar
Hopki
Gnome
Posts: 11512
Joined: Thu Jan 10, 2008 3:16 pm
Location: Layer de la Haye, Essex UK
Contact:

Tue Feb 02, 2021 9:35 pm

Hi Milos,
This can be done.
Open the skin editor add a text box and copy and paste this code:

Code: Select all

<a href="#" onclick="javascript:this.download = 'image.jpg';var dl=pano.getWebGlContext().canvas.toDataURL('image/jpeg');dl=dl.replace('image/jpeg', 'image/octet-stream');this.href = dl;" >download</a>
Create the outout, now you need to edit the HTML page:

Find this line in teh HTML page:

Code: Select all

pano=new pano2vrPlayer("container");
And replace it with this:

Code: Select all

pano=new pano2vrPlayer("container",{ webGLFlags: { preserveDrawingBuffer:true } });

This will show a text link, when clicked it will download a screenshot.
Regards,
Hopki
Garden Gnome Support
If you send an e-mail to support please send a link to the forum post for reference.
support@ggnome.com
https://ggnome.com/wiki/documentation/
FunnyUncle
Posts: 69
Joined: Wed Apr 04, 2018 10:18 pm

Wed Feb 03, 2021 1:25 am

Thank you very much, I will try it!

Milos
FunnyUncle
Posts: 69
Joined: Wed Apr 04, 2018 10:18 pm

Thu Feb 04, 2021 5:10 pm

Hallo Hopki,
I did not succes well. I did the video how I did it, could you be so kiund and check it?

I can do the image JPG, but its only black.

Thanks for help.

https://youtu.be/F_pG7qIvQJg

MIlos
FunnyUncle
Posts: 69
Joined: Wed Apr 04, 2018 10:18 pm

Thu Feb 04, 2021 9:28 pm

Dear Hopki,
thanks a lot for support. I downloaded the video. I will try it soon.

I am thinking about the "button" to push it which is part of the skin, this is more comfortable. I will think about it ;)

Thanks a lot!!!

Milos
User avatar
soulbrother
Posts: 476
Joined: Tue Apr 08, 2008 7:01 pm
Location: München
Contact:

Fri Feb 05, 2021 11:00 am

Martin, is it true, that a "screenshot" is taken, but only the panorama and NOT the skin elements that are displayed in the browser window?
User avatar
Hopki
Gnome
Posts: 11512
Joined: Thu Jan 10, 2008 3:16 pm
Location: Layer de la Haye, Essex UK
Contact:

Fri Feb 05, 2021 1:22 pm

Hi,
Yes, that's correct it shows just the panorama and not the skin.
Regards,
Hopki
Garden Gnome Support
If you send an e-mail to support please send a link to the forum post for reference.
support@ggnome.com
https://ggnome.com/wiki/documentation/
User avatar
panox
Posts: 288
Joined: Mon Mar 12, 2007 11:03 pm
Contact:

Fri Feb 05, 2021 6:40 pm

A nice effect! Is it possible to make the text containing the screenshot function invisible and place an SVG graphic under it as a childelement, so that clicking on the graphic triggers the screenshot? I have tried it without success.
User avatar
Hopki
Gnome
Posts: 11512
Joined: Thu Jan 10, 2008 3:16 pm
Location: Layer de la Haye, Essex UK
Contact:

Fri Feb 05, 2021 11:41 pm

Hi,
To use this with a button.
Repace the code in the text box with this:

Code: Select all

<a href="#" onclick="javascript:this.download = 'image.jpg';var dl=pano.getWebGlContext().canvas.toDataURL('image/jpeg');dl=dl.replace('image/jpeg', 'image/octet-stream');this.href = dl;" download id="snapshot"></a>
Change the ID of the text box to something like "_snapshot_code" without the quotes.
Deselect visible so it's hidden.

Then in a button add a Go To URL action with URL:

Code: Select all

javascript:document.getElementById("snapshot").click();
You still need to replace the code in the HTML page with the following:

Code: Select all

pano=new pano2vrPlayer("container",{ webGLFlags: { preserveDrawingBuffer:true } });
Regards,
Hopki
Garden Gnome Support
If you send an e-mail to support please send a link to the forum post for reference.
support@ggnome.com
https://ggnome.com/wiki/documentation/
User avatar
panox
Posts: 288
Joined: Mon Mar 12, 2007 11:03 pm
Contact:

Sat Feb 06, 2021 11:23 am

Hi Hopki,

thank you, this seems to me to be more elegant than the simple textbox:

https://www.pano.szenerien.de/XPhase_Pr ... index.html

Best regards

Harald
User avatar
Chu
Posts: 96
Joined: Tue Jan 10, 2012 1:59 pm
Location: London, UK
Contact:

Sat Feb 06, 2021 1:33 pm

Hopki wrote:
Fri Feb 05, 2021 1:22 pm
Hi,
Yes, that's correct it shows just the panorama and not the skin.
Regards,
Hi Hopki, can we also (selectively) expose skin elements in the resulting image? This has made my day... Thanks man
Using:
Pano2VR PRO 6.1.12 pro 64bit
build 18076/5.12.2

Windows 10 x64
Human Brain v1.1

Image

est.1971
User avatar
christianm_hz
Posts: 6
Joined: Fri Oct 30, 2020 5:04 pm
Location: Quedlinburg, Germany
Contact:

Sat Feb 06, 2021 3:11 pm

Hi hopki and panox
Thank you for this very nice solution.

It is possible to add an png in the generated image? such as a logo centered at bottom?

Greetings
Christian
User avatar
panox
Posts: 288
Joined: Mon Mar 12, 2007 11:03 pm
Contact:

Sat Feb 06, 2021 4:54 pm

Hi Hopki,

unfortunately, this solution is not suitable for display on my iPad. I have to hide the icon with a Logic Block setting.
wiso
Posts: 214
Joined: Wed Oct 26, 2016 6:52 pm

Sat Feb 06, 2021 5:18 pm

wonderful!

is it possible to make a html template which includes this one line (chages in the index.html) fix ?

regards,
wiso
User avatar
panox
Posts: 288
Joined: Mon Mar 12, 2007 11:03 pm
Contact:

Sat Feb 06, 2021 6:01 pm

This would be better than copying the changed html file back into the output folder every time the project is changed.
Post Reply