How to customize our online viewer
Occasionally, we get inquiries from our users about changing certain settings on the Zoomable viewer. Here are some tips on customizing our online viewer.
You can add the following options at the end of the Zoomable link we sent you.
Example:https://srv2.zoomable.ca/viewer.php?i={image id}&option1=value1&option2=value2#{zoom settings}
Options
Option | Description | Example |
---|---|---|
&bg={color code} |
Change the background color. Comes in handy when uploading a transparent (PNG) image. The color code can be either a color name (e.g. silver ), or a hex value (e.g. C0C0C0 ). |
Example 1, Example 2 |
&navigator=1 |
Show Navigator | Example |
&navigation=0 |
Hide the navigation icons. | Example |
&embed=0 |
Hide the embed link | Example |
Note: Make sure the above options are placed at the end of the of the Zoomable link, before the number sign (#). The number sign is used for determining the zoom and position of the viewer, which is covered in the next section.
Here's a correct example (options are placed BEFORE the number sign):
https://srv2.zoomable.ca/viewer.php?i=imgecf402ea70b2e191_Spain_and_Portugal_rail_WM_6000px&bg=white&navigator=1#zoom=1.01738&x=0.42950&y=0.39223
And an incorrect example (options are placed AFTER the number sign):
https://srv2.zoomable.ca/viewer.php?i=imgecf402ea70b2e191_Spain_and_Portugal_rail_WM_6000px#zoom=1.01738&x=0.42950&y=0.39223&bg=white&navigator=1
Zoom and position settings
Besides our viewer is customizable, it remembers the position and zoom level when browsing, like Google Map. In Google Map, it stores the desired location as @43.718371,-79.5428637,11z
in the browser address bar. In Zoomable, it is stored as #zoom=1.89780&x=0.48395&y=0.29030
in the address bar. The address gets updated when the pan and zoom animation ends.
Thank you for using our service. We hope you find it beneficial for your projects. Feel free to reach us if you have any questions.