MQTT Image item

[jvanzuijlen]

I’m trying to get an image to show up via the MQTT V2 binding, but no luck as of yet:

thing

Thing mqtt:topic:onkyo "Onkyo TX-NR525" (mqtt:broker:manus-broker) {
  Channels:
    Type image: cover "Cover Art" [
      stateTopic="onkyo/status/cover-art"
    ]
}

Item

Image  imLivingStereoImage          "Now playing"              { channel="mqtt:topic:onkyo:cover" }

Test
mosquitto_pub -t onkyo/status/cover-art -f test.bmp

In the UI I only see a though. Any pointers?

Thanks!

[rlkoshak (Rich Koshak)]

What is the format of the image posted to that topic? What type of image is it?

The docs indicate that the raw binary should be posted and only those images supported by Java (png, jpg, bmp, etc) are supported.

[jvanzuijlen]

test.log (17.1 KB)
Hi Rich, thanks for reaching out. The image is a BMP, which is sent my the Onkyo receiver which is working fine with the official Onkyo binding.
I attached it as a log file, since I’m not allowed to upload BMP file. If you rename to .bmp then you have what I have.

[Wolfgang_S]

You either need to receive the image from MQTT and save it to a folder and display it from there as static image or convert it to RawType as defined by OH. RawType is not just am image format like png, jpg, bmp it also includes the mime type. The image itself needs to be base64 encoded.

This FAQ ( FAQ | openHAB ) also mentions RawType to be used. As there is also the class I would assume that the way to do it.
This is the definition of the RawType: RawType (openHAB Core 3.1.0-SNAPSHOT API)

Example from this post ::

Chromecast_Audio1_Kitchen_Image.postUpdate("data:image/png;base64,iVBORw0KGgoAAA........AAElFTkSuQmCC")

( base64 encoded image is shortened ).
The first part ( data:image/png;base64 ) is the mime type that is related to the base64 encode image. After the comma you find the base64 encoded image.
This follows the HTML capabilties: How to Display Base64 Images in HTML .

It is not necessary to use external web services to base64 encode the image you can do this on linux command line with the base64 command. python, javascript and other languages as well support encoding to and decoding of base64 ‘objects’.

[rlkoshak (Rich Koshak)]

@Wolfgang_S

You either need to receive the image from MQTT and save it to a folder and display it from there as static image or convert it to RawType as defined by OH. RawType is not just am image format like png, jpg, bmp it also includes the mime type. The image itself needs to be base64 encoded.

That’s what I assumed too but if that is truly the case then the binding docs are wrong.

Channel Type “image”

You can connect this channel to an Image item. This is a read-only channel.

The channel expects values on the corresponding MQTT topic to contain the binary data of a bmp, jpg, png or any other format that the installed java runtime supports.

The way I read that is that the binding handles all the RawType, MIME-type and Base64 encoding. I still have in my mind questions about how it can tell what type of image it is but I know most image formats have some magic numbers at the beginning that do that job so figured it was using that.

[jvanzuijlen]

I toyed with it some more, and it turns out my test works fine in all the other UIs (including third party). It’s just Paper UI that fails to render the image correctly. Why, I do not know, but since paper UI is for dev mostly, it’s something I can live with.

Thanks for the support nonetheless!

[ubeaut (Greg)]

The image type works in openhab 3 main UI and mosquitto.

How to get a jpg file into an image item

I do a time lapse of the weather so I generate a jpg image every minute and I send this image via MQTT to OH3 and display it in an oh-image-card. The image is displayed on my overview page and it refreshes every minute. I don’t convert to base64 as it “just works” Here is the mosquito code: mosquitto_pub -h 192.168.0.164 -t raw/weatherimage -f image.jpg [image] The image is about 92kb. Here is what it looks like in the item view: [image]