http image data source point display in dashboard

craig

How would I display an image type point from the http image data source?

<ma-point-value point-xid="DP_663039" point="IFRcam"></ma-point-value>
{{IFRCam}}

yields:

IFR CAM: {"enabled":true,"templateXid":null,"loggingProperties":{"tolerance":0,"discardExtremeValues":false,"discardLowLimit":0,"discardHighLimit":0,"loggingType":"NONE","intervalLoggingType":"INSTANT","intervalLoggingPeriod":{"periods":15,"type":"MINUTES"},"overrideIntervalLoggingSamples":false,"intervalLoggingSampleWindowSize":0,"cacheSize":1},"textRenderer":{"type":"textRendererNone"},"chartRenderer":null,"modelType":"DATA_POINT","validationMessages":[],"pointLocator":{"timeoutSeconds":30,"retries":2,"webcamLiveFeedCode":"","scaleType":"SCALE_TYPE_NONE","scalePercent":25,"scaleWidth":100,"scaleHeight":100,"readLimit":10000,"modelType":"PL.HTTP_IMAGE","dataType":"IMAGE","settable":false,"relinquishable":false},"chartColour":"","deviceName":"Cameras","plotType":"STEP","purgeOverride":false,"purgePeriod":{"periods":1,"type":"YEARS"},"unit":"","dataSourceXid":"DS_932472","dataSourceId":35,"pointFolderId":1,"useIntegralUnit":false,"integralUnit":"s","useRenderedUnit":false,"renderedUnit":"","dataSourceName":"Cameras","readPermission":"","setPermission":"","id":60,"xid":"DP_863039","name":"IFR","value":"img-1.jpg","time":1462731590676,"convertedValue":null,"renderedValue":""}

but

<img ng-src="{{IFRCam.value}}">

produces a 404 at http://127.0.0.1/modules/dashboards/web/templates/img-1.jpg

flipbookchart.jsp has

 <img src="<%= ImageValueServlet.servletPath %>${imageValue.value.filename}?id=${point.id}"/>

but substituting the image value servlet servlet path in to the ng-src and changing the filename to .jsp results in the mango header being included.

soo this image probably needs to come by the REST API somehow ... any hints on how to proceed?

Will Geller

I probably wouldn't try to mix .jsp code with the new dashboards module. The image does not actually come over the rest api. It is just a normal http request for an image. ng-src allows angular to dynamically inject an image path as you are doing.

It looks like your code is correct for serving the image located on your server at http://127.0.0.1/modules/dashboards/web/templates/img-1.jpg

but it is not there. Are you sure the image is in the templates folder next to your html and named correctly to match the point value.

If you are able to access the image in the browser. Right click and open in a new tab, what is the url to the image? That is the image path you will need to reference to source up the image.

craig

Hi Will,

The image is not a static image, it is an mango image data point. Mango does not store the images at publicly accessible URLs. On the rest of mango the ImageValueServlet java code reads the images from a private folder on the disk and serves them to the client if they have the correct permissions etc.

I need to know how to retrieve an image from the API the dashboard uses given the image data point xid.

Craig

Jared Wiltshire

Hi Craig, I believe the REST API may not support the image data type correctly. Terry will be looking at this tomorrow.

craig

great thanks. we use the httpimage data source to retrieve images from cameras pointed at the process, such as a pond, so we get a visual record of the pond level to coincide with level measurements. It will be pretty slick to be able to iPad it all.

terrypacker

Craig,

Currently the REST api does not support image data types.

We are adding support for Image data types to the NoSQL point value store for Mango 2.8.0. It makes sense to implement all the REST api functionality for Image data types at the same time so we can bundle the testing. I've created a git issue to track our progress here:

https://github.com/infiniteautomation/ma-core-public/issues/719

Thanks,
Terry