embedded map issue

  • Resolved mcfly85

    (@mcfly85)


    4 years, 6 months ago

    Hello tinuzz

    I have problems getting embedded maps to work. The preview in the bottom pane or the page pointed to by the permalink simply remain empty.

    Here is what I did:
    1. Create embedded map:
    – adding new embedded map called “test”:
    [tsmap id=20] (i.e. same expression that works on a regular page)
    – permalink is shown as https://my.domain/tsmap/test

    2. Publish
    – embed html stanza is then shown as

    <iframe src="https://my.domain/tsmap/test/" width="600" height="450" frameborder="0" style="border:0" allowfullscreen></iframe>

    – preview pane at the bottom remains empty (no error)

    3. Open the permalink
    – no error, but empty page
    – page source:

    <!DOCTYPE html>
	<html>
 	   <head>
 	   <meta name="viewport" content="width=device-width, initial-scale=1">
 	   <title>test</title>
 	   <style>
	        body {
 	       padding: 0;
	        margin: 0;
 	       }
 	       html, body, #leaflet-container {
 	       height: 100%;
 	       }
  	      #container {
 	       height: 100%;
  	      }
  	  </style>
  	  </head>
  	  <body>
 	   <div id="container">
 	       <div id="tsmap_1"  style="width: 100%; height: 100%; max-width: 100%"></div>
  	  </div>
 	   </body>
	</html>

    Any help appreciated. Any hint where and what to look for?

    apache 2.4.38
    wordpress 5.5.1
    php 7.3.19

Viewing 3 replies - 1 through 3 (of 3 total)

  • for me same behavior – empty page

    Plugin Author tinuzz

    (@tinuzz)

    Sorry for not replying any sooner.

    This is a weird issue. The page source that you posted is missing lots of important stuff, like CSS and Javascript for rendering the map and the tracks.

    It seems that the template in Trackserver is to blame, but at this point I’m kind of baffled by how I could have not noticed that before.

    I’ll look into it. Thank you.

    Plugin Author tinuzz

    (@tinuzz)

    Hi,

    This is a little embarrassing. The HTML template for embedded maps that shipped with Trackserver is broken. It is missing important function calls, and in fact it does not load any of the necessary CSS and JavaScript because of that. TBH, I have no idea how it could ever have worked, even for me. I just don’t know and I sincerely apologize.

    To make it work, you have to download this file:

    https://github.com/tinuzz/wp-plugin-trackserver/blob/master/embedded-template.php

    and upload it to the Trackserver folder (wp-content/plugins/trackserver/) on your WordPress install. The only difference with the previous file is a call to wp_head(); at the top, and a call to wp_footer(); at the bottom.

    Of course, this fix will be part of the next release, which I hope to get out soon.

    Simply adding calls to wp_head() and wp_footer() will potentially add a lot of CSS and Javascript to the embedded map HTML, because all of your WordPress plugins will be active for embedded maps, like for any other page. The next Trackserver release will limit the CSS and Javascript in an embedded map to the styles and scripts used by Trackserver itself, and not include any styles and scripts added by other plugins, keeping the map HTML lean.

    Best regards,
    Martijn.

    • This reply was modified 3 years, 11 months ago by tinuzz.
Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘embedded map issue’ is closed to new replies.