How to display sensors and webcam on your website - Public Monitoring Project

Examples of IoT solutions | REST API for Apps | How to transfer readings | How to add a sensor to the map | How to add a webcam to the map

+ Map of public sensors and webcams nearby the location of the visitor to your site.

The following code should be inserted at the right place in the HTML-page on your site between the tags <body>...</body>.

You can set the map zoom (from 1 to 23) by adding "zoom" parameter to the "src" attribute:

<iframe src="https://narodmon.com/?zoom=12" width="640" height="480" scrolling="no" frameborder="0"></iframe>

You can specify the map type (map - schema, satellite, hybrid - scheme+satellite), adding to the "src" attribute parameter "map":

<iframe src="https://narodmon.com/?map=hybrid" width="640" height="480" scrolling="no" frameborder="0"></iframe>

You can use both parameters "map" and "zoom":

<iframe src="https://narodmon.com/?map=hybrid&zoom=12" width="640" height="480" scrolling="no" frameborder="0"></iframe>

width - width of the displayed map in pixels height - map height in pixels.

It is possible to display on the map only sensors of a certain type, for example radiation and UV radiation, using the "types" parameter:

<iframe src="https://narodmon.com/?types=12,20" width="640" height="480" scrolling="no" frameborder="0"></iframe>

* To use Yandex.Maps as a substrate, use the domain narodmon.ru in the links, and for Google Maps the domain narodmon.com.

+ Map centred on the location of the specified monitoring device or webcam

The following code should be inserted at the right place in the HTML-page on your site between the tags <body>...</body>.
You should replace ID in URL to the ID of the public (accessible to all) monitoring device or webcam.
You can find the device ID in its balloon on the map project.
In the case of a webcam ID must be negative!

<iframe src="https://narodmon.com/ID" width="640" height="480" scrolling="no" frameborder="0"></iframe>

You can specify the map type (map - scheme, satellite, hybrid - scheme+satellite), adding to the "src" attribute parameter "map":

<iframe src="https://narodmon.com/ID?map=hybrid" width="640" height="480" scrolling="no" frameborder="0"></iframe>

width - width of the displayed map in pixels height - map height in pixels.

It is possible to display on the map only sensors of a certain type, for example radiation and UV radiation, using the "types" parameter:

<iframe src="https://narodmon.com/ID?types=12,20" width="640" height="480" scrolling="no" frameborder="0"></iframe>

* To use Yandex.Maps as a substrate, use the domain narodmon.ru in the links, and for Google Maps the domain narodmon.com.
** If specified device will not work more than 3 hours or you specify an incorrect ID, your website visitors will see an error message.

+ Map showing public sensors of the desired types and webcams in the specified region

The following code should be inserted at the right place in the HTML-page on your site between the tags <body>...</body>.
Parameters lat and lon - is the latitude and longitude of the center of the region in decimal form.

<iframe src="https://narodmon.com/?lat=55.75222&lon=37.61556" width="640" height="480" scrolling="no" frameborder="0"></iframe>

You can set the map zoom (from 1 to 23) by adding "zoom" parameter to the "src" attribute:

<iframe src="https://narodmon.com/?lat=55.75222&lon=37.61556&zoom=12" width="640" height="480" scrolling="no" frameborder="0"></iframe>

You can specify the map type (map - schema, satellite, hybrid - scheme+satellite), adding to the "src" attribute parameter "map":

<iframe src="https://narodmon.com/?lat=55.75222&lon=37.61556&map=hybrid" width="640" height="480" scrolling="no" frameborder="0"></iframe>

You can use both parameters "map" and "zoom":

<iframe src="https://narodmon.com/?lat=55.75222&lon=37.61556&map=hybrid&zoom=12" width="640" height="480" scrolling="no" frameborder="0"></iframe>

width - width of the displayed map in pixels height - map height in pixels.

It is possible to display on the map only sensors of a certain type, for example radiation and UV radiation, using the "types" parameter:

<iframe src="https://narodmon.com/?lat=55.6254&lon=40.9650&zoom=6&types=12,20" width="640" height="480" scrolling="no" frameborder="0"></iframe>

* To use Yandex.Maps as a substrate, use the domain narodmon.ru in the links, and for Google Maps the domain narodmon.com.
** To generate a link to a frame on the Project website, select the optimal map center and scale, then the map type in the "Layers" menu, then select the desired sensor types in the "View" menu and click on "Map Link".

+ mapBounds - query list of sensors and webcams in the specified rectangular area of ​​the map

* The number of devices in the response (without agreement) is limited to 10. Your limit in Profile \ My Applications.

Request parameters:
- bounds array of coordinates of the corners of the viewport {min latitude, min longitude, max latitude, max longitude} in decimal form;
- metar optional, if = 1, then include METAR data in the region in the server response (authorization required);
- owmap optional, if = 1, then include OWMap data in the region in the server response (authorization required);
- types optional array of sensor type ids for display filter from directory appInit.

Server Response:
- devices an array with the list of devices and their sensors in a selected field of view (limited by PubsLimit);
- devices[id] integer code of the device in the project;
- devices[name] the device name or its ID (if no name);
- devices[lat], devices[lon] the latitude and longitude of the device in decimal form;
- devices[time] time of the last sensor value in UnixTime;
- devices[value] the value of the sensor to the balun devices (with max priority);
- devices[type] the type code of sensor (see appInit);
- devices[unit] unit of measurement;
- webcams an array with a list of web cameras in the selected view area
- webcams[id] integer code of a web camera in the project;
- webcams[name] the name of the webcam (as called by the owner);
- webcams[lat], webcams[lon] the latitude and longitude of Webcams in decimal form;
- webcams[time] time of last download the snapshot to the server in UnixTime;
- webcams[image] the URL of the latest snapshot with the webcam.

Request example REST(GET):
http://api.narodmon.com/mapBounds?bounds=10,20,11,21&uuid=UUID&lang=en&limit=10

Request example JSON(POST):
{"cmd":"mapBounds","limit":10,"bounds":[10,20,11,21],"uuid":"UUID","lang":"en"}

Server response:
{"devices":[{"id":0,"name":"..","lat":39.962502,"lon":-83.006104,"time":1733366020,"value":0.0,"type":0,"unit":""},{..}],
"webcams":[{"id":0,"name":"..","lat":39.962502,"lon":-83.006104,"time":1733366020,"image":"http://..."},{..}]}