Tutorial - how to use krpano googlemps.js plugin with Panotour Pro (PTP)

  • I suppose there are not a lot people who can code in krpano and still use PTP but i hope someone will find this usefull :)

    Intro: As Klaus informed me, PTP uses its own licence and overwrites krpano licence on each build. Panotour licence unfortunately does not include krpano googlemaps.js licence and therefore watermark is present (Demo mode) on googlemaps.js plugin.

    To resolve this we need to modify index.js file which is generated by Panotour on each build. This generates a problem, because the file would have to be modified each time a Build button is pressed, which means a lot :)

    The solution uses PTP custom templates and needs to be done only once. Here are the steps:

    1. Verify krpano licence: Run krpano tools, goto settings-> Registration information. Krpano maps plugin licence should be checked.
    2. Open your krpano install folder and navigate to subfolder viewer
    3. Open krpano.js file. Select and copy whole content of the file, we will paste it later. I recommend using Sublime text or Notepad++, or any editor of your choice
    4. Open folder of any tour you have created with PTP and navigate to /indexdata (I usually use index for Filename in Build tab, if you use some other name use it instead)
    5. Open index.js and find (function(){kpanotour. Delete everything before that line and paste previously copied code from krpano.js before that line.
    6. Save index.js

    At this point, if this tour had already included googlemaps.js in some custom code/plugin, watermark will be gone, meaning that maps are correctly licenced. Do NOT press Build for that tour in this moment.

    7. Copy index.js to indexdata\graphics folder of the tour and rename it custom_index.js. Additionally, save it on some other location, it will need to be manually copied once for each tour you bild (Or you can include in your PTP plugin for full automatic process)
    8. Navigate to: C:\Program Files\Kolor\Panotour Pro 2.5\Resources\templates\html
    9. Open htmlembedpanoscript.tmpl in editor and save it as htmlembedpanoscript_custom.tmpl.
    10. In 1. line, change {{playerFilePath}}.js to indexdata/graphics/custom_index.js. Save and close the file.
    12. Navigate to C:\Program Files\Kolor\Panotour Pro 2.5\Resources\html and open your desired template. For this example i used fullpage.html
    13. Find the line {%include "htmlembedpanoscript.tmpl" %} and replace htmlembedpanoscript.tmpl with htmlembedpanoscript_custom.tmpl.
    14. Save the file as fullpage_custom.html. If computer security settings doesn't allow it, save on some other location and copy the file back to C:\Program Files\Kolor\Panotour Pro 2.5\Resources\html
    15. Restart PTP and in build tab select fullpage_custom.html
    16. Build tour, googlemaps.je will be without watermark

    So, bacically, we created new fullpage_custom.html template and told it to use htmlembedpanoscript_custom.tmpl template, which than points to custom_index.js located in indexdata/graphics instead of index.js (located in indexdata folder). All you need to do know is manually copy the custom_index.js to /indexdata/graphics folder of each newly build tour, or include it in some PTP plugin and put the plugin's path in htmlembedpanoscript_custom.tmpl.

    Additionally, latest PTP (also final :) enabled updating krpano version, instructions can be found under Help->Licences. I tried that, but as I wrote in the begining, PTP replaces the licence on build so it didn't worked.

Participate now!

Don’t have an account yet? Register yourself now and be a part of our community!