Follow

Charts - Web Page

This article will be updated in the near future! In the meanwhile, if the following information is insufficient, contact support@flow-software.com.

Charts-WebPage.png

Being true to the fact that Flow is a consolidated information platform, it allows one to embed an external webpage on a dashboard pane, to create a web portal of mixed content types hosted in one central place.

The web page chart can link to any URL and has the capability to include headers and parameters as part of the request.

Typical uses include to render real time SCADA graphics (most modern SCADA/HMI packages have the capability to render their displays as an HTML5 compatible web page) in conjunction with Historical KPI information on one single dashboard to create a realty powerfully decision support solution.

A Web Page chart consists of the following groups:

General

The General tab is used to define the general layout of a table as well as the default period displayed and which indicators to display by default. The General tab consists of Page, Title and Period.

Page

Charts-WebPageGeneralTab.png

 

Under the Table section we have the following properties:

  • Back Color
This sets the color of the background area that surrounds the table. The default is the “Windows” theme color.
  • Left
This sets the padding to the left of the table. The default is 0.
  • Right
This sets the padding to the right of the table. The default is 0.
  • Top
This sets the padding to the top of the table. The default is 0.
  • Bottom
This sets the padding to the top of the table, the default is 0.
   

Title

Refer to the general “Title” chart properties section for more information.

Period

Refer to the general “Period” chart properties section for more information.

Link

The Headers tab define the URL, Headers and Parameters that can be added to your web page request

Charts-WebPageLink.png

Resource (Base URL)

A Uniform Resource Locator(URL), colloquially termed a web address, is a reference to a web resource that specifies its location on a computer network and a mechanism for retrieving it. A URL is a specific type of Uniform Resource Identifier(URI),although many people use the two terms interchangeably. URLs occur most commonly to reference web pages (http).

Selecting the resource item under the link tab will allow you to add the specific URL to browse to:

Charts-WebPageBaseURL.png

  • URL
This is used to display the address to navigate to.
   

HTTP Headers

HTTP headers allow the client and the server to pass additional information with the request or the response. An HTTP header consists of its case-insensitive name followed by a colon ':', then by its value (without line breaks).

Charts-WebPageHTTPHeaders.png

Headers can be added by selecting the Add/Header option by right clicking on the “Headers” section under resources. Each header has the following options:

Charts-WebPageAddHeaders.png

  • Name–Name of the header to be passed
  • Value –Value of the corresponding header to be passed

HTTP Parameters

URL Parameters are those whose values are set dynamically in a page's URL. These can be accessed by its template and its data sources. This makes pages incredibly dynamic, enabling a single page to power an endless number of views.

Charts-WebPageHTTPParameters.png

Parameters can be added by selecting the Add/Parameter option by right clicking on the “Parameters” section under resources. Each header has the following options:

Charts-WebPageAddParameters.png

  • Name
Name of the header to be passed.
  • Value
Value of the corresponding header to be passed.
   

Additional parameters

To allow for dynamic parameters, one can use the period start and period end placeholders in the Parameter value section. These will be replaced by the start and end time as configured in the period section on the chart.

This will allow to load dynamic URL’s based on a dynamic time range.

  • [PeriodEnd("HH:mm")]
Will be replaced by the end time of the period with the specified Date/Time Formatting applied.
  • [PeriodStart("HH:mm")]
Will be replaced by the start time of the period with the specified Date/Time Formatting applied.
   
Was this article helpful?
0 out of 0 found this helpful
Have more questions? Submit a request

Comments