ownTracks mqtt raw data


I have a short question: I like to get the raw data from owntracks via mqtt. I like to extract the position to show on the map widget.

String mqttPositionChrisRaw "Chris Raw Data [%s]" (location_Chris,MQTT) {mqtt="<[mosquitto:/owntracks/chris/iPhone6:state:default]"}

it is working with other sensors delivering numeric data:

String mqttTest "Test [%s]" (location_Chris,MQTT) {mqtt="[mosquitto:/Outside/DHT22/Temperature:state:default]"}

But not with the data from ownTracks. I*m using mqttspy and the server receives the jason data from the owntracks app. - The Mqttitude binding seems not to delivere me the postion coordinates - or am I wrong?

Thank you for any advice.


Short answer: mqttitude binding (if using new config mode, at least) will only trigger area leave/enter events, AFAIK it won’t even read the location info.

But ‘short’ questions tend to omit input needed to solve complex issues :slight_smile:
You’re asking for mqttitude binding, but your example shows you are trying to use mqtt binding…
I haven’t tried, but in principle, it should work to retrieve your location that way (provided you use the right MQTT topic string and postprocessing).

Btw, can you share your ‘map widget’ config ? It’s been on my todo list for long to visualize whereabouts. I just knew the owntracks recorder approach, didn’t know it could be done inside OH.

I did some tests and found out that there is a difference if the toppic starts with a leading slash / or not. The specs not openHAB related I found are saying toppics do not start with a leading /

And a single / seams to be a valid toppic too!

But most definition of topics related to the openHAB binding are beginning with a slash.

mytracks uses topic definition without a leading slash.

The correct items are:

Group location_Chris
Location locationChris 						(location_Chris)
String   mqttPositionChrisRaw   "Chris Raw Data [%s]"	(location_Chris,MQTT)	{mqtt="<[mosquitto:owntracks/chris/iPhone6:state:default]"}
Number   mqttChrisLatitude     "Chris's Lat [%.3f °]"		(location_Chris)	
Number   mqttChrisLongitude    "Chris's Lon [%.3f °]"		(location_Chris)	
Number   mqttChrisAccuracy     "Chris's Genauigkeit [%.1f m]"	(location_Chris)	
Number   mqttChrisBattery      "Chris's iPhone Akku [%s%%]"	(location_Chris,Phone,MQTT,Battery)

