Map view for Zoneminder

[mconfortino]

Hi. I am providing here instructions to add a map view page for Zoneminder.

https://www.dropbox.com/s/ruggvm4lrnq968z/mapa.php?dl=0

https://www.dropbox.com/s/esmhgp9wt7/mapa.zip?dl=0

mapa.zip decompresses to a folder named 'mapa' to be copied into /usr/share/zoneminder/www
In that folder, in main.js in line 9 we set the coordinates of the center of the initial map view.

The file mapa.php goes in /usr/share/zoneminder/www/skins/classic/views

I'm including my own /usr/share/zoneminder/www/skins/classic/includes/functions.php. Starting line 98 you will find this code:

Code: Select all

  <!-- Agregado para ver el mapa -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
  <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.3/css/all.css" integrity="sha384-UHRtZLI+pbxtHCWp1t77Bi1L4ZtiqrqD80Kn4Z8NTSRyMA2Fd33n5dQ8lWUE00s/" crossorigin="anonymous">
  <link rel="stylesheet" href="https://unpkg.com/leaflet@1.4.0/dist/leaflet.css" />
  <link rel="stylesheet" href="leaflet-extramarker/css/leaflet.extra-markers.min.css">
  <link rel="stylesheet" href="mapa/main.css">
  <!-- Load Leaflet from CDN -->
  <link rel="stylesheet" href="https://unpkg.com/leaflet@1.7.1/dist/leaflet.css"
    integrity="sha512-xodZBNTC5n17Xt2atTPuE1HxjVMSvLVW9ocqUKLsCC5CXdbqCmblAshOMAS6/keqq/sMZMZ19scR4PsZChSR7A=="
    crossorigin=""/>
  <script src="https://unpkg.com/leaflet@1.7.1/dist/leaflet.js"
    integrity="sha512-XQoYMqMTK8LvdxXYG3nZ448hOEQiglfqkJs1NOQV44cWnUrBc8PkAOcXy20w0vlaXaVUearIOBhiXZ5V3ynxwA=="
    crossorigin=""></script>

  <!-- Load Esri Leaflet from CDN -->
  <script src="https://unpkg.com/esri-leaflet@3.0.3/dist/esri-leaflet.js"
    integrity="sha512-kuYkbOFCV/SsxrpmaCRMEFmqU08n6vc+TfAVlIKjR1BPVgt75pmtU9nbQll+4M9PN2tmZSAgD1kGUCKL88CscA=="
    crossorigin=""></script>

  <!-- Load Esri Leaflet Geocoder from CDN -->
  <link rel="stylesheet" href="https://unpkg.com/esri-leaflet-geocoder@3.1.1/dist/esri-leaflet-geocoder.css"
    integrity="sha512-IM3Hs+feyi40yZhDH6kV8vQMg4Fh20s9OzInIIAc4nx7aMYMfo+IenRUekoYsHZqGkREUgx0VvlEsgm7nCDW9g=="
    crossorigin="">
  <script src="https://unpkg.com/esri-leaflet-geocoder@3.1.1/dist/esri-leaflet-geocoder.js"
    integrity="sha512-enHceDibjfw6LYtgWU03hke20nVTm+X5CRi9ity06lGQNtC9GkBNl/6LoER6XzSudGiXy++avi1EbIg9Ip4L1w=="
    crossorigin=""></script>   
  <!-- FIN AGREGADO-->

Then, in the same file, if you search for 'mapa' you will find a couple of function calls on lines 254 and 384 and a function definition on line 608. You should add this to your functions.php
Of course, you must add the coordinates of each momitor you want to show up in the map.

So, I think I haven't missed anything.

Enjoy!

[mconfortino]

Forgot this:

[iconnor]

Are you licensing this under GPL? If so, we can just merge it into ZoneMinder. Will only do so if you agree of course.

[mconfortino]

Hi. Of course it's GPL. You can modify, change, merge, etc. Thank you very much.
Credit should go to Matías Figueroa.

[iconnor]

second link doesn't work for me.

[mconfortino]

Try this, please.

https://www.dropbox.com/s/zo40mxljw84vgka/mapa.zip?dl=0

[felipebenincasa]

Where can I find this part "Then, in the same file, if you search for 'mapa' you will find a couple of function calls on lines 254 and 384 and a function definition on line 608. You should add this to your functions.php"

Thanks

[lacibonds]

Thank you so much! I'll check out the link.

[mconfortino]

Hi!

Where can I find this part "Then, in the same file, if you search for 'mapa' you will find a couple of function calls on lines 254 and 384 and a function definition on line 608. You should add this to your functions.php"

It means that in your own /usr/share/zoneminder/www/skins/classic/includes/functions.php you should add the included code and the calls an definitions you wil find searching for the string "mapa" in my /usr/share/zoneminder/www/skins/classic/includes/functions.php, also included. Reason is, you may have changed your functions.php, so line numbers ar not the same as in the original file.

[iconnor]

I merged this code on a branch a long time ago, and just got around to merging it to master.

I reworked it a lot so it may be unrecognisable, but I want everyone know that the current map code is a direct result of this mapa.

[hector.reyesmoncayo]

Hi where can I find your file functions.php? I did not find it in the file mapa.zip

Thanks in advance

[burger]

It's also easy to just use an HTML imagemap and an iframe to view cameras. I was able to do the following (links below) in a couple hours.

I don't know if the map view in this thread has the option to view streams or not. Also I don't know if this view is only for a traditional street map, or if you can use any image. (I suppose i'll find out when 1.38 is released.)

viewtopic.php?t=32675
https://wiki.zoneminder.com/External_Li ... of_Cameras