|
Pixtra
Stitchers: Create Virtual Tour - Manual
The
virtual tour authoring in Pixtra Stitchers is limited to one
panorama, for quick tour making. We strongly recommend using
Pixtra TourMaker,
the dedicated full-featured tour authoring tool (Download
Pixtra TourMaker).
Now that you have made a panorama with Pixtra PanoStitcher or Pixtra
OmniStitcher, it is time to create a virtual tour web page to
share with the world.
Creating the tour page can be as simple as "Load" and
"Create Web Page", though more features are available
for customization.
A tour page
contains three sections, optional tour title, viewer and control
bar.
The "Create Virtual Tour" UI authors the tour content
and the tour page layout.
User
Interface
The Create Virtual Tour window is launched via
1) Stitcher toolbar button
"Create Virtual Tour", or
2) Main menu | Publish | Create Web
Virtual Tour, or
3) (After saving a panorama to .jpeg or .tiff format)
Right-click on your panorama to bring up the panorama floating
menu and choose "Create Web Virtual Tour"

Virtual Tour UI
Layout
diagram
It displays how the
tour page would be like upon launching.
It will update whenever a layout property changes.
Tour
Title
Tour title is shown
in web browser's title bar.
[x] Show in Web
Page:
also show tour title at top of the tour page.
Vista
A vista is a
panorama image as stitched with Pixtra PanoStitcher / OmniStitcher.
Clicking Load will pop-up Image Browser window to select the
panorama file.
Vista
Bin
Once a vista is
loaded, its thumbnail will be displayed in Vista Bin.
The yellow box indicates the initial view as the vista is shown in
the tour page viewer.
This initial view box can be relocated by clicking on the desired
area in the thumbnail while pressing the ctrl-key or completely
removed by drag it away.
Removing the view box is unnecessary since another vista can be
loaded to replace the current one.
Viewer
The tour page
viewer width / height can be modify here.
Alternatively drag a viewer size marker to resize.
Image Quality
dictates the compression level of the published vista file: a
higher quality means a larger file size, hence the longer time to
download (from the published internet site).
Viewer
Size Markers
These include
- Viewer width marker on the horizontal ruler at bottom
- Viewer height marker on the vertical ruler at right
Dragging a marker
will change the viewer width or height.
The location of the marker on the ruler also gives a visual idea
of the viewer size.
Initial
Behavior
These affect the
viewer's initial actions as a tour page is loaded:
- Horizontal
Field-of-View: the angular span of viewable area, e.g.,
the zoom level of the initial view (as indicated by the coverage
of initial view box).
- Spin Speed: in
degrees per second.
A positive value corresponds to spin-left while a negative value
to spin-right.
The corresponding time to loop around is also indicated.
Tour
Sound
The sound to be
played when browsing the tour page.
The tour sound can always be turned off from the tour control bar.
Colors/Fonts
Tour Title: Color /
Font.
Control Bar: Color.
[ ] no color: means transparent
Page Background:
Color
Save
Tour File
Choose the folder
and web page file name to save the tour.
The folder should contain only one tour to avoid conflict of the
folder Pixtra_media and the file StitcherStarterPage.htm for
different tours.
Create
Web Page
To make the tour.
Preview
To view the created
tour:
Launch the default web browser and load StitcherStarterPage.htm,
which will automatically load the tour page in another browser
window of the right size.
Save
Configuration
Save the current
settings in Viewer, Initial Behavior and Colors/Fonts.
Virtual Tour window will be configured to these initial settings
upon future launches.
Then creating a tour can be as simple as Load and Create.
Typical
Tour Making Steps
1) Load a vista
2) Give the tour a title
3) Create Web Page
4) Preview
5) Upload files to web server

Tour
starter page:
this page is launched upon clicking "Preview".
Once loaded this page automatically launches the virtual tour page
in a
separate browser window, as shown below:

Sample
Virtual Tour Page:
Viewer, control bar (with no tour title in page): click on
the snapshot for a tour.
Click on "show
embedded tour at bottom" to illustrate the tour page embedded
as part of the parent page.
Tour
Page Path
The
provided html code fragments in the starter page assume that the
published tour page and the parent page are in the same folder.
If not, the tour page attribute has to be modified (e.g., src="SF_tour.htm"
for embedding).
This tells the parent page where to find the tour page.
There are two ways to specify the path:
(1)
Relative path.
This assumes both the parent and tour pages are on the same drive
of your PC.
The use case is that you have the local copy of your website
(where both pages will be uploaded to the web server maintaining
the same relative path).
With a relative path the tour URL could be locally played/tested
before uploading (even with no web connection).
Example
1: tour page path is "C:\site\pixtra\tour\sf\SF_tour.htm",
and parent page path is "C:\site\parent.htm",
the relative path will be "tour/sf/SF_tour.htm" (with
the common prefix ignored).
The html fragment to insert to the parent page for launching will
be
<input
id="launch_PixtraTour" type="button"
value="Start Virtual Tour" onclick="javascript:window.open('tour/sf/SF_tour.htm',
'PixtraTourWin_SF_tour', 'status=yes,top=5,left=5,width=606,height=458')"/>
Example
2: tour page path is "C:\site\pixtra\tour\sf\SF_tour.htm",
and parent page path is "C:\site\hotel\trip\index.htm",
the relative path will be "../../tour/sf/SF_tour.htm"
(with "..\..\" means going up two folder levels to
the closest common parent folder).
The html fragment to insert to the parent page for launching will
be
<input
id="launch_PixtraTour" type="button"
value="Start Virtual Tour" onclick="javascript:window.open('../../tour/sf/SF_tour.htm',
'PixtraTourWin_SF_tour', 'status=yes,top=5,left=5,width=606,height=458')"/>
(2)
Web URL path:
This assumes the tour is already uploaded .
this will always work if URL is valid.
The web connection is required to test the linking of the parent
page.
To guarantee correctness, show the web tour in a browser.
Copy and paste the URL as show in the browser navigation bar to
modify the src attribute.
Example:
if tour page URL is "http://www.pixtra.com/tour/sf/SF_tour.htm",
the html fragment to insert to the parent page for embedding will
be
<iframe
id="embed_PixtraTour" src="http://www.pixtra.com/tour/sf/SF_tour.htm"
width="606" height="458" frameborder="0"
scrolling="no"></iframe>
Pixtra
TourMaster has a feature to automatically make the correct path at
publish time.
Publish
to the Web
Follow
the instruction in the Virtual Tour Starter Page.
If
you are to publish multiple tours to
your website, the following is strongly recommended:
Publish
all tours to the same top Folder.
Then all your tours will share the same PixtraTour.jar and
PixtraTour_media folder.
This will speed up viewing your tours: The cached version of these
files will be used,
instead of each tour downloading its own version.
More importantly, sharing one copy of PixtraTour.jar in your
website is the workaround to an outstanding compatibility issue
between Java and FireFox browser.
Pixtra
Tour Help
Pixtra
Tour provides rich navigation options, which is summarized in this
tour Help web page (launched by clicking the tour control bar Help
button in a tour page):
The Java applet PixtraTour is the virtual tour engine.
It requires Java version 1.0 or above installed to the browser.
|