Data Points
Table of Contents
- Overview
- Common Left Area — Tag Tree Panel
- Stream Screen (
/stream/index) - Trend Screen (
/storage/index) - Snapshot Screen (
/snapshot/index) - Data Export Screen (
/data/index) - Use Case Scenarios
- Frequently Asked Questions
- Related Screens
Overview
The Data group is a collection of screens for viewing and analyzing collected time series data from four perspectives.
| Submenu | Internal URL | Purpose |
|---|---|---|
| Stream | /stream/index | Display real-time incoming data for selected tags as a line chart |
| Trend | /storage/index | Analyze tag data for a selected period with charts and tables |
| Snapshot | /snapshot/index | View representative values sampled at regular intervals in a table format |
| Data Export | /data/index | Batch export data in CSV/Excel format |
All four screens share the same Tag Tree Panel on the left, while only the right area changes according to each screen's function.
Common Left Area — Tag Tree Panel
Stream, Trend, and Snapshot all use the same tag tree panel that is col-lg-3 wide on the left.
┌─────────────────────────────┐
│ 🗂 모델 [💬] [🔍] [📋] │ ← 헤더 + 도구 3개
│ ─────────────────────────── │
│ 🏭 [ 사이트 ▼ ] │ ← 사이트 셀렉터
│ ─────────────────────────── │
│ [에셋] [연결] │ ← 탭 (ADMIN만 연결 탭 표시)
│ ─────────────────────────── │
│ 🔍 검색... │ ← 토글 시 노출
│ ─────────────────────────── │
│ ▶ 자산 트리 │ ← 자산/태그 계층 트리
│ ▶ MOTOR-001 │
│ ▼ MOTOR-001.SPEED │
│ ▼ MOTOR-001.TEMP │
│ ... │
│ ─────────────────────────── │
│ 오브젝트 ID : (hover 시 표시) │ ← 푸터
└─────────────────────────────┘
Three Header Tools
| Button | Icon | Action |
|---|---|---|
| Show Tag Description | 💬 | Toggle whether to display the description next to each tag in the tree |
| Tag Search | 🔍 | Toggle the search input field above the tree |
| Copy Selected Tag Names | 📋 | Copy checked tag names to the clipboard |
Site Selector
| Item | Form | Action |
|---|---|---|
| Left of the input group | 🏭 (Industrial icon) | — |
| Selector | 사이트명 [설명] options | On change (changeSite()), reload the tree with that site's assets/connections |
Tabs (Asset / Connection)
| Tab | Visible To | Tree Contents |
|---|---|---|
| Asset (default) | Everyone | Site → Area → Line → Equipment → Tag asset tree |
| Connection | ADMIN | OPC Server → Channel → Tag (communication unit tree) |
Each tab has its own toggleable search input (assetSearchInput / opcSearchInput).
Footer — Object ID Preview
Hovering over a tag or asset displays its identifier in the Object ID field in the footer, allowing operators to quickly verify the ID while looking at the asset name.
Stream Screen (/stream/index)
Check tags in the left tree and click Start Streaming to see real-time data arriving in the right chart.
Top Tools
🔀 스트림 [▶ 스트리밍 시작] [■] [↻]
| Button | Action |
|---|---|
| Start Streaming (▶, Red) | stream() — Begin real-time push subscription for the checked tags |
| Stop (■) | stop() — Stop streaming (only enabled after startup) |
| Refresh (↻) | refresh() — Reset the screen |
Chart Display Options
Tools on the right of the chart panel header.
| Item | ID | Default | Description |
|---|---|---|---|
| Display (Min) | display_minutes | 5 | Time span to display on the chart (in minutes) |
| Add Virtual Point | (Button) | — | addVPoint() — Add a user-defined virtual point (script/calculation-based) to the chart |
| Settings | (Button) | — | setDisplayCount() — Dialog for display count and other options |
Real-Time Chart Area
The following spaces exist in the chart panel body.
| Item | Display |
|---|---|
result_txt | Small text in the header right — summary of the current streaming state |
stream-content (List) | One line per checked tag — line chart + current value |
Before streaming starts, the following notice is displayed.
🖼 [Stream icon]
Tag Data Stream You can view real-time tag data. Please select tag names from the left tag tree and click the [▶ Start Streaming] button.
Procedure
- Check the tags you want to view in the left tree (multiple allowed)
- Click Start Streaming
- The chart automatically updates with real-time incoming data
- If you need a different time span (minutes), adjust the Display (Min) value at the top right
- When done, click ■ Stop
Trend Screen (/storage/index)
A screen for analyzing tag data for a selected period using a time series chart and aggregation table.
| Number | Location | Function |
|---|---|---|
| ① | Top left | Total Data — total number of points accumulated so far and update time |
| ② | Left | Site Select + Asset / Connection tabs — view the tree by which axis |
| ③ | Left body | Tag Tree — check boxes to add multiple tags to one chart |
| ④ | Top right | Period and Query |
| ⑤ | Chart header | Chart display options — line type · legend · TRIP display · display point count · settings · Excel Download |
| ⑥ | Below that | Zoom Presets — 5M · 10M · 30M · 1H · 3H · 6H · 12H · 1D · 7D · 15D · 30D · All |
| ⑦ | Body | Time Series Chart |
| ⑧ | Below | Tag Aggregation Statistics — count within period · first/last · min/max · avg/sum |
The image above shows that state — "No data to display". Check tags in the left tree and click Query.
Top Search Area
📈 트렌드 [기간 ▭ ▭▭▭▭▭▭▭▭] [샘플링 ▼] [조회] [🎚️] [정지] [전체화면]
| Control | Width | Description |
|---|---|---|
Period Input (search_time) | 280px | Start-end date/time (center-aligned, bold). Click to open a date range picker. Hidden search_date_from / search_date_to passed |
Sampling Selector (term) | Auto | Disabled by default. Activate with the 🎚️ button (see Sampling Options below) |
Query (submit_button) | Red + 🔍 | search() — Update chart + table with the conditions |
Sampling Options Toggle (sampling_button) | Red + 🎚️ | samplingOption() — Show/hide the sampling selector |
Stop Query (cancel_button) | Red + ⏹ | cancel() — Cancel the ongoing query (only enabled during a query) |
| Fullscreen | Red + 🔗 | fullscreen() — Open the Trend screen fullscreen in a new window |
Sampling Options
The sampling selector (term) is hidden by default and enabled with the 🎚️ button. It is used to fetch lightweight representative values via sampling when there is too much data and the chart becomes slow.
| Option | Meaning | Recommended Use |
|---|---|---|
(빈 값) — 원본(RAW) | All data | Default. For short periods (hours/days) |
LTTB [0.1%] | Extract only 0.1% with the LTTB algorithm | Long-term (monthly) trend overview |
LTTB [0.5%] | Extract only 0.5% | Long-term (monthly) analysis |
LTTB [1%] | Extract only 1% | Mid-term (weekly) analysis |
LTTB [5%] | Extract only 5% | Short-term (daily) analysis |
LTTB [10%] | Extract only 10% | Detailed precision analysis |
1분 주기 | Simple sampling at 1-minute intervals | Short-term (daily) sampling |
5분 주기 | At 5-minute intervals | Mid-term (weekly) sampling |
30분 주기 | At 30-minute intervals | Long-term (monthly) sampling |
1시간 주기 | At 1-hour intervals | Long-term trend sampling |
LTTB (Largest-Triangle-Three-Buckets) is a downsampling algorithm that best preserves the visual shape of a time series and is optimized for chart display.
Chart Display Options
An inline toolbar on the right of the chart panel header.
| Item | ID | Options | Description |
|---|---|---|---|
| Chart Type | chart_type | Line · Area · Column · Smooth Line · Smooth Area | Chart series rendering method |
| Step Line | show_step_line | Basic Line / Step Line | Step-like representation like digital signals |
| Alarm Display | show_alarm_flags | Show Alarms / Hide | Markers on the chart at alarm occurrence times |
| TRIP Display | show_trip_line | Show TRIP / Hide | Show trip threshold lines only in multi Y-AXIS mode |
| C.HEIGHT | chart_height | 100/150(default)/200/250/300/400/500 | Chart height (px) |
| Settings | (Button) | — | configure() — Additional chart settings dialog |
| Excel Download | (Button) | — | downloadXLS() — Download results to Excel |
Chart Area
| Item | ID | Description |
|---|---|---|
| Chart | result_chart | 600px high time series chart |
| Result Count | result_count_txt / result_time_txt | Top right of the chart — number of displayed data points and query execution time |
| No Data Notice | chart_no_data | "No data to display." (When no tags are selected or results are empty) |
| Loading Indicator | ws_wait_text | "Loading data..." (spinner icon) |
| Execution Time | exec_time_txt | Small text at the bottom of the panel — time taken for the last query |
Tag Aggregation Table
Aggregation statistics for the selected tags are displayed in a table format below the chart (storage_table).
┌──────────────────────────── 헤더 (그룹) ────────────────────────────┐
│ 태그ID │ 태그명 │ 데이터 타입 │ 단위 │ 집계 (4 컬럼) │ 액션 │
│ │ │ │ │ 카운트 │첫|끝│최저|최고│평균|합계│ │
└────────────────────────────────────────────────────────────────────┘
| Column | Width | Display |
|---|---|---|
| Tag ID | 90px | Tag identifier |
| Tag Name | 220px+ | Human-readable tag name |
| Data Type | 80px | INT/FLOAT/BOOL/STRING, etc. |
| Unit | 50px | Unit of measurement (e.g., °C, kPa, rpm) |
| Count | 60px | Number of data points in the query period |
| First | Last | 60px | Values at the start/end time |
| Min | Max | 60px | Minimum and maximum values |
| Avg | Sum | 60px | Average and sum |
| Action | 40px | Row-level tool buttons |
Add Timeline Dialog
You can overlay an asset-level event timeline on the chart.
| Item | Description |
|---|---|
| Trigger | A separate button in the chart tools (position may vary by chart) |
| Modal Title | 🎯 "Add Timeline" |
| Notice | "Add an asset event timeline to the chart. Select an asset, then click the [Add Timeline] button." |
| Asset Select | t_asset_id selector (240px) — select from the registered equipment list |
| Confirm | Add Timeline button |
Once the timeline is added, events for that asset (running/stopped/anomaly) are drawn as colored bars below the chart, allowing comparison with the time series.
Snapshot Screen (/snapshot/index)
Snapshot has a similar layout to Trend, but is optimized for viewing values sampled at regular intervals (minutes) in a table format.
Top Search Area
🔪 스냅샷 [기간 ▭▭▭▭] [간격 ▼] [조회] [↻]
| Control | Description |
|---|---|
Period Input (search_time) | Same as Trend (280px, center-aligned) |
Interval Selector (term) | System-defined snapshot period options (e.g., 1_MIN/5_MIN/30_MIN/1_HOUR/1_DAY) |
| Query | search() — Update the table with the conditions |
| Refresh | refresh() — Reset the screen |
Left Area
Same tag tree panel as Stream/Trend (site selector, asset/connection tabs, search).
Right Area
Displays the snapshot values of the tags checked in the left tree in chronological order. In table form, each row is a point in time, and each column shows the value of one tag.
Usage example: Observing 5 tags at 1-minute intervals for a week → organized as 10,000 rows × 5 columns, making it easy to import into external tools.
Data Export Screen (/data/index)
A screen for querying the time series data of one tag and downloading it as CSV.
| Number | Location | Function |
|---|---|---|
| ① | Top | Tag Name Input — select one tag with autocomplete |
| ② | Period — start ~ end | |
| ③ | Count — recent 100 / 200 / 300 / 500 / 1,000 | |
| ④ | Query | |
| ⑤ | Right end | CSV Download · Query Condition Options · Refresh |
| ⑥ | Body | Data List — 8 columns (below) |
| ⑦ | Bottom of table | Count display and previous/next |
The image above shows that state — "No data". You must select a tag and click Query to fill it.
Data List — 8 Columns
| Column | Content |
|---|---|
| Time | Point timestamp |
| Value | Collected value |
| Unit | Tag's unit |
| Data Type | String / Integer / Double / Boolean … |
| Quality | OPC quality code |
| Error Code | Collection error code |
| Delay[MS] | Difference between occurrence time and receive time |
| Attributes | Additional attributes |
Query Conditions
Expand the condition input area with the 🎚️ button on the right. You can filter and query/export values in the form of 컨디션: VALUE > 10 AND VALUE < 50 as shown by the screen placeholder.
The screen subtitle says it directly — "Tag time series data query / CSV export". The feature received via .xlsx does not exist on this screen. To open it in Excel, open the downloaded CSV instead. (Receiving the tag list as an Excel file is a different feature — it's the "Excel Download" on the Tag screen.)
Tag data export is truncated at 1,000,000 rows, and asset data export at 100,000 rows (POINT_EXPORT_LIMIT · ASSET_DATA_EXPORT_LIMIT). If the limit is reached, the file is silently truncated without an error; please split the period and download in multiple batches.
Asset Data Export (/data/as-index)
Does the same thing but by asset instead of tag. The screen subtitle is "Asset-specific time series data query / CSV export", and you enter an asset name instead of a tag name.
Tag Data Export (/data/index) | Asset Data Export (/data/as-index) | |
|---|---|---|
| What you select | One tag | One asset |
| Output Columns | Time·Value·Unit·Type·Quality·Error Code·Delay·Attributes | Asset ID · Asset Name · Data Map · Timestamp Map |
| Row Limit | 1,000,000 rows | 100,000 rows |
| Additional Panel | — | Timeline — data activity per time interval of the asset |
Because the values of the tags mapped to an asset are bundled as a map in one row, this is more convenient if you want to see the overall state of an equipment unit at one point in time.
Use Case Scenarios
| Scenario | Screen | Example Configuration |
|---|---|---|
| Current line operation monitoring | Stream | Check 5 key tags in the line asset tree → Display 5 minutes → Start |
| Last night's shift trend analysis | Trend | Period 21:00~07:00 / Sampling 1 min / Chart type line |
| One-month remote line comparison | Trend | Period 1 month / Sampling LTTB 1% / TRIP display ON |
| Reconstructing the situation just before an alarm | Trend | Period alarm time ±10 minutes / Alarm display ON / Add timeline |
| Data for 30-minute interval daily reports | Snapshot | Period 24 hours / Interval 30_MIN |
| Transferring data to external analysis tools | Data Export | 1 week + 5 key tags → CSV download |
Frequently Asked Questions
Q. I started streaming but the chart isn't filling up. A. Make sure you have checked tags in the left tree. Also, verify the pipeline card on the Dashboard isn't 0 — data ingestion itself may be interrupted.
Q. Trend queries are too slow. A. That means there's too much data. Use the 🎚️ button to enable the Sampling selector and downsample with LTTB (e.g., 1%) or at time intervals (e.g., 5 minutes).
Q. There are too many chart series, making it hard to read. A. Click on a series name in the legend at the top right of the chart to toggle its visibility. Also, unchecking a tag in the left tree will remove it from the chart.
Q. I turned on the alarm display option, but no markers appear on the chart. A. There were no alarms for that tag during the query period. Check the alarm history on the Alarm screen first.
Q. I don't see a TRIP line. A. TRIP lines are only displayed in Multi Y-AXIS mode (when multiple tags have different Y-axes). They are not displayed in single Y-axis mode for chart readability.
Q. What's the difference between Stream and Trend? A. Stream shows currently incoming data, while Trend shows previously stored data. Also, Stream updates automatically, but Trend only updates when the operator explicitly clicks Query.
Q. What is a virtual point? A. It's a user-defined point that is not an actual sensor tag but is calculated from the values of other tags. Example: the difference between two temperature sensors, pressure × flow rate, etc. You define it via the Add Virtual Point button on the Stream screen.
Q. The Excel download produces an empty file. A. An empty file is created when the chart is empty or there are no query results. First, check that the chart is rendering correctly, then download.
Q. What happens if I check too many tags on one screen? A. For chart readability and rendering speed, we recommend limiting it to 10-20 at a time. If there are more, reduce the data amount using LTTB sampling.
Related Screens
- Dashboard — Data ingestion trends by site at a glance
- Daily Statistics — Daily comparison analysis by site · line · equipment
- Predictive Analysis — Learn from tag data for prediction and anomaly detection
- Alarm — Linked with alarm display on the trend chart
- Factory Management — Asset and tag registration
- Status Code Definitions — Data types and status codes