You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@streampipes.apache.org by ri...@apache.org on 2022/08/08 08:42:27 UTC

[incubator-streampipes] branch dev updated (eca719202 -> d32262583)

This is an automated email from the ASF dual-hosted git repository.

riemer pushed a change to branch dev
in repository https://gitbox.apache.org/repos/asf/incubator-streampipes.git


    from eca719202 [STREAMPIPES-564] Fix group by update bug
     new c7c607451 [hotfix] Fix rendering of stacked area chart
     new d72d5989c [hotfix] Add more logging to OPC-UA adapter
     new fbf11d498 [hotfix] Improve resizing of echarts widgets
     new d32262583 Merge branch 'dev' of github.com:apache/incubator-streampipes into dev

The 4 revisions listed above as "new" are entirely new to this
repository and will be described in separate emails.  The revisions
listed as "add" were already present in the repository and have only
been added to this reference.


Summary of changes:
 .../connect/iiot/adapters/opcua/OpcUaAdapter.java  | 327 +++++++++++----------
 .../components/grid/dashboard-grid.component.html  |   3 +-
 .../components/grid/dashboard-grid.component.ts    |  22 +-
 .../panel/dashboard-panel.component.html           |   1 +
 .../standalone/standalone-dashboard.component.ts   |   1 -
 .../widget/dashboard-widget.component.html         |  14 +
 .../widget/dashboard-widget.component.ts           |  44 ++-
 .../bar-race/bar-race-widget.component.html        |   6 +-
 .../bar-race/bar-race-widget.component.scss        |   9 -
 .../widgets/bar-race/bar-race-widget.component.ts  |   6 +-
 .../components/widgets/base/base-echarts-widget.ts |  12 +-
 .../components/widgets/base/base-widget.ts         |  31 +-
 .../stacked-line-chart-widget.component.html       |   6 +-
 .../stacked-line-chart-widget.component.scss       |   9 -
 .../stacked-line-chart-widget.component.ts         |  45 +--
 ui/src/app/dashboard/services/resize.service.ts    |   6 +-
 16 files changed, 287 insertions(+), 255 deletions(-)


[incubator-streampipes] 01/04: [hotfix] Fix rendering of stacked area chart

Posted by ri...@apache.org.
This is an automated email from the ASF dual-hosted git repository.

riemer pushed a commit to branch dev
in repository https://gitbox.apache.org/repos/asf/incubator-streampipes.git

commit c7c60745194c8eaa6a85b532d014243f1aff1bf4
Author: Dominik Riemer <do...@gmail.com>
AuthorDate: Fri Aug 5 16:12:05 2022 +0200

    [hotfix] Fix rendering of stacked area chart
---
 .../components/grid/dashboard-grid.component.html  |  2 +-
 .../panel/dashboard-panel.component.html           |  1 +
 .../components/widgets/base/base-echarts-widget.ts |  3 +-
 .../stacked-line-chart-widget.component.ts         | 45 ++++++++++++----------
 4 files changed, 28 insertions(+), 23 deletions(-)

diff --git a/ui/src/app/dashboard/components/grid/dashboard-grid.component.html b/ui/src/app/dashboard/components/grid/dashboard-grid.component.html
index d0d379531..1e9a69f15 100644
--- a/ui/src/app/dashboard/components/grid/dashboard-grid.component.html
+++ b/ui/src/app/dashboard/components/grid/dashboard-grid.component.html
@@ -16,7 +16,7 @@
   ~
   -->
 
-<div *ngIf="dashboard.displayHeader" class="text-center">
+<div *ngIf="dashboard && dashboard.displayHeader" class="text-center">
     <h2>{{dashboard.name}}</h2>
     <h3>{{dashboard.description}}</h3>
 </div>
diff --git a/ui/src/app/dashboard/components/panel/dashboard-panel.component.html b/ui/src/app/dashboard/components/panel/dashboard-panel.component.html
index a0684c5f2..2b09d951f 100644
--- a/ui/src/app/dashboard/components/panel/dashboard-panel.component.html
+++ b/ui/src/app/dashboard/components/panel/dashboard-panel.component.html
@@ -58,6 +58,7 @@
                         [headerVisible]="headerVisible"
                         (updateCallback)="updateAndQueueItemForDeletion($event)"
                         (deleteCallback)="removeAndQueueItemForDeletion($event)"
+                        *ngIf="dashboard"
                         class="h-100 dashboard-grid"></dashboard-grid>
     </div>
 </sp-basic-view>
diff --git a/ui/src/app/dashboard/components/widgets/base/base-echarts-widget.ts b/ui/src/app/dashboard/components/widgets/base/base-echarts-widget.ts
index ff3773481..ebfcf10b9 100644
--- a/ui/src/app/dashboard/components/widgets/base/base-echarts-widget.ts
+++ b/ui/src/app/dashboard/components/widgets/base/base-echarts-widget.ts
@@ -50,8 +50,9 @@ export abstract class BaseEchartsWidget extends BaseStreamPipesWidget {
   }
 
   applySize(width: number, height: number) {
+    console.log(height);
     if (this.eChartsInstance) {
-      this.eChartsInstance.resize({width, height});
+      this.eChartsInstance.resize({width, height: height});
     }
   }
 
diff --git a/ui/src/app/dashboard/components/widgets/stacked-line-chart/stacked-line-chart-widget.component.ts b/ui/src/app/dashboard/components/widgets/stacked-line-chart/stacked-line-chart-widget.component.ts
index d7cd1da14..90c471696 100644
--- a/ui/src/app/dashboard/components/widgets/stacked-line-chart/stacked-line-chart-widget.component.ts
+++ b/ui/src/app/dashboard/components/widgets/stacked-line-chart/stacked-line-chart-widget.component.ts
@@ -24,7 +24,7 @@ import { StackedLineChartConfig } from './stacked-line-chart-config';
 import { EChartsOption } from 'echarts';
 import { DatalakeRestService } from '@streampipes/platform-services';
 import { BaseNgxLineChartsStreamPipesWidget } from '../base/base-ngx-line-charts-widget';
