“组合图”小组件 (可应用主题)
概述
“组合图”小组件用于在图表上使用多种标记类型 (例如：柱形、线条、面积和点) 来表示数据系列。可以使用不同类型的可视化叠放多组数据，以比较多个数据系列的单位数量。Y 轴表示数量，X 轴表示类别。使用不同的图表可视化类型显示数据，有利于用户阅读多个 Y 轴的不同刻度。
以下是组合图的一些主要配置。
• 使用线条、柱形、面积和点，对数据系列进行可视化。
• 绑定多个源的数据。
• 配置数据系列的堆积顺序 ZIndex。
• 根据值应用状态格式，以对图表进行样式设置。
• 分组和堆积数据系列。
最佳做法
• 保持启用数据采样可提高运行时的图表性能。当图表显示来自多个系列的数千个数据点时，禁用数据采样可能会导致性能降低。仅应该在图表数据集较小时禁用采样。
数据格式
必须创建一个其中包含表示图表数据结构的字段定义的信息表。信息表必须包含用于设置 X 和 Y 轴值的字段定义。您可以添加多个数据系列，方法是添加用于设置数据系列值的字段定义来添加其他列。每个信息表行表示 X 轴上的类别及其相应 Y 轴值。下表列出了信息表的数据格式：
X 轴 | Y 轴值 | Y 轴值 N | |||
|---|---|---|---|---|---|
字段定义 | x:{name: 'x', baseType: 'STRING'} | value1: {name: 'value1', baseType: 'NUMBER'} | value1:{name:'value2',baseType:'NUMBER'} | ||
作用 | 定义 X 轴值。数据必须具有 STRING、NUMBER 或 DATETIME 基本类型。每一行在 X 轴上显示为一个类别。为此列定义的名称是应该为 XAaxisField 小组件属性选择的选项。 | 用于定义 Y 轴值和类别的图例标签。 | 用于定义 Y 轴值和每个附加数据系列的图例标签。 | ||
基本类型 | STRING、NUMBER 或 DATETIME
| NUMBER | NUMBER | ||
行示例 | x: 'Apple' - 其中 Apple 是 X 轴显示的类别名称 | value1: 10 - 类别的 Y 轴值 | value2: 30 - 数据系列 N 的 Y 轴值。 |
下图显示了 y 轴上具有四个字段定义的信息表所返回数据的示例：
小组件属性
下面列出了“组合图”小组件的属性。
属性名称 | 说明 | 基本类型 | 默认值 | 是否可绑定? (Y/N) | 是否可本地化? (Y/N) |
|---|---|---|---|---|---|
AlignBarsAtZero | 在零点处对齐图表上所有 Y 轴的条形。 | BOOLEAN | False | Y | N |
AxisDisplayControl | 向图表工具栏添加配置菜单，以控制运行时 Y 轴的可见性。 | BOOLEAN | False | Y | N |
ChartType | 用于设置：图表中系列数据的默认可视化类型。可以使用 SeriesNType 属性改写各个数据系列的上述选择。 | STRING | 线 | N | N |
CustomClass | 用于指定：应用于此小组件的自定义 CSS 类。可以输入多个类，以空格分隔。 | STRING | 不适用 | Y | N |
Data | 图表的信息表数据源。 | Infotable | 不适用 | Y | N |
DataFieldN | 用于指定：用于数据系列 N 的信息表字段。 | Infotable | 不适用 | N | N |
DataLabelN | 数据系列 N 的图例区域中显示的标签。 | STRING | 不适用 | Y | Y |
DataPointSelection | 用于指定：相对于指针位置选择的数据点。可以设置属性以选择在垂直轴和/或水平轴上最近的数据点。选项： • 无 • 指针位置 • 最接近水平轴 • 最接近垂直轴 • 接近两个轴 | STRING | 不适用 | Y | N |
DataSeriesStyleN | 用于对图表中的数据系列 N 应用状态格式。可基于数据值设置系列的样式，便于发现趋势和模式。 | 状态格式 | 不适用 | N | N |
DirectSelectionZoom | 可通过选择图表中的两个数据项进行放大。 此属性可用的选项包括“水平轴”、“垂直轴”、“两者”和“无”。 此属性将在选择 HorizontalZoom 或 VerticalZoom 时显示在属性列表中。 | STRING | 无 | Y | N |
DragSelectionZoom | 可通过在要查看的数据范围周围绘制一个选择框来放大图表的特定部分。 此属性可用的选项包括“水平轴”、“垂直轴”、“两者”和“无”。 此属性将在选择 HorizontalZoom 或 VerticalZoom 时显示在属性列表中。 | STRING | 无 | Y | N |
Disabled | 禁用混搭中的小组件。 | BOOLEAN | 不适用 | Y | N |
DisplaySeriesNOn | 用于设置：数据系列 N 的 Y 轴或堆积组。 | STRING | N | N | |
EmptyChartIcon | 用于指定：图表为空白时显示的图标。 | 媒体 | not visible | N | N |
EmptyChartLabel | 用于指定：绑定信息表不包含任何数据时显示的文本。 | STRING | [[ChartStateLabelEmpty]] | N | Y |
ErrorStateIcon | 用于指定：图表数据无法加载时显示的图标。 | 媒体 | error | N | N |
ErrorStateLabel | 用于指定：图表数据无法加载时显示的文本。 | STRING | [[ChartStateLabelError]] | N | N |
ExternalPadding | 设置与轴之间的填充。填充值是条形宽度的百分比。 | NUMBER | 25 | Y | N |
GroupPadding | 设置系列之间的填充。填充值是条形宽度的百分比。 | NUMBER | 25 | Y | N |
HideLegend | 隐藏图例区域。 | BOOLEAN | False | Y | N |
HideNotes | 隐藏注解区域。 | BOOLEAN | False | Y | N |
HideValues | 隐藏图表中的值标签。 | BOOLEAN | False | Y | N |
HideXAxis | 隐藏 X 轴。 | BOOLEAN | False | Y | N |
HideYAxisN | 隐藏数据系列 N 的 Y 轴。 | BOOLEAN | False | Y | N |
HorizontalAxisLabelsRotation | 输入介于 -180 和 180 之间的值，以设置标签在水平轴上的旋转角度。 | NUMBER | 自动计算 | N | N |
HorizontalAxisMaxHeight | 设置水平轴的最大高度。 | NUMBER | 85 | Y | N |
HorizontalZoom | 用于放大或缩小水平轴。 选择此属性时，HorizontalIntervalControl、HorizontalRangeZoom、HorizontalSliderZoom、DirectSelectionZoom 和 DragSelectionZoom 属性将显示在属性列表中。 | BOOLEAN | False | Y | N |
HorizontalIntervalControl | 添加允许根据特定间隔放大水平轴的控件。 可用选项为“无”(默认选择) 和“下拉列表”。 选择“下拉列表”后，HorizontalIntervalControlLabel 和 HorizontalIntervalData 属性将出现在属性列表中。 | STRING | 无 | N | N |
HorizontalIntervalControlLabel | 指定水平轴间隔缩放控件的文本标签。 | STRING | 不适用 | Y | Y |
HorizontalIntervalData | 间隔缩放控件选项的数据源。 从水平间隔下拉列表中选择一个条目时，图表将根据选定的持续时间值和开始/结束定位点进行缩放。 | INFOTABLE | 不适用 | Y | N |
HorizontalIntervalAnchorPoint | 用于选择数据集内间隔范围的定位点。 选择“开始”可在数据集的起始处放置间隔，或者选择“结束”可在结束处放置间隔。 例如，如果在 12 个月的数据集中指定 3 个月的间隔，则可以选择“开始”来显示最初 3 个月，或选择“结束”来显示数据集的最后 3 个月。 此属性将在您选择 ShowHorizontalAnchorPointControl 属性时显示。 | STRING | 开始 | Y | N |
HorizontalIntervalAnchorPointLabel | 指定水平轴间隔定位点的标签。 此属性将在您选择 ShowHorizontalAnchorPointControl 属性时显示。 | STRING | 不适用 | Y | Y |
HorizontalRangeZoom | 添加用于在水平轴上指定值范围内进行放大的控件。 选择此属性时，下列 HorizontalStartZoomLabel 和 HorizontalEndZoomLabel 属性将显示在属性列表中。 | BOOLEAN | False | Y | N |
HorizontalStartZoomLabel | 用于指定范围选择的起始位置的文本标签。 | STRING | 不适用 | Y | Y |
HorizontalEndZoomLabel | 用于指定范围选择的结束位置的文本标签。 | STRING | 不适用 | Y | Y |
HorizontalSliderZoom | 添加用于显示水平轴上最小值和最大值之间数据的控制滑块。 选择此属性时，HorizontalSliderZoomMaxLabel 和 HorizontalSliderZoomMinLabel 属性将显示在属性列表中。 | BOOLEAN | False | Y | N |
HorizontalSliderZoomMaxLabel | 用于指定滑块缩放控件最大值的标签。 | STRING | 不适用 | Y | Y |
HorizontalSliderZoomMinLabel | 用于指定滑块缩放控件最小值的标签。 | STRING | 不适用 | Y | Y |
InternalPadding | 设置系列之间的填充。填充值是条形宽度的百分比。 | NUMBER | 25 | Y | N |
Label | 用于指定：组合图的文本标签。 | STRING | [[ComboChart]] | Y | Y |
LabelReset | 用于设置：图表工具栏上重置按钮的标签。 | STRING | 重置 | Y | Y |
LabelAlignment | 对齐小组件标签的文本。选项：“无”、“左”、“居中”、“右”。 | STRING | 左 | N | N |
LabelPosition | 用于设置：文本标签的位置。选项：“无”、“上”、“下”、“左”。 | STRING | 上 | N | N |
LabelType | 用于设置：组合图的标签类型，例如“页眉”、“子页眉”、“标签”或“正文”。 | STRING | 子页眉 | Y | N |
LegendAlignment | 对齐图表图例。 | STRING | 左 | N | N |
LegendFilter | 在图例中数据系列旁边添加复选框，用于控制数据系列的可见性。 | BOOLEAN | False | N | N |
LegendMaxWidth | 设置图例区域的最大宽度。 | NUMBER | 736 | Y | N |
LegendPosition | 用于设置：图表图例的位置。选项： “无”、“左”、“居中”、“右”。 | STRING | 左 | N | N |
LoadingIcon | 用于指定：加载图表数据时显示的图标。 | STRING | chart_loading_combo_pareto | N | N |
Margin | 此属性已禁用。必须定义此响应式小组件在容器上的间距。 | STRING | 5 | N | N |
MarkerShape | 用于设置：图表上数据点的标记形状。选项：“无”、“圆形”、“方形”、“菱形”。 | STRING | 圆形 | N | N |
MultipleDataSources | 用于对图表上多个来源的数据进行可视化。 | BOOLEAN | False | N | |
NoDataSourceIcon | 用于指定：图表未绑定到数据源时显示的图标。 | 介质 | bind | N | N |
NoDataSourceLabel | 用于指定：图表未绑定到数据源时显示的文本。 | STRING | [[ChartStateLabelNoData]] | N | Y |
Notes | 用于指定：图表的注解区域中显示的文本。可以输入字符串，也可以选择本地化标记。 | STRING | 不适用 | Y | Y |
NotesAlignment | 对齐注解区域内的文本。 | STRING | 左 | N | N |
NotesPosition | 用于设置：注解区域的位置。 | STRING | 下 | N | N |
NumberOfReferenceLines | 用于设置：图表中显示的参考线的数量。参考线可用于突出显示相对于特定值的图表数据。最多可添加 24 条线并配置每条线的标签、轴和值。 | NUMBER | 0 | N | N |
NumberOfSeries | 用于设置：图表中显示的数据系列的数量。 | NUMBER | 8 | N | N |
NumberOfStacks | 用于设置：图表中显示的数据系列堆积的数量。 | NUMBER | 0 | N | N |
NumberOfXLabels | 用于设置：X 轴的标签数。 | NUMBER | Auto | Y | N |
NumberOfYaxes | 用于设置：图表上显示的 Y 轴的数量。 | NUMBER | 1 | N | N |
PointerType | 用于指定将鼠标悬停在图表上时指针的外观。利用指引线，可相对于轴跟踪数据值。选项：“无”、“标准”、“水平线”、“垂直线”、“十字线”。 | STRING | 标准 | Y | N |
ReferecneLineNLabel | 用于设置：参考线的文本标签。 | STRING | Y | Y | Y |
ReferecneLineNValue | 用于设置：参考线的数字值。 | NUMBER | Y | N | Y |
ReferenceLineNAxis | 指定要用于参考线的轴。 | STRING | N | N | N |
ResetToDefaultValue | 将此小组件的输入重置为默认值。 | 服务 | 不适用 | Y | N |
ReverseXAxis | 逆序显示 X 轴值。 | BOOEALN | False | N | N |
ReverseYAxis | 反转 Y 轴值的顺序。 | BOOEALN | False | N | N |
RulersInFront | 在数据值前方显示标尺。默认情况下，标尺显示在数据后方。 | BOOEALN | False | Y | N |
SampleSize | 用于设置：在图表中进行大数据集可视化时，所显示的数据点的最大数目。要禁用采样，请将此属性设置为 0。 | NUMBER | Auto | Y | N |
SelectedData | 包含图表中选定数据的信息表。 | INFOTABLE | 不适用 | Y | N |
SelectedSeriesChanged | 当更改选定系列时触发的事件。 | 事件 | 不适用 | Y | N |
SelectionMode | 用于控制：用户可以同时选择多少数据点。选取“多个”将允许用户选择多个数据点。选项：“无”、“默认”、“单一”、“多个”。 | STRING | 默认 | Y | N |
Series1MarkerShape | 用于设置：图表中数据系列 1 的数据点的标记形状。 | STRING | 默认 | N | N |
Series1MarkerSize | 用于设置：数据系列 1 的标记大小。 | NUMBER | 8 | Y | N |
Series1Type | 用于设置：图表中数据系列 1 的可视化类型。 | STRING | 默认 | N | N |
Series1ZAxis | 用于设置：Z 轴上系列的顺序。默认情况下，所有组均设置为相同的 Z 轴值。堆积分组根据序列类型以及此属性的组合进行排序。 | NUMBER | 0 | N | N |
SeriesClicked | 当用户单击图表中的数据点时触发事件。 | 事件 | 不适用 | Y | N |
ShowChartBands | 突出显示图表中条形类别的保留空间。设置为 true 时，每个类别的区域均以灰色显示。 | BOOLEAN | False | N | N |
ShowDataLoading | 在加载数据时显示旋转图标。 | BOOLEAN | True | N | N |
ShowHideLegend | 用于添加显示/隐藏按钮，可供用户在运行时显示或隐藏图表图例。 | BOOLEAN | False | N | N |
ShowHorizontalAnchorPointControl | 添加用于调整水平轴定位值的控件 选择此属性时，HorizontalIntervalAnchorPoint 和 HorizontalIntervalAnchorPointLabel 属性将显示在属性列表中。 | BOOLEAN | False | Y | N |
ShowXAxis | 显示 X 轴标尺。 | BOOLEAN | False | Y | N |
ShowYAxis | 显示 Y 轴标尺。 | BOOLEAN | False | Y | N |
ShowXAxisRuler | 显示 X 轴标尺。 | BOOLEAN | False | Y | N |
ShowYAxisRuler | 显示 Y 轴标尺。 | BOOLEAN | False | Y | N |
ShowZeroValueRuler | 显示零值标尺。 | BOOLEAN | False | Y | N |
SparkView | 显示图表可视化的简化视图。启用此属性可隐藏标签、图例和标尺。 | BOOLEAN | False | Y | N |
ShowZoomButtons | 启用水平或垂直缩放后，在图表工具栏上显示放大和缩小按钮。 | BOOLEAN | False | N | N |
TabSequence | 按 TAB 键时小组件的序号。 | NUMBER | 0 | N | N |
ValuesPosition | 用于设置：数据值标签相对于数据点的位置。 | STRING | 高于 | N | N |
ValuesPositionBar | 用于设置：数据值标签相对于图表条形的位置。 | STRING | 条形外部 | N | N |
ValuesTooltip | STRING | Y | Y | ||
VerticalAxisMaxWidth | 用于设置：垂直轴的最大宽度。 | NUMBER | 85 | Y | N |
VerticalZoom | 用于放大或缩小垂直轴。 | BOOLEAN | False | Y | N |
VerticalSliderZoom | 添加用于显示垂直轴上最小值和最大值之间数据的控制滑块。 选择此属性时，VerticalZoomMaxLabel 和 VerticalZoomMinLabel 属性将显示在属性列表中。 | BOOLEAN | False | Y | N |
VerticalZoomMaxLabel | 用于指定滑块缩放控件最大值的文本标签。 | STRING | 不适用 | Y | Y |
VerticalZoomMinLabel | 用于指定滑块缩放控件最小值的文本标签。 | STRING | 不适用 | Y | Y |
Visible | 启用后，小组件在混搭中可见。 | BOOLEAN | True | Y | N |
XAxisField | 选择包含 X 轴数据的信息表字段。 | INFOTABLE | 不适用 | N | N |
XAxisLabel | 用于指定：X 轴的文本标签。 | STRING | [[XAxis]] | Y | Y |
XAxisLabelAlignment | 对齐 X 轴标签。 | STRING | 左 | N | N |
XAxisType | 用于设置：X 轴值的格式类型。 | STRING | 字符串 | Y | N |
YAxesMaxWidth | 用于设置：Y 轴区域的最大宽度。当面积超过最大宽度时，将显示一个滚动条。 | NUMBER | 1200 | Y | N |
YAxisNFormat | 用于设置：Y 轴 N 值的格式。 | STRING | 0000.0 | Y | N |
YAxisNLabel | 用于指定：Y 轴 N 的文本标签。 | STRING | [[YAxis]] | Y | Y |
YAxisNLabelAlignment | 用于对齐：Y 轴 N 的标签。 | STRING | 中 | N | N |
YAxisNMaximumValue | 用于设置：Y 轴范围的最大值。默认情况下，范围会根据小组件数据自动计算。 | NUMBER | Auto | Y | N |
YAxisNMinimumValue | 用于设置：Y 轴范围的最小值。默认情况下，范围会根据小组件数据自动计算。 | NUMBER | Auto | Y | N |
YAxisNNumberOfLabels | 用于设置：Y 轴 N 的标签数。 | NUMBER | Auto | Y | N |
YAxisNPosition | 用于指定：Y 轴位置。设置为“自动”时，第一个 Y 轴显示为主轴，其余显示为副轴。 | STRING | 自动 | N | N |
ZeroValueRuler | 用于控制：图表中零值标尺的可见性。只能显示主轴或副 Y 轴的标尺。选项：“主轴”、“副轴”、“无”、“两者”。 | STRING | 无 | Y | N |