How to find stuff

Please use Browser Search or Scroll down.

animation

click in animation editor html5 output: rotate -> use animation

tooltip for poly hotspots

to format the floating window: html5 output -> hotspots -> enable and set sizes then use the title title field (with html tags) <br><span style="font-family: Helvetica, Arial, sans-serif; font-weight:bold; text-align: center;">LOREM IPSUM</span> alternativ option: create a replacement floating tooltip for all hotspots: https://ggnome.com/wiki/Floating%20Tooltips%20and%20Hotspots

direct node access

html5 outout -> html -> template settings -> check direct node access index.html#node1

day/night scene transitions

preferences -> advanced tab -> show internal node ID in tourbrowser (bottom) hover over image to get internal node ID select first pano -> user data -> source field: {other-pano-node-ID} create button mouse click -> open next panorama -> URL: $us -> View: $cur

override the zoom transition

not possible... pick crossfade or zoom...

src

https://ggnome.com/wiki/Scene_Transitions

timers

open skin editor place timer icon (top) place the concerning element under it appearance settings: click orange logic block: visibility Active = false visible: true default value: visible: false timer settings: timeout: 12 sek type: loaded repeat: one time

elements to be activated/deactivated need hierachy

popup_image timer_image button_close_element button_ok_element text then activated popup_image with a node

src

https://www.youtube.com/watch?v=MJkJ9BKiQVI&list=PLiX2igIlGXJmlUayg2FHT_9nCLkFXbR2i&index=8

transitions between panos

transition type: cross dissolve transition time: 1.0s effects: before: zoom in after: zoom in uncheck wait for transition zoomed FoV: 35 zoom Speed: 1.00

video embedding (stiched!)

restraints: play position cannot be modified, cannot be hidden or modified in skin just create webm, so it will play in chrome/mozilla, exclude safari/IE by using webm, dont even create mp4 for safari/IE because it produces too many errors extract patch from patch image, generate video frames in PS then use ffmpeg to generate video from the single frames (brew install ffmpeg --with-libvpx or brew reinstall ffmpeg --with-libvpx) ffmpeg -framerate 8 -i img%01d.png -c:v libvpx -r 10 -pix_fmt yuv420p out.webm adjust framerate: 1/5 or 0.25 or 20 for right playbackspeed, -r 10 frames/sec (or for mp4: ./ffmpeg -framerate 8 -i img%03d.png -c:v libx264 -r 10 -pix_fmt yuv420p out.mp4 or ./ffmpeg -i input-file.mp4 -c:v libvpx -crf 10 -b:v 1M -c:a libvorbis out.webm ) use node marker for click/hover actions on the video create a poly hotspot in the hotspot editor: poly01 skin editor -> add a node marker -> give proxy ID poly01 give the node actions now: i.e. go to next pano on click, or play/pause video

export movie for html5

compose it in quicktime/vegas/whatever and export full size, then compress it in miro (or handbrake or ffmpeg): H.264 (MP4) works in Safari/IE WebM works in Android, Chrome, Firefox, Opera export the full composition from quicktime first get settings from orig movie window -> show movie inspector file -> export -> MPEG4 Video Format: H264 Data Rate: 6000 kbits/sec Image Size: Current Frame Rate: Current miro: webm for Android/Mozilla drag video into app Format -> Video -> WebM HD then copy from output folder miro: h.264 (mp4) for Apple/IE drag video Format -> Video -> MP4 then copy from output folder

embedding

<video width="640" height="360" controls> <source src="asdf.mp4" type="video/mp4" /> <source src="asdf.webm" type="video/webm" /> Your browser does not support the video tag. </video> Recommended is to embed video using youtube (share->embed): <iframe width="700" height="400" src="http://www.youtube.com/embed/AoVhmM_s2hY?rel=0" frameborder="0" allowfullscreen></iframe>

src

https://en.wikipedia.org/wiki/HTML5_video#Browser_support https://ggnome.com/forum/viewtopic.php?t=7745

offline videos with popups

create videos &amp; html file in output folder

<!DOCTYPE HTML> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> * { margin: 0; padding: 0; } .video { width: 100%; overflow: hidden; max-height:100px; text-align: center; } </style> </head> <body> <video width="640" height="360" class="video" scrolling="no" seamless="seamless" controls> <source src="videos.mp4" type="video/mp4" /> <source src="videos.webm" type="video/webm" /> Your browser does not support the video tag. </video> </body> </html>

link it in pano2vr with hotspot

place hotspot and remember hotspot ID open skin editor, create group create close button & text field inside group

set actions on group:

init -> set value: put here the IFRAME! -> target: "your text field" iframe: <iframe width="640" height="360" src="video.html" frameborder="0" allowfullscreen></iframe> mouse click -> Toggle Element Visibility -> target: $self

set actions on close botton:

mouse click -> set value: <LEAVE EMPTY>!! -> target: "your text field" mouse click -> set value: put here the IFRAME! -> target "your text field" iframe: <iframe width="640" height="360" src="video.html" frameborder="0" allowfullscreen></iframe>

welcome popup content on individual panos, using tags

