cannot address map using custom js

New home Forums Basic Version Troubleshooting cannot address map using custom js

This topic contains 10 replies, has 2 voices, and was last updated by  m77townhall 5 days, 7 hours ago.

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #48484

    m77townhall
    Member

    hi support,

    i am using your plugin in standard free version and my aim is to tilt a simple map into 3D (no marker or any other extras to be displayed). This should be done using the following standard google maps API command.

    map.setTilt(45);

    however when running the following code (found in forum) in “custom JS” field of the plugin it does not get executed. Even the logging command is not executed. looks as if I cannot address the map like this.

    Could you please help what to change to get it working?

    jQuery(function($){
    $('.wpgmza_map').on('wpgooglemaps_loaded',function(){
    var mapid = parseInt($(this).attr('id').replace('wpgmza_map_',''));
    console.log('mapid is:' + mapid );
    MYMAP[mapid].map.setTilt(45);
    });
    });

    thanks!

    #48488

    Perry
    Moderator

    Hi there

    Thank you for getting in touch.

    Are you able to link us to your page so we can check why that code isn’t running?

    You could try the event “init.wpgmza” instead, if you’re able to link us to your map page I’m sure we can give you a prompt answer on this.

    Kind regards
    – Perry

    #48535

    m77townhall
    Member

    hi there,

    here is the link to my page where the map is shown.
    https://creative.hungenbach.de/picture-town-map/

    sourcecode looks as if the map is tied to a div with id-selector

    whereas the code above looks for a class with name “wpgmza_map”

    happy to get your feedback on how to address an eventually tilt the map into 3D.

    thank you!
    m77townhall

    • This reply was modified 1 week, 2 days ago by  m77townhall.
    #48551

    Perry
    Moderator

    Hi there

    Please alter your JavaScript to the following

    jQuery(function($) {
    
    $(document).on("init.wpgmza", function(event) {
    
    event.target.googleMap.setTile(45);
    
    });
    
    });

    That should work well for you, if you could please confirm that would be great.

    Kind regards
    – Perry

    #48591

    m77townhall
    Member

    hi perry,

    thanks for your feedback.

    here is the code which I embedded into “custom js” – see link above for how it looks on page. unfortunately it does not work and only ‘trigger1’ is visible on the console.

    could you please let me know an alternative way to address the map.

    jQuery(function($) {
    console.log('trigger1');
    $(document).on("init.wpgmza", function(event) {
    console.log('trigger2');
    event.target.googleMap.setTile(45);
    console.log('trigger3');
    });
    });

    thank you!
    m77townhall

    #48595

    Perry
    Moderator

    Hi there

    I can see that event is definitely firing, but it appears to be fired before this custom code binds a listener.

    Can you please try removing the jQuery(function($) { from teh top and the trailing }); ?

    Kind regards
    – Perry

    #48630

    m77townhall
    Member

    Hi there,

    I have updated the code as follows:

    console.log('trigger1');
    $(document).on("init.wpgmza", function(event) {
    console.log('trigger2');
    event.target.googleMap.setTile(45);
    console.log('trigger3');
    });

    Now am seeing an error message in console:
    TypeError: $ is not a function

    Is there anything I can do in plugin settings that I can make use of the following function which seems to work for other users on this forum?
    $('.wpgmza_map').on('wpgooglemaps_loaded',function(){ ... });

    Thanks,
    m77townhall

    #48631

    Perry
    Moderator

    Hi there

    Unfortunately this event is triggered before the googleMap is ready to accept options, in addition this is a legacy event that will be dropped in favour of the .wpgmza scoped events eventually.

    jQuery(document.body).on("init.wpgmza", function(event) {
    event.target.googleMap.setTile(45);
    });

    That will work for you. If you are still experiencing issues and would prefer us to implement this for you, could you please create an account for [email protected] and I would be glad to oversee this for you.

    I hope that helps?

    Kind regards
    – Perry

    #48647

    m77townhall
    Member

    Hi There,

    Thanks for your feedback. Now no more error messages in log but also the “tilt” to 45° angle is not yet working. Will test with this your code now.

    Thank you Perry!
    m77townhall

    #48651

    Perry
    Moderator

    Hi there

    If you have any further issues please let us know, if it’s possible for you to share access to the site with us then we can implement this for you and solve any subsequent issues.

    Kind regards
    – Perry

    #48666

    m77townhall
    Member

    Hi Perry,
    it works. Thank you very much for the multiple follow ups here.
    Great service you are providing.
    Best Regards,
    m77townhall

    #48682

    Perry
    Moderator

    Hi there

    I’m glad to hear it! Thank you for letting us know!

    Before we close this ticket, may we ask how you found out about our plugin?

    Kind regards
    – Perry

Viewing 12 posts - 1 through 12 (of 12 total)

You must be logged in to reply to this topic.