Description
JavaScript library for 3D Vista
I’ve been scripting in 3DV for over a year and created quite a few custom solutions. Some were simple like fade in / fade out animations for hotspots, others were quite complex like a paywall protecting locked parts of the virtual tour.
Over the time, I created a library – a set of functions on top of the 3D Vista’s JavaScript player that make scripting immensely easier. This library is an organic product of my developer experience and contains the most important, core functions I’m using across all of my projects to be able to program basically any desired behavior in virtual tours.
Together with this library that contains over 30 functions, I wanted to share my know-how I accumulated over the last year. After reading the documentation, you will understand how the JavaScript environment in 3DV works, how to create your own scripts, where to place them and you will gain a fine overview of what can be done using JavaScript (a lot can be done).
This documentation will save you hours of digging and figuring things out by yourself. My personal guess is that if I had such a documentation a year ago, I would be able to fast-forward the learning process from a year to tops 3-4 months.
Important remarks
- This library is not and has not been supported nor affiliated with 3D Vista by any means. 3D Vista does not provide any support for the external JavaScript that interacts with the player and has not been generated by VT Pro.
- 3D Vista’s updates may cause some functions to stop working properly.
- If you experience any problems, please contact me at matej@blazeit.sk.
- Do not contact 3D Vista as they are not affiliated with this product.
- I will be regularly checking the compatibility with updated versions and notifying buyers about any potential issues.
What is inside?
This product consists of two parts:
- Collection of functions (API)
- JavaScript recipes – documentation on the JS environment and examples
Collection of functions – API
I prepared over 30 functions that allow you to manipulate various aspects of virtual tours:
- Components API (components are skin elements) – gives you full control over components, their position, size, appearance, actions, visibility, behavior.
- Hotspots API –Â gives you full control over hotspots, their position, size, appearance, actions, visibility, behavior.
- Actions API – allows you to trigger any action (click, roll over, initialization etc.) bound to any component or hotspot via JavaScript.
- Panoramas API – allows you to retrieve and manipulate panoramas.
- Navigation API – allows you to navigate to any panorama or a playlist item via JavaScript.
- Playlist API (playlist is the carousel – what you see in the Publish tab) – allows you to retrieve and manipulate playlist items.
With these functions you will be able to control components, hotspots, navigation and much more.
JavaScript recipes
Documentation provides a deep insight into the JS environment and on how to use JS to gain a full control over 3DV virtual tours.
Recipes and examples:
- how to communicate with a server (so for example you can retrieve / store data from a database – AJAX),
- how to persist data in the tour so when the visitor refreshes / closes the tour, data won’t be lost (for example a score or user information will be persisted when user opens the tour again),
- how to bind keyboard keys to navigate through the tour,
- how to listen to events such as resize event (fired when the screen size changes) so you can build responsive interfaces,
- how to store and work with data (for example a scoring game that navigates you to a locked part of the tour when the necessary score is reached),
- and more…
Who is this product for?
Both – non-developers and advanced programmers.
Functions are extremely easy to use, for example setting size and position of a component called Company logo is simply calling:
window.blazeIT.setComponentAttributes(“Company logo”, {
width: 300,
height: 200,
top: 24,
right: 24
});
Included examples (mentioned in the recipes above) are well documented and easy to adjust according to your needs. Even if you have absolutely no JavaScript experience, you will still be able to use all of the functions without a problem. However, you may struggle to create more complex solutions.
Developers will be able to fully embrace the power of the 3D Vista’s JS player, create own API on top of this, understand the core principles and create complex scripts. As a senior developer I can say that this may save you dozens of hours of your own research and bypass the initial trial and error process.
Maintenance
I will be regularly updating the library according to the 3D Vista updates. Currently it’s compatible with the:
Last update: 26 December 2021
Last supported 3D Vista VT PRO version: 2021.2.24 and lower (older)
IMPORTANT!
3D Vista VT PRO Beta version is not supported. Even though a majority of the API is working, Hotspot API needs to be updated due to the new hotspot editor. Only non-beta 3DV VT PRO versions will be supported.
Happy scripting!
Sonja Rehwald (verified owner) –
With the API, I am able to code actions, which can not be done using only 3D-Vista. Very helpful functionality and a very good and fast support.
Benjamin Maares (verified owner) –
The API is a great tool to tweak 3DV tours with Javascript features. The documentation is easy to understand and the implementation very quick and efficient. WELL DONE!
Leonardo david Restrepo herrera (verified owner) –
Amazing product! the only real documentation available for making 3d vista even better!
eszenyi.viktor (verified owner) –
OK so I’m using it only for an hour now, but I think it already saved me the money (and more) that I spent on it.
Everything it says is true (“This documentation will save you hours of digging and figuring things out by yourself”).
Not just by the shortcuts it provides, but if you look into the code itself, it will also help you understand how the whole ecosystem works, and give you that enlightenment moment(s), that were missing for literally hours/days, for the question “why isn’t this code working”.
Worth every cent!