-import { WidgetConfigBuilder } from "../../../registry/widget-config-builder";
+import { WidgetConfigBuilder } from '../../../registry/widget-config-builder';
 
 
 @Component({
@@ -39,6 +39,12 @@ export class StackedLineChartWidgetComponent extends BaseEchartsWidget implement
   timestampField: string;
 
   chartOption = {
+    grid: {
+      left: 50,
+      top: 10,
+      right: 50,
+      bottom: 100
+    },
     tooltip: {
       trigger: 'axis',
       formatter (params) {
@@ -71,11 +77,12 @@ export class StackedLineChartWidgetComponent extends BaseEchartsWidget implement
       }
     },
     series: [],
-    animationDuration: 500
+    animationDuration: 300
   };
 
   constructor(dataLakeService: DatalakeRestService, resizeService: ResizeService) {
     super(dataLakeService, resizeService);
+    this.configReady = true;
   }
 
   protected extractConfig(extractor: StaticPropertyExtractor) {
@@ -84,38 +91,34 @@ export class StackedLineChartWidgetComponent extends BaseEchartsWidget implement
     this.chartOption.yAxis.axisLabel.textStyle.color = this.selectedPrimaryTextColor;
   }
 
-  protected onEvent(event: any) {
+  protected onEvent(events: any) {
     this.dynamicData = this.chartOption;
-    const timestamp = event[BaseNgxLineChartsStreamPipesWidget.TIMESTAMP_KEY];
+    this.dynamicData.series = [];
+
     this.valueFields.forEach(field => {
-      if (this.dynamicData.series.some(d => d.name === field)) {
-        const date = new Date(timestamp);
-        this.dynamicData.series.find(d => d.name === field).data.push(
-            {'name': date.toString(), value: [timestamp, event[field]]}
-        );
-        if (this.dynamicData.series.find(d => d.name === field).data.length > 5) {
-          this.dynamicData.series.find(d => d.name === field).data.shift();
-        }
-      } else {
-        this.dynamicData.series.push(this.makeNewSeries(field, timestamp, event[field]));
-      }
+      const series = this.makeNewSeries(field);
+      series.data = events.map(event => {
+        const timestamp = event[BaseNgxLineChartsStreamPipesWidget.TIMESTAMP_KEY];
+        return {
+          'name': timestamp.toString(),
+          value: [timestamp, event[field]]
+        };
+      });
+      this.dynamicData.series.push(series);
     });
 
     if (this.eChartsInstance) {
       this.eChartsInstance.setOption(this.dynamicData as EChartsOption);
     }
+
   }
 
-  makeNewSeries(seriesName, timestamp, value) {
-    const date = new Date(timestamp);
+  makeNewSeries(seriesName: string): any {
     return {
       type: 'line',
       smooth: true,
       name: seriesName,
-      data: [{
-        'name': date.toString(),
-        value: [timestamp, value]
-      }],
+      data: [],
     };
   }
 


[incubator-streampipes] 02/04: [hotfix] Add more logging to OPC-UA adapter

Posted by ri...@apache.org.
This is an automated email from the ASF dual-hosted git repository.

riemer pushed a commit to branch dev
in repository https://gitbox.apache.org/repos/asf/incubator-streampipes.git

commit d72d5989c9c0824f3511d9f559545f6beda8f0d9
Author: Dominik Riemer <do...@gmail.com>
AuthorDate: Sun Aug 7 21:00:28 2022 +0200

    [hotfix] Add more logging to OPC-UA adapter
---
 .../connect/iiot/adapters/opcua/OpcUaAdapter.java  | 327 +++++++++++----------
 1 file changed, 172 insertions(+), 155 deletions(-)

diff --git a/streampipes-extensions/streampipes-connect-adapters-iiot/src/main/java/org/apache/streampipes/connect/iiot/adapters/opcua/OpcUaAdapter.java b/streampipes-extensions/streampipes-connect-adapters-iiot/src/main/java/org/apache/streampipes/connect/iiot/adapters/opcua/OpcUaAdapter.java
index 0faffd00e..0538a0c7d 100644
--- a/streampipes-extensions/streampipes-connect-adapters-iiot/src/main/java/org/apache/streampipes/connect/iiot/adapters/opcua/OpcUaAdapter.java
+++ b/streampipes-extensions/streampipes-connect-adapters-iiot/src/main/java/org/apache/streampipes/connect/iiot/adapters/opcua/OpcUaAdapter.java
@@ -41,7 +41,10 @@ import org.apache.streampipes.sdk.utils.Assets;
 import org.eclipse.milo.opcua.sdk.client.api.subscriptions.UaMonitoredItem;
 import org.eclipse.milo.opcua.stack.core.types.builtin.DataValue;
 import org.eclipse.milo.opcua.stack.core.types.builtin.NodeId;
+import org.eclipse.milo.opcua.stack.core.types.builtin.StatusCode;
 import org.eclipse.milo.opcua.stack.core.types.enumerated.TimestampsToReturn;
+import org.slf4j.Logger;
+import org.slf4j.LoggerFactory;
 
 import java.util.*;
 import java.util.concurrent.CompletableFuture;
@@ -50,185 +53,199 @@ import java.util.concurrent.TimeUnit;
 
 public class OpcUaAdapter extends PullAdapter implements SupportsRuntimeConfig {
 
-    public static final String ID = "org.apache.streampipes.connect.iiot.adapters.opcua";
+  public static final String ID = "org.apache.streampipes.connect.iiot.adapters.opcua";
+  private static final Logger LOG = LoggerFactory.getLogger(OpcUaAdapter.class);
 
-    private int pullingIntervalMilliSeconds;
-    private SpOpcUaClient spOpcUaClient;
-    private List<OpcNode> allNodes;
-    private List<NodeId> allNodeIds;
-    private int numberProperties;
-    private Map<String, Object> event;
+  private int pullingIntervalMilliSeconds;
+  private SpOpcUaClient spOpcUaClient;
+  private List<OpcNode> allNodes;
+  private List<NodeId> allNodeIds;
+  private int numberProperties;
+  private Map<String, Object> event;
 
-    public OpcUaAdapter() {
-        super();
-        this.numberProperties = 0;
-        this.event = new HashMap<>();
-    }
+  public OpcUaAdapter() {
+    super();
+    this.numberProperties = 0;
+    this.event = new HashMap<>();
+  }
 
-    public OpcUaAdapter(SpecificAdapterStreamDescription adapterStreamDescription) {
-        super(adapterStreamDescription);
-        this.numberProperties = 0;
-        this.event = new HashMap<>();
-    }
+  public OpcUaAdapter(SpecificAdapterStreamDescription adapterStreamDescription) {
+    super(adapterStreamDescription);
+    this.numberProperties = 0;
+    this.event = new HashMap<>();
+  }
 
-    @Override
-    protected void before() throws AdapterException {
+  @Override
+  protected void before() throws AdapterException {
 
-        this.allNodeIds = new ArrayList<>();
-        try {
-            this.spOpcUaClient.connect();
-            OpcUaNodeBrowser browserClient = new OpcUaNodeBrowser(this.spOpcUaClient.getClient(), this.spOpcUaClient.getSpOpcConfig());
-            this.allNodes = browserClient.findNodes();
+    this.allNodeIds = new ArrayList<>();
+    try {
+      this.spOpcUaClient.connect();
+      OpcUaNodeBrowser browserClient = new OpcUaNodeBrowser(this.spOpcUaClient.getClient(), this.spOpcUaClient.getSpOpcConfig());
+      this.allNodes = browserClient.findNodes();
 
 
-                for (OpcNode node : this.allNodes) {
-                    this.allNodeIds.add(node.nodeId);
-                }
+      for (OpcNode node : this.allNodes) {
+        this.allNodeIds.add(node.nodeId);
+      }
 
-            if (spOpcUaClient.inPullMode()) {
-                this.pullingIntervalMilliSeconds = spOpcUaClient.getPullIntervalMilliSeconds();
-            } else {
-                this.numberProperties = this.allNodeIds.size();
-                this.spOpcUaClient.createListSubscription(this.allNodeIds, this);
-            }
+      if (spOpcUaClient.inPullMode()) {
+        this.pullingIntervalMilliSeconds = spOpcUaClient.getPullIntervalMilliSeconds();
+      } else {
+        this.numberProperties = this.allNodeIds.size();
+        this.spOpcUaClient.createListSubscription(this.allNodeIds, this);
+      }
 
 
-        } catch (Exception e) {
-            throw new AdapterException("The Connection to the OPC UA server could not be established.", e.getCause());
-        }
+    } catch (Exception e) {
+      throw new AdapterException("The Connection to the OPC UA server could not be established.", e.getCause());
     }
+  }
 
-        @Override
-    public void startAdapter() throws AdapterException {
-
-        this.spOpcUaClient = new SpOpcUaClient(SpOpcUaConfigBuilder.from(this.adapterDescription));
-
-        if (this.spOpcUaClient.inPullMode()) {
-            super.startAdapter();
-        } else {
-            this.before();
-        }
-    }
+  @Override
+  public void startAdapter() throws AdapterException {
 
-    @Override
-    public void stopAdapter() throws AdapterException {
-        // close connection
-        this.spOpcUaClient.disconnect();
+    this.spOpcUaClient = new SpOpcUaClient(SpOpcUaConfigBuilder.from(this.adapterDescription));
 
-        if (this.spOpcUaClient.inPullMode()){
-            super.stopAdapter();
-        }
+    if (this.spOpcUaClient.inPullMode()) {
+      super.startAdapter();
+    } else {
+      this.before();
     }
+  }
 
-    @Override
-    protected void pullData() {
-        CompletableFuture<List<DataValue>> response = this.spOpcUaClient.getClient().readValues(0, TimestampsToReturn.Both, this.allNodeIds);
-        try {
-        List<DataValue> returnValues = response.get();
-            for (int i = 0; i<returnValues.size(); i++) {
-
-                Object value = returnValues.get(i).getValue().getValue();
-                this.event.put(this.allNodes.get(i).getLabel(), value);
-
-            }
-         } catch (InterruptedException | ExecutionException ie) {
-            ie.printStackTrace();
-         }
-
-        adapterPipeline.process(this.event);
+  @Override
+  public void stopAdapter() throws AdapterException {
+    // close connection
+    this.spOpcUaClient.disconnect();
 
+    if (this.spOpcUaClient.inPullMode()) {
+      super.stopAdapter();
     }
-
-    public void onSubscriptionValue(UaMonitoredItem item, DataValue value) {
-
-        String key = OpcUaUtil.getRuntimeNameOfNode(item.getReadValueId().getNodeId());
-
-        OpcNode currNode = this.allNodes.stream()
-                .filter(node -> key.equals(node.getNodeId().getIdentifier().toString()))
-                .findFirst()
-                .orElse(null);
-
-        event.put(currNode.getLabel(), value.getValue().getValue());
-
-        // ensure that event is complete and all opc ua subscriptions transmitted at least one value
-        if (event.keySet().size() >= this.numberProperties) {
-            Map <String, Object> newEvent = new HashMap<>();
-            // deep copy of event to prevent preprocessor error
-            for (String k : event.keySet()) {
-                newEvent.put(k, event.get(k));
-            }
-            adapterPipeline.process(newEvent);
+  }
+
+  @Override
+  protected void pullData() {
+    CompletableFuture<List<DataValue>> response = this.spOpcUaClient.getClient().readValues(0, TimestampsToReturn.Both, this.allNodeIds);
+    boolean badStatusCodeReceived = false;
+    boolean emptyValueReceived = false;
+    try {
+      List<DataValue> returnValues = response.get();
+      if (returnValues.size() == 0) {
+        emptyValueReceived = true;
+        LOG.warn("Empty value object returned - event will not be sent");
+      } else {
+        for (int i = 0; i < returnValues.size(); i++) {
+          var status = returnValues.get(i).getStatusCode();
+          if (StatusCode.GOOD.equals(status)) {
+            Object value = returnValues.get(i).getValue().getValue();
+            this.event.put(this.allNodes.get(i).getLabel(), value);
+          } else {
+            badStatusCodeReceived = true;
+            LOG.warn("Received status code {} for node label: {} - event will not be sent",
+              status,
+              this.allNodes.get(i).getLabel());
+          }
         }
+      }
+      if (!badStatusCodeReceived && !emptyValueReceived) {
+        adapterPipeline.process(this.event);
+      }
+    } catch (InterruptedException | ExecutionException ie) {
+      LOG.error("Exception while reading data", ie);
     }
+  }
 
-    @Override
-    protected PollingSettings getPollingInterval() {
-        return PollingSettings.from(TimeUnit.MILLISECONDS, this.pullingIntervalMilliSeconds);
-    }
-
-    @Override
-    public SpecificAdapterStreamDescription declareModel() {
-
-        SpecificAdapterStreamDescription description = SpecificDataStreamAdapterBuilder
-                .create(ID)
-                .withAssets(Assets.DOCUMENTATION, Assets.ICON)
-                .withLocales(Locales.EN)
-                .category(AdapterType.Generic, AdapterType.Manufacturing)
-                .requiredAlternatives(Labels.withId(OpcUaLabels.ADAPTER_TYPE.name()),
-                        Alternatives.from(Labels.withId(OpcUaLabels.PULL_MODE.name()),
-                                StaticProperties.integerFreeTextProperty(Labels.withId(OpcUaLabels.PULLING_INTERVAL.name()))),
-                        Alternatives.from(Labels.withId(OpcUaLabels.SUBSCRIPTION_MODE.name())))
-                .requiredAlternatives(Labels.withId(OpcUaLabels.ACCESS_MODE.name()),
-                        Alternatives.from(Labels.withId(OpcUaLabels.UNAUTHENTICATED.name())),
-                        Alternatives.from(Labels.withId(OpcUaLabels.USERNAME_GROUP.name()),
-                                StaticProperties.group(
-                                        Labels.withId(OpcUaLabels.USERNAME_GROUP.name()),
-                                        StaticProperties.stringFreeTextProperty(Labels.withId(OpcUaLabels.USERNAME.name())),
-                                        StaticProperties.secretValue(Labels.withId(OpcUaLabels.PASSWORD.name()))
-                                ))
-                )
-                .requiredAlternatives(Labels.withId(OpcUaLabels.OPC_HOST_OR_URL.name()),
-                        Alternatives.from(
-                                Labels.withId(OpcUaLabels.OPC_URL.name()),
-                                StaticProperties.stringFreeTextProperty(Labels.withId(OpcUaLabels.OPC_SERVER_URL.name()), "opc.tcp://localhost:4840"))
-                        ,
-                        Alternatives.from(Labels.withId(OpcUaLabels.OPC_HOST.name()),
-                                StaticProperties.group(
-                                        Labels.withId("host-port"),
-                                        StaticProperties.stringFreeTextProperty(Labels.withId(OpcUaLabels.OPC_SERVER_HOST.name())),
-                                        StaticProperties.stringFreeTextProperty(Labels.withId(OpcUaLabels.OPC_SERVER_PORT.name()))
-                                ))
-                )
-                .requiredTextParameter(Labels.withId(OpcUaLabels.NAMESPACE_INDEX.name()))
-                .requiredTextParameter(Labels.withId(OpcUaLabels.NODE_ID.name()))
-                .requiredRuntimeResolvableTreeInput(
-                        Labels.withId(OpcUaLabels.AVAILABLE_NODES.name()),
-                        Arrays.asList(OpcUaLabels.NAMESPACE_INDEX.name(), OpcUaLabels.NODE_ID.name())
-                )
-                .build();
-
-        description.setAppId(ID);
-
-        return description;
-    }
+  public void onSubscriptionValue(UaMonitoredItem item, DataValue value) {
 
-    @Override
-    public Adapter getInstance(SpecificAdapterStreamDescription adapterDescription) {
-        return new OpcUaAdapter(adapterDescription);
-    }
+    String key = OpcUaUtil.getRuntimeNameOfNode(item.getReadValueId().getNodeId());
 
-    @Override
-    public GuessSchema getSchema(SpecificAdapterStreamDescription adapterDescription) throws AdapterException, ParseException {
-        return OpcUaUtil.getSchema(adapterDescription);
-    }
+    OpcNode currNode = this.allNodes.stream()
+      .filter(node -> key.equals(node.getNodeId().getIdentifier().toString()))
+      .findFirst()
+      .orElse(null);
 
-    @Override
-    public String getId() {
-        return ID;
-    }
+    event.put(currNode.getLabel(), value.getValue().getValue());
 
-    @Override
-    public StaticProperty resolveConfiguration(String staticPropertyInternalName, StaticPropertyExtractor extractor) {
-        return OpcUaUtil.resolveConfiguration(staticPropertyInternalName, extractor);
+    // ensure that event is complete and all opc ua subscriptions transmitted at least one value
+    if (event.keySet().size() >= this.numberProperties) {
+      Map<String, Object> newEvent = new HashMap<>();
+      // deep copy of event to prevent preprocessor error
+      for (String k : event.keySet()) {
+        newEvent.put(k, event.get(k));
+      }
+      adapterPipeline.process(newEvent);
     }
+  }
+
+  @Override
+  protected PollingSettings getPollingInterval() {
+    return PollingSettings.from(TimeUnit.MILLISECONDS, this.pullingIntervalMilliSeconds);
+  }
+
+  @Override
+  public SpecificAdapterStreamDescription declareModel() {
+
+    SpecificAdapterStreamDescription description = SpecificDataStreamAdapterBuilder
+      .create(ID)
+      .withAssets(Assets.DOCUMENTATION, Assets.ICON)
+      .withLocales(Locales.EN)
+      .category(AdapterType.Generic, AdapterType.Manufacturing)
+      .requiredAlternatives(Labels.withId(OpcUaLabels.ADAPTER_TYPE.name()),
+        Alternatives.from(Labels.withId(OpcUaLabels.PULL_MODE.name()),
+          StaticProperties.integerFreeTextProperty(Labels.withId(OpcUaLabels.PULLING_INTERVAL.name()))),
+        Alternatives.from(Labels.withId(OpcUaLabels.SUBSCRIPTION_MODE.name())))
+      .requiredAlternatives(Labels.withId(OpcUaLabels.ACCESS_MODE.name()),
+        Alternatives.from(Labels.withId(OpcUaLabels.UNAUTHENTICATED.name())),
+        Alternatives.from(Labels.withId(OpcUaLabels.USERNAME_GROUP.name()),
+          StaticProperties.group(
+            Labels.withId(OpcUaLabels.USERNAME_GROUP.name()),
+            StaticProperties.stringFreeTextProperty(Labels.withId(OpcUaLabels.USERNAME.name())),
+            StaticProperties.secretValue(Labels.withId(OpcUaLabels.PASSWORD.name()))
+          ))
+      )
+      .requiredAlternatives(Labels.withId(OpcUaLabels.OPC_HOST_OR_URL.name()),
+        Alternatives.from(
+          Labels.withId(OpcUaLabels.OPC_URL.name()),
+          StaticProperties.stringFreeTextProperty(Labels.withId(OpcUaLabels.OPC_SERVER_URL.name()), "opc.tcp://localhost:4840"))
+        ,
+        Alternatives.from(Labels.withId(OpcUaLabels.OPC_HOST.name()),
+          StaticProperties.group(
+            Labels.withId("host-port"),
+            StaticProperties.stringFreeTextProperty(Labels.withId(OpcUaLabels.OPC_SERVER_HOST.name())),
+            StaticProperties.stringFreeTextProperty(Labels.withId(OpcUaLabels.OPC_SERVER_PORT.name()))
+          ))
+      )
+      .requiredTextParameter(Labels.withId(OpcUaLabels.NAMESPACE_INDEX.name()))
+      .requiredTextParameter(Labels.withId(OpcUaLabels.NODE_ID.name()))
+      .requiredRuntimeResolvableTreeInput(
+        Labels.withId(OpcUaLabels.AVAILABLE_NODES.name()),
+        Arrays.asList(OpcUaLabels.NAMESPACE_INDEX.name(), OpcUaLabels.NODE_ID.name())
+      )
+      .build();
+
+    description.setAppId(ID);
+
+    return description;
+  }
+
+  @Override
+  public Adapter getInstance(SpecificAdapterStreamDescription adapterDescription) {
+    return new OpcUaAdapter(adapterDescription);
+  }
+
+  @Override
+  public GuessSchema getSchema(SpecificAdapterStreamDescription adapterDescription) throws AdapterException, ParseException {
+    return OpcUaUtil.getSchema(adapterDescription);
+  }
+
+  @Override
+  public String getId() {
+    return ID;
+  }
+
+  @Override
+  public StaticProperty resolveConfiguration(String staticPropertyInternalName, StaticPropertyExtractor extractor) {
+    return OpcUaUtil.resolveConfiguration(staticPropertyInternalName, extractor);
+  }
 }


[incubator-streampipes] 04/04: Merge branch 'dev' of github.com:apache/incubator-streampipes into dev

Posted by ri...@apache.org.
This is an automated email from the ASF dual-hosted git repository.

riemer pushed a commit to branch dev
in repository https://gitbox.apache.org/repos/asf/incubator-streampipes.git

commit d3226258385febb3def4fe68dfdbbfe9f30b0e9e
Merge: fbf11d498 eca719202
Author: Dominik Riemer <do...@gmail.com>
AuthorDate: Mon Aug 8 10:42:13 2022 +0200

    Merge branch 'dev' of github.com:apache/incubator-streampipes into dev

 pom.xml                                                   |  4 ++--
 streampipes-extensions/pom.xml                            |  4 ++--
 .../processors/siddhi/count/CountAggregation.java         | 15 ++++++++++++---
 .../strings.en                                            |  3 +++
 .../sinks/internal/jvm/datalake/DataLakeSink.java         | 10 ++++++----
 streampipes-wrapper-python/requirements.txt               |  2 +-
 streampipes-wrapper-python/setup.py                       |  2 +-
 .../filters-siddhi/count1/description.json                |  5 +++++
 .../pipelineElement/filters-siddhi/count1/input.csv       |  2 +-
 ui/cypress/support/utils/DataLakeUtils.ts                 |  2 +-
 ui/cypress/support/utils/PipelineUtils.ts                 |  4 ++--
 .../data-explorer-widget-data-settings.component.html     |  6 ++++--
 .../data-explorer-widget-data-settings.component.ts       | 10 ++++++++++
 13 files changed, 50 insertions(+), 19 deletions(-)


[incubator-streampipes] 03/04: [hotfix] Improve resizing of echarts widgets

Posted by ri...@apache.org.
This is an automated email from the ASF dual-hosted git repository.

riemer pushed a commit to branch dev
in repository https://gitbox.apache.org/repos/asf/incubator-streampipes.git

commit fbf11d498a9466e4e63e77048b5a46f8d2e25303
Author: Dominik Riemer <do...@gmail.com>
AuthorDate: Mon Aug 8 10:41:31 2022 +0200

    [hotfix] Improve resizing of echarts widgets
---
 .../components/grid/dashboard-grid.component.html  |  1 +
 .../components/grid/dashboard-grid.component.ts    | 22 +++++++----
 .../standalone/standalone-dashboard.component.ts   |  1 -
 .../widget/dashboard-widget.component.html         | 14 +++++++
 .../widget/dashboard-widget.component.ts           | 44 ++++++++++++++--------
 .../bar-race/bar-race-widget.component.html        |  6 +--
 .../bar-race/bar-race-widget.component.scss        |  9 -----
 .../widgets/bar-race/bar-race-widget.component.ts  |  6 +--
 .../components/widgets/base/base-echarts-widget.ts | 13 ++-----
 .../components/widgets/base/base-widget.ts         | 31 +++++++--------
 .../stacked-line-chart-widget.component.html       |  6 +--
 .../stacked-line-chart-widget.component.scss       |  9 -----
 ui/src/app/dashboard/services/resize.service.ts    |  6 +--
 13 files changed, 89 insertions(+), 79 deletions(-)

diff --git a/ui/src/app/dashboard/components/grid/dashboard-grid.component.html b/ui/src/app/dashboard/components/grid/dashboard-grid.component.html
index 1e9a69f15..94baf0cbc 100644
--- a/ui/src/app/dashboard/components/grid/dashboard-grid.component.html
+++ b/ui/src/app/dashboard/components/grid/dashboard-grid.component.html
@@ -28,6 +28,7 @@
                               [widget]="item"
                               [editMode]="editMode"
                               [headerVisible]="headerVisible"
+                              [gridsterItemComponent]="gridsterItemComponent"
                               [itemWidth]="gridsterItemComponent.width"
                               [itemHeight]="gridsterItemComponent.height"
             ></dashboard-widget>
diff --git a/ui/src/app/dashboard/components/grid/dashboard-grid.component.ts b/ui/src/app/dashboard/components/grid/dashboard-grid.component.ts
index c31211daf..942e80157 100644
--- a/ui/src/app/dashboard/components/grid/dashboard-grid.component.ts
+++ b/ui/src/app/dashboard/components/grid/dashboard-grid.component.ts
@@ -27,9 +27,10 @@ import {
     SimpleChanges,
     ViewChildren
 } from '@angular/core';
-import { Dashboard, DashboardConfig, DashboardItem, DashboardWidgetModel } from '@streampipes/platform-services';
-import { ResizeService } from '../../services/resize.service';
-import { GridsterItemComponent, GridType } from 'angular-gridster2';
+import {Dashboard, DashboardConfig, DashboardItem, DashboardWidgetModel} from '@streampipes/platform-services';
+import {ResizeService} from '../../services/resize.service';
+import {GridsterItemComponent, GridType} from 'angular-gridster2';
+import {GridsterInfo} from "../../models/gridster-info.model";
 
 @Component({
     selector: 'dashboard-grid',
@@ -57,7 +58,7 @@ export class DashboardGridComponent implements OnInit, OnChanges {
     ngOnInit(): void {
         this.options = {
             disablePushOnDrag: true,
-            draggable: { enabled: this.editMode },
+            draggable: {enabled: this.editMode},
             gridType: GridType.VerticalFixed,
             minCols: 12,
             maxCols: 12,
@@ -65,13 +66,20 @@ export class DashboardGridComponent implements OnInit, OnChanges {
             fixedRowHeight: 50,
             fixedColWidth: 50,
             margin: 5,
-            resizable: { enabled: this.editMode },
+            resizable: {enabled: this.editMode},
             displayGrid: this.editMode ? 'always' : 'none',
             itemResizeCallback: ((item, itemComponent) => {
-                this.resizeService.notify({id: item.id, width: itemComponent.width, height: itemComponent.height});
+                this.resizeService.notify({
+                    gridsterItem: item,
+                    gridsterItemComponent: itemComponent
+                } as GridsterInfo);
             }),
             itemInitCallback: ((item, itemComponent) => {
-                this.resizeService.notify({id: item.id, width: itemComponent.width, height: itemComponent.height});
+                this.resizeService.notify({
+                    gridsterItem: item,
+                    gridsterItemComponent: itemComponent
+                } as GridsterInfo);
+                //window.dispatchEvent(new Event('resize'));
             })
         };
     }
diff --git a/ui/src/app/dashboard/components/standalone/standalone-dashboard.component.ts b/ui/src/app/dashboard/components/standalone/standalone-dashboard.component.ts
index 7d51e881f..03b3d1f2a 100644
--- a/ui/src/app/dashboard/components/standalone/standalone-dashboard.component.ts
+++ b/ui/src/app/dashboard/components/standalone/standalone-dashboard.component.ts
@@ -36,7 +36,6 @@ export class StandaloneDashboardComponent implements OnInit {
         this.activatedRoute.params.subscribe(params => {
             if (params['dashboardId']) {
                 const dashboardId = params['dashboardId'];
-                console.log(dashboardId);
                 this.dashboardService.getDashboard(dashboardId).subscribe(dashboard => {
                     this.dashboard = dashboard;
                     this.dashboardReady = true;
diff --git a/ui/src/app/dashboard/components/widget/dashboard-widget.component.html b/ui/src/app/dashboard/components/widget/dashboard-widget.component.html
index 1c4e872c2..282e5df45 100644
--- a/ui/src/app/dashboard/components/widget/dashboard-widget.component.html
+++ b/ui/src/app/dashboard/components/widget/dashboard-widget.component.html
@@ -54,6 +54,7 @@
                     <number-widget [itemWidth]="itemWidth"
                                    [itemHeight]="itemHeight"
                                    [editMode]="editMode"
+                                   [gridsterItemComponent]="gridsterItemComponent"
                                    [widgetConfig]="configuredWidget" [widgetDataConfig]="widgetDataConfig"
                                    class="h-100"></number-widget>
                 </div>
@@ -61,6 +62,7 @@
                     <line-widget [itemWidth]="itemWidth"
                                  [itemHeight]="itemHeight"
                                  [editMode]="editMode"
+                                 [gridsterItemComponent]="gridsterItemComponent"
                                  [widgetConfig]="configuredWidget"
                                  [widgetDataConfig]="widgetDataConfig" class="h-100"></line-widget>
                 </div>
@@ -68,6 +70,7 @@
                     <area-widget [itemWidth]="itemWidth"
                                  [itemHeight]="itemHeight"
                                  [editMode]="editMode"
+                                 [gridsterItemComponent]="gridsterItemComponent"
                                  [widgetConfig]="configuredWidget"
                                  [widgetDataConfig]="widgetDataConfig" class="h-100"></area-widget>
                 </div>
@@ -75,6 +78,7 @@
                     <table-widget [itemWidth]="itemWidth"
                                   [itemHeight]="itemHeight"
                                   [editMode]="editMode"
+                                  [gridsterItemComponent]="gridsterItemComponent"
                                   [widgetConfig]="configuredWidget"
                                   [widgetDataConfig]="widgetDataConfig" class="h-100"></table-widget>
                 </div>
@@ -82,6 +86,7 @@
                     <gauge-widget [itemWidth]="itemWidth"
                                   [itemHeight]="itemHeight"
                                   [editMode]="editMode"
+                                  [gridsterItemComponent]="gridsterItemComponent"
                                   [widgetConfig]="configuredWidget"
                                   [widgetDataConfig]="widgetDataConfig" class="h-100"></gauge-widget>
                 </div>
@@ -89,6 +94,7 @@
                     <image-widget [itemWidth]="itemWidth"
                                   [itemHeight]="itemHeight"
                                   [editMode]="editMode"
+                                  [gridsterItemComponent]="gridsterItemComponent"
                                   [widgetConfig]="configuredWidget"
                                   [widgetDataConfig]="widgetDataConfig" class="h-100"></image-widget>
                 </div>
@@ -96,6 +102,7 @@
                     <map-widget [itemWidth]="itemWidth"
                                 [itemHeight]="itemHeight"
                                 [editMode]="editMode"
+                                [gridsterItemComponent]="gridsterItemComponent"
                                 [widgetConfig]="configuredWidget"
                                 [widgetDataConfig]="widgetDataConfig" class="h-100"></map-widget>
                 </div>
@@ -103,6 +110,7 @@
                     <raw-widget [itemWidth]="itemWidth"
                                 [itemHeight]="itemHeight"
                                 [editMode]="editMode"
+                                [gridsterItemComponent]="gridsterItemComponent"
                                 [widgetConfig]="configuredWidget"
                                 [widgetDataConfig]="widgetDataConfig" class="h-100"></raw-widget>
                 </div>
@@ -110,6 +118,7 @@
                     <html-widget [itemWidth]="itemWidth"
                                  [itemHeight]="itemHeight"
                                  [editMode]="editMode"
+                                 [gridsterItemComponent]="gridsterItemComponent"
                                  [widgetConfig]="configuredWidget"
                                  [widgetDataConfig]="widgetDataConfig" class="h-100"></html-widget>
                 </div>
@@ -117,6 +126,7 @@
                     <traffic-light-widget [itemWidth]="itemWidth"
                                           [itemHeight]="itemHeight"
                                           [editMode]="editMode"
+                                          [gridsterItemComponent]="gridsterItemComponent"
                                           [widgetConfig]="configuredWidget"
                                           [widgetDataConfig]="widgetDataConfig" class="h-100"></traffic-light-widget>
                 </div>
@@ -124,6 +134,7 @@
                     <wordcloud-widget [itemWidth]="itemWidth"
                                       [itemHeight]="itemHeight"
                                       [editMode]="editMode"
+                                      [gridsterItemComponent]="gridsterItemComponent"
                                       [widgetConfig]="configuredWidget"
                                       [widgetDataConfig]="widgetDataConfig" class="h-100"></wordcloud-widget>
                 </div>
@@ -131,6 +142,7 @@
                     <status-widget [itemWidth]="itemWidth"
                                    [itemHeight]="itemHeight"
                                    [editMode]="editMode"
+                                   [gridsterItemComponent]="gridsterItemComponent"
                                    [widgetConfig]="configuredWidget"
                                    [widgetDataConfig]="widgetDataConfig" class="h-100"></status-widget>
                 </div>
@@ -138,6 +150,7 @@
                     <bar-race-widget [itemWidth]="itemWidth"
                                      [itemHeight]="itemHeight"
                                      [editMode]="editMode"
+                                     [gridsterItemComponent]="gridsterItemComponent"
                                      [widgetConfig]="configuredWidget"
                                      [widgetDataConfig]="widgetDataConfig" class="h-100"></bar-race-widget>
                 </div>
@@ -145,6 +158,7 @@
                     <stacked-line-chart-widget [itemWidth]="itemWidth"
                                                [itemHeight]="itemHeight"
                                                [editMode]="editMode"
+                                               [gridsterItemComponent]="gridsterItemComponent"
                                                [widgetConfig]="configuredWidget"
                                                [widgetDataConfig]="widgetDataConfig"
                                                class="h-100"></stacked-line-chart-widget>
diff --git a/ui/src/app/dashboard/components/widget/dashboard-widget.component.ts b/ui/src/app/dashboard/components/widget/dashboard-widget.component.ts
index a202201b3..b35f46003 100644
--- a/ui/src/app/dashboard/components/widget/dashboard-widget.component.ts
+++ b/ui/src/app/dashboard/components/widget/dashboard-widget.component.ts
@@ -22,7 +22,8 @@ import {
   DashboardItem,
   DashboardService,
   DashboardWidgetModel,
-  DataLakeMeasure, DatalakeRestService,
+  DataLakeMeasure,
+  DatalakeRestService,
   DataViewDataExplorerService,
   Pipeline,
   PipelineService
@@ -31,6 +32,9 @@ import { DialogService, PanelType } from '@streampipes/shared-ui';
 import { EditModeService } from '../../services/edit-mode.service';
 import { ReloadPipelineService } from '../../services/reload-pipeline.service';
 import { zip } from 'rxjs';
+import { GridsterItemComponent } from 'angular-gridster2';
+import { ResizeService } from '../../services/resize.service';
+import { GridsterInfo } from '../../models/gridster-info.model';
 
 @Component({
   selector: 'dashboard-widget',
@@ -44,6 +48,7 @@ export class DashboardWidgetComponent implements OnInit {
   @Input() headerVisible = false;
   @Input() itemWidth: number;
   @Input() itemHeight: number;
+  @Input() gridsterItemComponent: GridsterItemComponent;
 
   @Output() deleteCallback: EventEmitter<DashboardItem> = new EventEmitter<DashboardItem>();
   @Output() updateCallback: EventEmitter<DashboardWidgetModel> = new EventEmitter<DashboardWidgetModel>();
@@ -62,7 +67,8 @@ export class DashboardWidgetComponent implements OnInit {
               private editModeService: EditModeService,
               private reloadPipelineService: ReloadPipelineService,
               private dataExplorerService: DataViewDataExplorerService,
-              private dataLakeRestService: DatalakeRestService) {
+              private dataLakeRestService: DatalakeRestService,
+              private resizeService: ResizeService) {
   }
 
   ngOnInit(): void {
@@ -85,17 +91,23 @@ export class DashboardWidgetComponent implements OnInit {
         const vizPipeline = res[0];
         const measurement = res[1].find(m => m.measureName === vizPipeline.measureName);
         vizPipeline.eventSchema = measurement.eventSchema;
-      this.widgetDataConfig = vizPipeline;
-      this.dashboardService.getPipelineById(vizPipeline.pipelineId).subscribe(pipeline => {
-        this.pipeline = pipeline;
-        this.pipelineRunning = pipeline.running;
-        this.widgetNotAvailable = false;
+        this.widgetDataConfig = vizPipeline;
+        this.dashboardService.getPipelineById(vizPipeline.pipelineId).subscribe(pipeline => {
+          this.pipeline = pipeline;
+          this.pipelineRunning = pipeline.running;
+          this.widgetNotAvailable = false;
+          this.widgetLoaded = true;
+          setTimeout(() => {
+            this.resizeService.notify({
+              gridsterItem: this.widget,
+              gridsterItemComponent: this.gridsterItemComponent
+            } as GridsterInfo);
+          }, 20);
+        });
+      }, err => {
         this.widgetLoaded = true;
+        this.widgetNotAvailable = true;
       });
-    }, err => {
-      this.widgetLoaded = true;
-      this.widgetNotAvailable = true;
-    });
   }
 
   removeWidget() {
@@ -105,11 +117,11 @@ export class DashboardWidgetComponent implements OnInit {
   startPipeline() {
     if (!this.pipelineRunning) {
       this.pipelineService
-          .startPipeline(this.pipeline._id)
-          .subscribe(status => {
-            // this.loadWidget();
-            this.reloadPipelineService.reloadPipelineSubject.next();
-          });
+        .startPipeline(this.pipeline._id)
+        .subscribe(status => {
+          // this.loadWidget();
+          this.reloadPipelineService.reloadPipelineSubject.next();
+        });
     }
   }
 
diff --git a/ui/src/app/dashboard/components/widgets/bar-race/bar-race-widget.component.html b/ui/src/app/dashboard/components/widgets/bar-race/bar-race-widget.component.html
index d4cf25599..59b7f59a6 100644
--- a/ui/src/app/dashboard/components/widgets/bar-race/bar-race-widget.component.html
+++ b/ui/src/app/dashboard/components/widgets/bar-race/bar-race-widget.component.html
@@ -20,9 +20,9 @@
     <div class="title-panel mt-20" *ngIf="hasTitlePanelSettings">
         {{selectedTitle}}
     </div>
-    <div class="value-panel">
-        <div echarts [options]="chartOption" [ngStyle]="{'width': '100%', 'height': currentHeight}"
-             (chartInit)="onChartInit($event)" [merge]= "dynamicData" *ngIf="configReady">
+    <div fxFlex [ngStyle]="{height: currentHeight + 'px'}" *ngIf="configReady">
+        <div echarts [options]="chartOption" [ngStyle]="{'width': '100%', 'height': '100%'}"
+             (chartInit)="onChartInit($event)" [merge]= "dynamicData">
         </div>
     </div>
 </div>
diff --git a/ui/src/app/dashboard/components/widgets/bar-race/bar-race-widget.component.scss b/ui/src/app/dashboard/components/widgets/bar-race/bar-race-widget.component.scss
index 76e1caf81..e374f5dd4 100644
--- a/ui/src/app/dashboard/components/widgets/bar-race/bar-race-widget.component.scss
+++ b/ui/src/app/dashboard/components/widgets/bar-race/bar-race-widget.component.scss
@@ -30,15 +30,6 @@
   font-size: 20px;
 }
 
-.value-panel {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  align-content: center;
-  flex: 1;
-}
-
 .status-light {
   border-radius: 50%;
   float: left;
diff --git a/ui/src/app/dashboard/components/widgets/bar-race/bar-race-widget.component.ts b/ui/src/app/dashboard/components/widgets/bar-race/bar-race-widget.component.ts
index 5bbcf60c4..5f034f5ad 100644
--- a/ui/src/app/dashboard/components/widgets/bar-race/bar-race-widget.component.ts
+++ b/ui/src/app/dashboard/components/widgets/bar-race/bar-race-widget.component.ts
@@ -46,10 +46,10 @@ export class BarRaceWidgetComponent extends BaseStreamPipesWidget implements OnI
 
   chartOption = {
     grid: {
+      left: 100,
       top: 10,
-      bottom: 30,
-      left: 150,
-      right: 80
+      right: 120,
+      bottom: 100
     },
     xAxis: {
       max: 'dataMax',
diff --git a/ui/src/app/dashboard/components/widgets/base/base-echarts-widget.ts b/ui/src/app/dashboard/components/widgets/base/base-echarts-widget.ts
index ebfcf10b9..2d4e60269 100644
--- a/ui/src/app/dashboard/components/widgets/base/base-echarts-widget.ts
+++ b/ui/src/app/dashboard/components/widgets/base/base-echarts-widget.ts
@@ -41,19 +41,12 @@ export abstract class BaseEchartsWidget extends BaseStreamPipesWidget {
     this.currentWidth = width;
     this.currentHeight = height;
     this.configReady = true;
-    this.applySize(width, height);
+    if (this.eChartsInstance) {
+      this.eChartsInstance.resize({width, height});
+    }
   }
 
   onChartInit(ec) {
     this.eChartsInstance = ec;
-    this.applySize(this.currentWidth, this.currentHeight);
   }
-
-  applySize(width: number, height: number) {
-    console.log(height);
-    if (this.eChartsInstance) {
-      this.eChartsInstance.resize({width, height: height});
-    }
-  }
-
 }
diff --git a/ui/src/app/dashboard/components/widgets/base/base-widget.ts b/ui/src/app/dashboard/components/widgets/base/base-widget.ts
index 33ee18a37..71f418673 100644
--- a/ui/src/app/dashboard/components/widgets/base/base-widget.ts
+++ b/ui/src/app/dashboard/components/widgets/base/base-widget.ts
@@ -16,12 +16,11 @@
  *
  */
 
-import { Directive, Input, OnChanges, SimpleChanges } from '@angular/core';
+import { Directive, Input, OnChanges, OnDestroy, OnInit, SimpleChanges } from '@angular/core';
 import { StaticPropertyExtractor } from '../../../sdk/extractor/static-property-extractor';
 import { BehaviorSubject, interval, Observable, Subscription } from 'rxjs';
 import { WidgetConfigBuilder } from '../../../registry/widget-config-builder';
 import { ResizeService } from '../../../services/resize.service';
-import { WidgetInfo } from '../../../models/gridster-info.model';
 import {
   DashboardWidgetModel,
   DataLakeMeasure,
@@ -30,9 +29,10 @@ import {
   SpQueryResult
 } from '@streampipes/platform-services';
 import { map, switchMap } from 'rxjs/operators';
+import { GridsterItemComponent } from 'angular-gridster2';
 
 @Directive()
-export abstract class BaseStreamPipesWidget implements OnChanges {
+export abstract class BaseStreamPipesWidget implements OnInit, OnChanges, OnDestroy {
 
   protected constructor(protected dataLakeService: DatalakeRestService,
                         protected resizeService: ResizeService,
@@ -45,6 +45,7 @@ export abstract class BaseStreamPipesWidget implements OnChanges {
 
   @Input() widgetConfig: DashboardWidgetModel;
   @Input() widgetDataConfig: DataLakeMeasure;
+  @Input() gridsterItemComponent: GridsterItemComponent;
   @Input() itemWidth: number;
   @Input() itemHeight: number;
   @Input() editMode: boolean;
@@ -67,12 +68,20 @@ export abstract class BaseStreamPipesWidget implements OnChanges {
   refreshIntervalInSeconds = 5;
   queryLimit = 1;
 
+  resizeSub: Subscription;
+
   ngOnInit(): void {
-    this.prepareConfigExtraction();
-    this.resizeService.resizeSubject.subscribe(info => {
-      this.onResize(info);
+    const widthOffset = 0;
+    const heightOffset = 0;
+    this.resizeSub = this.resizeService.resizeSubject.subscribe(info => {
+      if (info.gridsterItem.id === this.widgetConfig._id) {
+        this.onSizeChanged(this.computeCurrentWidth(this.gridsterItemComponent.width - widthOffset),
+          this.computeCurrentHeight(this.gridsterItemComponent.height - heightOffset));
+      }
     });
 
+    this.prepareConfigExtraction();
+
     this.fireQuery().subscribe(result => this.processQueryResult(result));
 
     this.intervalSubject = new BehaviorSubject<number>(this.refreshIntervalInSeconds);
@@ -113,6 +122,7 @@ export abstract class BaseStreamPipesWidget implements OnChanges {
 
   ngOnDestroy(): void {
     this.subscription.unsubscribe();
+    this.resizeSub.unsubscribe();
   }
 
   computeCurrentWidth(width: number): number {
@@ -149,15 +159,6 @@ export abstract class BaseStreamPipesWidget implements OnChanges {
     }
   }
 
-  onResize(info: WidgetInfo) {
-    if (info.id === this.widgetConfig._id) {
-      setTimeout(() => {
-        this.onSizeChanged(this.computeCurrentWidth(info.width),
-          this.computeCurrentHeight(info.height));
-      }, 100);
-    }
-  }
-
   fireQuery(): Observable<SpQueryResult> {
     return this.dataLakeService
       .getData(this.widgetDataConfig.measureName, this.buildQuery(), true)
diff --git a/ui/src/app/dashboard/components/widgets/stacked-line-chart/stacked-line-chart-widget.component.html b/ui/src/app/dashboard/components/widgets/stacked-line-chart/stacked-line-chart-widget.component.html
index d4cf25599..59b7f59a6 100644
--- a/ui/src/app/dashboard/components/widgets/stacked-line-chart/stacked-line-chart-widget.component.html
+++ b/ui/src/app/dashboard/components/widgets/stacked-line-chart/stacked-line-chart-widget.component.html
@@ -20,9 +20,9 @@
     <div class="title-panel mt-20" *ngIf="hasTitlePanelSettings">
         {{selectedTitle}}
     </div>
-    <div class="value-panel">
-        <div echarts [options]="chartOption" [ngStyle]="{'width': '100%', 'height': currentHeight}"
-             (chartInit)="onChartInit($event)" [merge]= "dynamicData" *ngIf="configReady">
+    <div fxFlex [ngStyle]="{height: currentHeight + 'px'}" *ngIf="configReady">
+        <div echarts [options]="chartOption" [ngStyle]="{'width': '100%', 'height': '100%'}"
+             (chartInit)="onChartInit($event)" [merge]= "dynamicData">
         </div>
     </div>
 </div>
diff --git a/ui/src/app/dashboard/components/widgets/stacked-line-chart/stacked-line-chart-widget.component.scss b/ui/src/app/dashboard/components/widgets/stacked-line-chart/stacked-line-chart-widget.component.scss
index 76e1caf81..e374f5dd4 100644
--- a/ui/src/app/dashboard/components/widgets/stacked-line-chart/stacked-line-chart-widget.component.scss
+++ b/ui/src/app/dashboard/components/widgets/stacked-line-chart/stacked-line-chart-widget.component.scss
@@ -30,15 +30,6 @@
   font-size: 20px;
 }
 
-.value-panel {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  align-content: center;
-  flex: 1;
-}
-
 .status-light {
   border-radius: 50%;
   float: left;
diff --git a/ui/src/app/dashboard/services/resize.service.ts b/ui/src/app/dashboard/services/resize.service.ts
index 129f7c29f..32101c3fc 100644
--- a/ui/src/app/dashboard/services/resize.service.ts
+++ b/ui/src/app/dashboard/services/resize.service.ts
@@ -18,14 +18,14 @@
 
 import { Subject } from 'rxjs';
 import { Injectable } from '@angular/core';
-import { WidgetInfo } from '../models/gridster-info.model';
+import { GridsterInfo } from '../models/gridster-info.model';
 
 @Injectable()
 export class ResizeService {
 
-    public resizeSubject: Subject<WidgetInfo> = new Subject<WidgetInfo>();
+    public resizeSubject: Subject<GridsterInfo> = new Subject<GridsterInfo>();
 
-    public notify(info: WidgetInfo): void {
+    public notify(info: GridsterInfo): void {
         this.resizeSubject.next(info);
     }
 }