Apex line chart not updating

3rd Party Modules
,
1

Hi folks,

I am using Apex charts to show data on a line graph and can be updated in real time mode
I am getting data through the named query "Tank1" with no parameters

I have used 2 scripts to gather the last 8 values as integers and it worked but unfortunately it doesn't update as the value changes

It works but unfortunately it doesn't update automatically but when I open the binding and press apply the data is updated but it doesn't update on itself

Below the first transform snippet and a screenshot for the binding

		Data = system.db.runNamedQuery("Galvenize/Tank1" )
		pyData = system.dataset.toPyDataSet(Data)
		

		newList = []
		 
		# step through the rows
		for row in pyData:
		    # create a new blank dictionary for each row of the data
		    newDict = {}
		    for i in range(len(row)):
		        newDict = row[i]
		     
		    newList.append(newDict)
		    
		    # Limit the results to last 5
		    value = newList[-8:]
		     
		return value

image
image1481×906 78.1 KB

2

Bindings update when instantiated (startup), and thereafter when a tag or property they use updates. You are configuring a property binding but have not selected a property to follow. Ergo, no updates.

Consider using a query binding to run your named query, and use the polling option to run it repeatedly. Then your transform will be handed a {value} that is the result dataset--you won't need system.db.runNamedQuery() in the script.

1 Like
3

It worked
Thanks a lot. really appreciate it

4

Do you have any Idea how to make the old real time data just disappear without changing the whole graph

5

Not sure what you mean.

6

7

The whole chart changes like in the video. If there is a method to make the old values just disappear without changing the graph. This will give much nicer graph

8

For smooth animation with Apex Charts, you can only append data to the series.

This also means that for long running charts you will eventually need to prune old values when the data array for the series gets too large.

1 Like
9

I have already done that by limiting the set to the last 8 recorded values through the script
The problem is that the graph shape totally changes with each update as shown in the video

10

@Travis.Cox @nader.chinichian

Do you have any idea how can the graph be smooth with real-time data

11

Use this in options and also use short time range like man 10 min to make it work. Also, Update every second with Asstored Value. It is important not to use aggregation for this.

{
  "chart": {
    "animations": {
      "dynamicAnimation": {
        "speed": 1000
      },
      "easing": "linear",
      "enabled": true
    },
    "dropShadow": {
      "blur": 5,
      "color": "#52AFDE",
      "enabled": true,
      "opacity": 0.7
    },
    "id": "realtime",
    "toolbar": {
      "show": false
    },
    "zoom": {
      "enabled": false
    }
  },
  "dataLabels": {
    "enabled": false
  },
  "grid": {
    "show": true
  },
  "legend": {
    "show": false
  },
  "markers": {
    "size": 0
  },
  "stroke": {
    "colors": [
      "#4E93EF"
    ],
    "curve": "smooth",
    "width": 3
  },
  "title": {
    "align": "left",
    "style": {
      "color": "var(--color-label-0)",
      "fontFamily": "D-DIN",
      "fontSize": 20,
      "fontWeight": 300
    },
    "text": "Usage Of Last day Electricity"
  },
  "xaxis": {
    "labels": {
      "style": {
        "colors": "var(--color-label-2)",
        "cssClass": "",
        "fontFamily": "D-DIN"
      }
    },
    "range": 60000,
    "type": "datetime"
  },
  "yaxis": {
    "decimalsInFloat": false,
    "labels": {
      "align": "right",
      "style": {
        "colors": "var(--color-label-2)",
        "cssClass": "",
        "fontFamily": "D-DIN"
      }
    },
    "opposite": true
  }
}
2 Likes
12

Yes exactly, you need the same values with identical timestamps each time the data refreshes.

13

I don't know what I have done wrong but it give me that result

14

Things had become much better
Time on X-Axis is updating and I have changed the format with a script
Animations give me a smooth look but I can't get rid of the snap shot style