界面配置

这里介绍的折线图为【value over time】，更多详细配置可在viewstar参考手册中搜索：Trend widget

image-20241108113222152

Common—基础设置

image-20241107170312744

Display time range

image-20241107170338031

设置每一大格的时间间距

image-20241107170412005

Legend/Toolbar

image-20241107170809244 image-20241107170743532

font

设置字体格式

image-20241107170904908

Time and value grid

image-20241107170953067
  1. Draw grid：会在每一个时间段出现一条虚线
image-20241107171056153
  1. Draw background grid：意义不明

Area

image-20241107171218382

Area

一般只需要一个即可，如果是两个，效果如下

image-20241107171413447

Time Scale

image-20241107171454975

时间轴显示在下方还是上方

image-20241107171557869

设置第一个显示时间，一般为【时：分】。通过User defined自定义设置

里面的参数可以通过viewstar的帮助手册搜索：formatTime。

内容如下：

image-20241107172001780
image-20241107172246884

设置第一个显示时间，一般为【月：天】，设置方法同上。

Curve

image-20241107172354477

添加曲线

image-20241107172502634 image-20241107172510430

当点击添加曲线后，可以输入一个DP element。曲线就会随着这个DP值的变化而改变。（也可以不输入，在初始化中使用脚本添加）

Common

image-20241107172723721

Data source

  1. DP-element：检测的数据点名
  2. Curve name：曲线名称
  3. From DPE：默认勾选上

type

  1. Curve type

    • Points

      image-20241107173525872

    • Steps

      image-20241107173427373

    • Linear

      image-20241107173309774

    • Event（感觉用不到）

  2. Point type

​ image-20241107173639237

当数据点改变的形状。

如：

image-20241107173933889

  1. Filling

    • None
    • Bottom
    • Ref.value
    • 对比：image-20241107174419686

  2. Line color、Line style

设置曲线颜色，样式

Legend

image-20241107174937094
  1. Value visible：显示顶部数据

​ 勾选情况下：

image-20241107175453708

  1. Auto format x：

​ image-20241107175853585

若这样设置，（第一个数字意义不明）第二个数字3表示，小数点保留三位。

Grid

image-20241107181704743

感觉没啥用，可以看看手册。

Scale

image-20241107181748087

Y-scale

  1. Auto format：Y轴上的数保留几位小数
  2. Auto scale：Y轴上的数最小显示多少、最大显示多少（设置这个可以防止Y轴乱跳）

​ image-20241107182055946

Options

image-20241107182212483

折现从哪个地方开始绘制

代码配置

更多详细配置可在viewstar参考手册中搜索：Trend

曲线添加数据点

connectDirectly

1
2
3
4
5
shape.connectDirectly(string Name, string dp);
// name: 曲线名称  dp: dp名称

// 例：
Trend.connectDirectly("curve1", "trendTest1.:_original.._value");

运行曲线

trendRun

1
2
shape.trendRun();
// 一般用于给曲线添加数据点之后

修改Legend字体

legendFont

连接曲线

linkCurves

1
Trend.linkCurves("curve1", "curve2", "curve3");

修改Legend文字

curveLegendName

1
Trend.legendFont("Arial Black, -1, 11, 5, 87, 0, 0, 0, 0, 0");

“Arial Black”：字体名称。这里设置为 “Arial Black”，即粗体的 Arial 字体。

-1：字符集（charset），通常 -1 表示使用系统默认字符集。

11：字体大小。这里指定字体大小为 11 点。

5：字体的粗细（weight）。5 表示中等粗细。不同值通常表示：

  • 0 表示常规（Regular）
  • 5 表示半粗体（Medium）
  • 9 表示粗体（Bold）

87：字体角度（angle），指定字体的倾斜角度。通常 0 表示正常，不倾斜。

0,0,0,0,0：这五个值一般用于指定额外的样式属性，通常在默认设置中都为 0，表示没有其他特殊效果。

设置Y轴曲线的自动缩放

trendSetYaxisIndex

隐藏左侧Y轴曲线

curveScaleVisibility

设置左侧Y轴曲线格式

scaleFont

隐藏Y轴曲线

linkCurves

配合着curveScaleVisibility可以实现左边只有一条轴

如果有3条及以上的曲线，linkCurves连接时

1
2
3
4
5
6
7
// 隐藏掉2、3条曲线的Y轴
Trend.curveScaleVisibility("curve2") = false;
Trend.curveScaleVisibility("curve3") = false;

// 连接1、2、3条曲线
Trend.linkCurves("curve1", "curve2");
Trend.linkCurves("curve2", "curve3");