Merge pull request #87 from pierosavi/improve-display-values

Improve display value

CHANGELOG.md

@@ -1,3 +1,9 @@
+# v1.0.3
+
+## Improvements
+
+* Better data format to support more data sources
+
 # v1.0.2
 
 ## Fix

src/ImageItPanel.tsx

@@ -1,18 +1,26 @@
 import React, { useEffect, useRef, useState } from 'react';
-import { PanelProps } from '@grafana/data';
+import { PanelProps, getFieldDisplayValues, ReducerID } from '@grafana/data';
 import { SimpleOptions } from './types/SimpleOptions';
 import { css, cx } from 'emotion';
 import _ from 'lodash';
 // import { stylesFactory, useTheme } from '@grafana/ui';
-import { stylesFactory } from '@grafana/ui';
+import { stylesFactory, useTheme } from '@grafana/ui';
 import { Sensor } from './Sensor';
 import SensorType from './types/Sensor';
 
 interface Props extends PanelProps<SimpleOptions> {}
 
-export const ImageItPanel: React.FC<Props> = ({ options, data, width, height, onOptionsChange, fieldConfig }) => {
+export const ImageItPanel: React.FC<Props> = ({
+  options,
+  data,
+  width,
+  height,
+  onOptionsChange,
+  fieldConfig,
+  replaceVariables,
+}) => {
   const { forceImageRefresh, lockSensors, mappings, sensors, sensorsTextSize } = options;
-  //  const theme = useTheme();
+  const theme = useTheme();
   const styles = getStyles();
 
   const imageRef = useRef<HTMLImageElement>(null);
@@ -69,12 +77,21 @@ export const ImageItPanel: React.FC<Props> = ({ options, data, width, height, on
               sensor.query.id ? sensor.query.id === serie.refId : sensor.query.alias === serie.name
             );
 
-            // Assume value is in field with name 'Value'
-            // This could be a problem for some data sources
-            const field = serie?.fields.find(field => field.name === 'Value');
-
-            // Get last value of values array
-            const value = field?.values.get(field.values.length - 1);
+            let value = undefined;
+
+            if (serie !== undefined) {
+              const fieldDisplay = getFieldDisplayValues({
+                data: [serie],
+                reduceOptions: {
+                  calcs: [ReducerID.last],
+                },
+                fieldConfig,
+                replaceVariables,
+                theme,
+              })[0];
+
+              value = fieldDisplay.display.numeric;
+            }
 
             // Get mapping by id || undefined
             const mapping = sensor.mappingId ? mappings.find(mapping => sensor.mappingId === mapping.id) : undefined;