Product introduction Product pricing Quick start Detailed guidance
Components
Chart
Line chart Bar chart
Basic bar chart Horizontal bar chart Horizontal capsule diagram Stacked bar chart
Pie chart
Basic pie chart Pie chart for indicator comparison Percentage pie chart Nightingale graph Pie chart with figure Carousel pie chart Gap pie chart
Radar chart
Radar chart Radar chart - polygonal Radar chart - circular
Scatter chart
Scatter chart Bubble chart
Dial
Basic dial Time dial Speed dial
Others
Text Map Multi-media
Video player RTMP player Single image iframe loader
Control Source material
Data usage
Example demonstration Service agreement Service level agreement

# Data filter

OneNET View 2.0 supports the user-defined filters. Users can write javascript code by themselves, and realize the data structure conversion, filtering and some simple calculations with the help of filters.

ECMAScript syntax of edition es6 and later is not supported at the moment.

You may need to use a data filter when:

  1. The value of the data source is not in the same format of that in the component;

  2. A component needs to use multiple data sources at the same time;

Click the data filter and check the box to enable the data filter function. Enter your code in the code editing area. The filter will be provided with code security monitoring prior to use, and the filter will not be used until it passes the security monitoring.

Data filter type

OneNET View 2.0 contains two types of filters:

private filter: each component has a filter that does not affect other components, and the filter can only be used by the component itself.

Global filter: some filters that each component can choose to use or not can be designed. Any modification to these filters will affect all the components by which they are used.

Filter transfer parameter

Each OneNET View 2.0 filter is a javascript function. We have pre-defined the following three parameters of this filter function: data, rootData and variables:

data: data source data selected by current component

rootData: the root object that contains all data source data

variables: callback variable

is the data source list of . It is an object with - as the key value pair, including data source in the item, wherein , and are , followed by the current data of the data source.

{
  "OneNET": [
    {
      "update_at": "2019-02-28 14:10:47",
      "id": "line2",
      "create_time": "2017-12-08 15:08:40",
      "current_value": 65,
      "at": "2019-02-28 14:10:47",
      "value": 65
    }
  ],
  "OneNET1": [
    {
      "create_time": "11/22/2017 2:21:15 PM",
      "id": "map"
    }
  ],
  "staticDemo": [
    {
      "x": "2010/01/01 00:00:00",
      "y": 375,
      "s": "1"
    },
    {
      "x": "2010/01/01 00:00:00",
      "y": 180,
      "s": "2"
    },
    ...
  ]
}

Take this OneNET View 2.0 List of data sources for example. Suppose that OneNET is selected with the data source selection drop-down box, then the value of parameter data is

[
  {
    update_at: '2019-02-28 14:10:47',
    id: 'line2',
    create_time: '12/8/2017 3:08:40 PM',
    current_value: 65,
    at: '2019-02-28 14:10:47',
    value: 65,
  },
];

Filter example

More than two data sources used in a component at the same time

Also take the data source mentioned above for example. Suppose a component needs the data of data source OneNET and data source staticDemo, then we will select OneNET from the data source drop-down box, and then write this in the filter:

//what the data in the code obtains is the OneNET data source selected from the data source drop-down box.
var staticDemo = rootData.staticDemo; // Similarly, other data sources such as OneNET1 can use rootData.OneNET1to obtain 
function last(arr) {
  var len = arr ? arr.length : 0;
  if (len) return arr[len - 1];
}

return [{
    "value": last(staticDemo).x + ' ' + last(data).value
}]

个搜索结果,搜索内容 “

    0 个搜索结果,搜索内容 “