add a tag to the pano (user data) in the skin add some elements, uncheck visible also in skin editor from top bar, add a node node settings: type same tag as in the pano Node Actions: Activate, show element, pop_image Deactivate, hide element, pop_image

src

http://ggnome.com/wiki/Using_Node_Markers_(Pano2VR)#Activating_elements

minimaps

hide minimap in mobile, custom css

goto skin editor select minimap group -> advanced tab -> add css class: hide-on-mobile then open index.html and paste this: @media (max-width: 670px) { .hide-on-mobile { display: none; } }

settings

skin/controller: simplex.ggsk -> edit copy "hide_template" group from another tour (hide_template group) marker_normal marker_active markertemplate marker_title canvas size: 640 x 480 uncheck hide TEMPLATE layer, leave rest drag panos from other window into map select tourbrowser window, drag panos onto map

change map icons

find circle -> properties -> svg image -> change

multilevel floormap

add a tag to each pano (user data): level1, level2, usw in the skin add some elements, uncheck visible also in skin editor from top bar, add a node node settings: type same tag as in the pano Node Actions: Activate, show element, NODE_LEVEL1 Deactivate, hide element, NODE_LEVEL1 Activate, hide element, NODE_LEVEL2 Activate, hide element, NODE_LEVEL3 Mouse click, trigger click, $self (to prevent error when empty spot on map is clicked) create level buttons, set this action: mouse click, open next pano, select next floor start pano

radar beam in mini map

open new-radar-skin, copy the radar, open own skin and paste it then put radar graphic under each node in the map add this to the node parent (marker_node8): Activate, show element, radar beam8 Deactivate, hide element, radar beam8

right direction of radar beam

click oben map icon find address in google maps (satellite) select a pano -> user data -> click copy button (to copy to all panos) then select each pano -> view parameters -> North: ROTATE AND SET! to get the right direction: north is the north of the minimap! just point to the northern edge in each pano

add environment sounds to single panos

in media editor, place sound mode surround loop: 0 ACHTUNG: wenn filme abgespielt werden, auf PAUSE setzen! popup_video gruppe: mouse click, play/pause media, 0, _sound_prov der close button bekommt keine Aktion

duplicate skin button sound on/off

create 2 buttons actions on button_on: mouse click, set volume 1, _main mouse click, hide element, button_on mouse click, show element, button_off usw

formatting of elements in skin editor

uncheck Auto Size textbox groesser ziehen, und folgendes reinschreiben: <br><span style="font-family: Helvetica, Arial, sans-serif; font-weight:bold; margin:10px; padding:10px; text-align: center;">$hs</span>

autorotate first pano

turn off autorotate in output settings select an element zb pop_image in skin editor Actions: Viewer Init -> Start Auto Rotate Mouse Over -> Stop Auto Rotate Insert "Mouse Over -> Stop Auto Rotate" Action for all other Elements in this pano!

add youtube video

add hotspot, remember hotspot id in skin editor create group add textfield inside with youtube dimensions, ID: video_iframe_page enter hotspot id in group field proxy id field get youtube embed code: share -> embed

group icon -&gt; actions

1. Action

Source: Mouse Click Action: Toggle Element Visibility Target: $self

2. Action

Source: Init Action: Set Text Text: <iframe width="640" height="360" src="VIDEOURL.COM" frameborder="0" allowfullscreen></iframe> Target: video_iframe_page

close button (under group icon) -&gt; actions

1. Action

Source: Mouse Click Action: Set Text Text: HIER LEER LASSEN Target: video_iframe_page

2. Action

Source: Init Action: Set Text Text: <iframe width="640" height="360" src="VIDEOURL.COM" frameborder="0" allowfullscreen></iframe> Target: video_iframe_page (es muss nocheinmal geladen werden, also resettet! fuer das nacehste mal)

add images/media

media -> modify doubleclick -> select image click mode: pop out 100% works with gifs too, or animated pngs as sprites!

add tooltip/hotspots

fast way

select pano -> Hotspots drag polygon hotspot or point title: <b> das sit dibaablabalaa </b> ev. add website link too... create html5 output: advanced settings: hotspot text box show current

slow way

select pano -> hotspots -> add one give id (popup123) (in the simplex skin) goto skin editor -> add text box appearance: uncheck visible Text: add somehting check wordwrap, autosize hotspot proxy id: popup123 skin id: SKIN_ID_NAME actions: mouse click, toggle element visibility, $self

change hotspot icon

create another fadenkreuz (from menu oben) copy hsimage von anderem hotspot and replace SVG when creating new hotspot: skin id: SKIN_ID_NAME

adding a logo

skin editor -> drag PNG onto canvas position (right tab) -> anchor: click top left corner actions -> doubleclick into table source: mouse click action: go to URL check it in live preview (top corner) file -> save as -> another skin

src

https://www.youtube.com/watch?v=qk6tOxUnTBg

patch nadir

output: Tranformation then click Convert Input -> vertical cross clone stamp in photoshop nadir and zenith then in pano2vr, click Select Input, ok convert input -> leave defaults