The Sitemap (working with local and remote URL in the iOS App) :

	Text label="Karte" {
			Webview url="" height=5
			Text item=mqttPositionChrisRaw
			Text item=mqttChrisLatitude
			Text item=mqttChrisLongitude
			Text item=mqttChrisAccuracy
			Text item=mqttChrisBattery 

The Rule:

import org.openhab.core.library.types.*
import org.openhab.core.persistence.*
import org.openhab.model.script.actions.*

rule "MqttPostionParseChris"
    Item mqttPositionChrisRaw changed
    val String json = (mqttPositionChrisRaw.state as StringType).toString
    val String type = transform("JSONPATH", "$._type", json)
    if (type == "location") {
      val String lat  = transform("JSONPATH", "$.lat", json)
      val String lon  = transform("JSONPATH", "$.lon", json)
      val String acc  = transform("JSONPATH", "$.acc", json)
      val String batt = transform("JSONPATH", "$.batt", json)

      postUpdate(mqttChrisLatitude,new DecimalType(lat))
      postUpdate(mqttChrisLongitude,new DecimalType(lon))
      locationChris.postUpdate(new PointType(lat + "," + lon))
      mqttChrisAccuracy.postUpdate(new DecimalType(acc))
      mqttChrisBattery.postUpdate(new PercentType(batt))
    logInfo("Location","New Location: Chris " + locationChris + "!")

(type conversions are a little bit messy but working) Waypoints can be easyly implemented here to trigger events when entering and leaving Waypoints - comming soon ;).

Don*t forget to reposte your location form the ownTracks app by manual mode and push publish button during testing and debugging…

Mapview is only working on the WebUI with a nice openStreetMap but I could not managed to get it working in the iOS app,

So I followed the guide found here: https://github.com/openhab/openhab/wiki/GoogleMap and used the webview item: Placed the html file in /webapp/satic/map.html

<!DOCTYPE html>
    <style type="text/css">
    .Flexible-container {
      position: relative;
      padding-bottom: 0px;
      padding-top   : 0px;
      height        : 345px ;
      overflow: hidden;

    .Flexible-container iframe,
    .Flexible-container object,
    .Flexible-container embed {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
    <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?v=3.exp&libraries=places,drawing,geometry"></script>

    <script type="text/javascript">
        // Google Maps JavaScript API:
        // https://developers.google.com/maps/documentation/javascript/?hl=de
        // Marker Icons:
        // https://sites.google.com/site/gmapsdevelopment/

        // JQuery

        var map = null;
        //make an empty bounds variable
        var bounds = new google.maps.LatLngBounds();

        // LatLng's we want to show
        var latlngHome   = new google.maps.LatLng("XX.YYYY", "XX.YYYYY"); // use your home coordinates
        var latlngChris = new google.maps.LatLng("XX.YYYY", "XX.YYYYY"); // initialize to home ...
        var latlngUser2  = new google.maps.LatLng("XX.YYYY", "XX.YYYYY"); // initialize to home ...
        // ad more users if nessesary

        var map_options = { center    : latlngHome,
                            zoom      : 10,
                            mapTypeId : google.maps.MapTypeId.ROADMAP };

        $( "#map_canvas" ).ready($(function() {
          var map_canvas = document.getElementById('map_canvas');
          map = new google.maps.Map(map_canvas, map_options)

          var marker = new google.maps.Marker({
                            position  : latlngHome,
                            map       : map,
                            icon      : 'http://maps.google.com/mapfiles/kml/pal2/icon10.png',
                            title     : "Schöneiche"

           var circle = new google.maps.Circle({
                        center        : latlngHome,
                        radius        : 1500,
                        map           : map,
                        strokeColor   : '#050505',
                        strokeOpacity : 0.5,
                        strokeWeight  : 2,
                        fillColor     : '#000000',
                        fillOpacity   : 0,
                      }); // end of [Circle]


        $( document ).ready($(function() {
            // ******************************************************************************
              url     : "../rest/items/locationChris/state/",
              data    : {},
              success : function( data ) {
                  if ( map == null) { return; }
                  if ( data == "Uninitialized") { return; }

                  var coords = data.split(',');
                  var latlngChris = new google.maps.LatLng(coords[0],coords[1]);

                  var marker = new google.maps.Marker({
                    position  : latlngChris,
                    map       : map,
                    icon      : 'http://maps.google.com/mapfiles/ms/icons/green-dot.png',
                    title     : "Chris"
                  }) // end of [Marker]

                    url     : "../rest/items/mqttChrisAccuracy/state/",
                    data    : {},
                    success : function( data ) {
                    if ( data == "Uninitialized") { return; }
                      var accuracy = parseInt(data);
                      var circle = new google.maps.Circle({
                        center        : latlngChris,
                        radius        : accuracy,
                        map           : map,
                        strokeColor   : '#00FF00',
                        strokeOpacity : 0.8,
                        strokeWeight  : 2,
                        fillColor     : '#00FF00',
                        fillOpacity   : 0.35,
                      }); // end of [Circle]


                    } // end of [function]
                  }) // end of [$.ajax]
                } // end of [function]
            }) // end of [$.ajax]
            // ******************************************************************************
           // Copy paste for each user
          // ******************************************************************************
    <div id="map_canvas" class="Flexible-container" />

EDIT: Made a tiniy mistake. in the HTML there where 3 dots instead of 2 (get the location via rest-api and/or last updates of the ios app solved some issues too. Now everything work as expected.


Did you ever get this working on ios? I am having the same issue.

No, unfortunately not. I did not to many tests because the main feature, switching the garden lights on after entering the “home” waypoint after sunset works. (And checking the window status when leaving and other more useful things than having a fancy map;)

I reinstalled everything after a defect on my usb-flash drive! I had a bacup of my configurations BUT the map.html sit in the webapp/static folder so I had to rewrite this :slight_smile:

Going through the html file i found 3 dots instead of 2 in this line

url : "../rest/items/locationChris/state/",

Ups, thats why the markers don’t show up.

Yea mine works everywhere except via the Webview in the IOS app also… :frowning: