I have several maps. Is there a way to create a web page that has several maps showing at the same time?
several maps showing
Votes:
0
4 Replies
Votes:
0
One way of doing this is to use the code that is available at the map's Get HTML tab.
Create a new file called mymaps.htm in the \webroot folder of your PRTG installation and past the code mentioned above for every map you want to show on your web page.
The result will look something like this:
<iframe width=800 height=600 frameborder="1" src="http://[myprtgserver:port]/public/mapshow.htm?id=1234&mapid=mytestmap1"> </iframe> <iframe width=800 height=600 frameborder="1" src="http://[myprtgserver:port]/public/mapshow.htm?id=4321&mapid=mytestmap2"> </iframe>
You can now access this page at:
http://[myprtgserver:port]/mymaps.htm
Change [myprtgserver:port] for the actual address and optional port number of your PRTG server.
Regards,
Created on Aug 14, 2012 9:16:45 AM
Last change on Sep 14, 2016 12:44:54 PM by
Waltraud Bestelmeyer
(110)
●2
●1
Votes:
0
hallo, did you take a look at map rotation as well?
https://www.paessler.com/manuals/prtg/maps.htm
To show several maps in a rotation, mark the desired maps using multi-edit and then select Map Rotation from the multi-edit menu.
While a map rotation is shown, you can change the refresh interval any time when hovering the arrows symbol in the lower right corner. Choose between 10 , 30 , or 60 seconds, 10 minutes or Refresh now.
Votes:
0
I was able to get several maps on to one page, but they are still full size. Is there another html tag to shrink them to 25% of full size?
Votes:
0
Hi Haris.
Adding some CSS (Cascading Style Sheets) code allows you to place live thumbnails of several maps on your page. The code below places two scaled maps side by side.
<style> .thumb{ position:relative; width:265px;170px; } .thumb .iframe_thumb{ position:absolute; z-index:95; left:0;top:0; height:100%;width:100%; background:#fff; opacity:0; } .thumb iframe{ position:relative; -webkit-transform: scale(0.3, 0.29); -moz-transform: scale(0.3, 0.29); transform: scale(0.3, 0.29); -moz-transform-origin:0 0; -webkit-transform-origin:0 0; transform-origin:0 0; position:relative; z-index:90; } </style> <div id="thumb0" class="thumb"> <div class="iframe_thumb"></div> <iframe src="http://[myprtgserver:port]/public/mapshow.htm?id=1234&mapid=mytestmap1" width="800" height="600" scrolling="no" style="position:absolute;left:0;top:0"> </iframe> </div> <div id="thumb1" class="thumb"> <div class="iframe_thumb"></div> <iframe src="http://[myprtgserver:port]/public/mapshow.htm?id=4321&mapid=mytestmap2" width="800" height="600" scrolling="no" style="position:absolute;left:266;top:0"> </iframe> </div>
Regards,
Add comment