图表对象API
autoResize(autoResize)
获取/设置图表是否自动调整尺寸。
参数:
-
autoResize
可选,设置是否自动调整尺寸,true是;false否。
返回值:
要获取的是否自动调整值,
true 是;false 否。
图表初始化时会使用dg-chart-auto-resize的值执行设置操作。
设置操作应在chart.init()函数执行后且chart.render()函数执行前调用, 比如图表监听器的
图表渲染器实现相关: 需要图表渲染器实现其
设置操作应在chart.init()函数执行后且chart.render()函数执行前调用, 比如图表监听器的
onRender()函数中。
图表渲染器实现相关: 需要图表渲染器实现其
resize()函数。
bindLinkEventHanders(links)
绑定图表联动事件处理函数,以添加图表联动功能。
参数:
-
links
图表联动配置对象、配置数组。
返回值:
[
//type 绑定事件类型
//handler 绑定事件处理函数
{ type: "...", handler: function(...){ ... } },
...
]
,已绑定的事件处理函数信息数组。
configValue(name, value)
获取/设置指定图表配置值。
参数:
返回值:
要获取的配置值,没有则是
null。
configValues(values)
获取/设置全部图表配置值。
参数:
-
values
可选,要设置的全部配置值,应符合图表插件-配置表单属性值类型。
返回值:
要获取的全部配置值,格式为:
{ "...": ..., ... }。
图表初始化时会使用dg-chart-config-values的值执行设置操作。
设置操作应在chart.init()函数执行后且chart.render()函数执行前调用, 比如图表监听器的
设置操作应在chart.init()函数执行后且chart.render()函数执行前调用, 比如图表监听器的
onRender()函数中。
configValuesOrigin(values)
获取全部原始图表配置值,它们是在定义图表时设置的,未与dg-chart-config-values合并。
参数:
无。
返回值:
{ "...": ..., ... },全部原始配置值。
contextURL(url)
为以
'/'字符开头的URL前置添加系统根路径。
参数:
-
url
可选,要处理的URL,例如:/static/theme/blue/image/logo.png。
返回值:
"..."
如果
url以'/'字符开头,则前置添加系统根路径后返回,否则,直接返回原url;
如果未设置url参数,则返回系统根路径。
dashboard()
获取当前看板对象。
参数:
无。
返回值:
看板对象。
dataSetAlias(dataSetBind, alias)
获取/设置数据集别名。
对于获取操作,它首先取
对于获取操作,它首先取
dataSetBind.alias,如果为空,则取dataSetBind.dataSet.name。
参数:
返回值:
要获取的别名,不会为
null。
dataSetAttachment(dataSetBind, attachment)
获取/设置数据集是否为附件。
参数:
返回值:
要获取的是否附件布尔值。
dataSetBindAt(index)
获取指定索引的数据集绑定。
参数:
-
index
数据集绑定数组索引号。
返回值:
数据集绑定,没找到则是
null。
数据集绑定
{
//必填,数据集
dataSet: 数据集,
//可选,数据集别名
alias: "...",
//可选,是否是附件数据集绑定,附件数据集绑定不应用作绘制图表
attachment: true、false,
//可选,数据集查询
query: 数据集查询,
//可选,数据集标记信息数组,元素值为对应数据标记全名(其fullname值)
dataSetSigns: ["...", ...],
//可选,数据集字段标信息映射表,名为数据集字段全名(其fullname值),值为对应数据标记全名(其fullname值)数组
fieldSigns: { "..." : ["...", ...], ... },
//可选,数据集字段别名映射表,名为数据集字段全名(其fullname值)
fieldAliases: { "...": "...", ... },
//可选,数据集字段排序映射表,名为数据集字段全名(其fullname值)
fieldOrders: { "...": 数值, ... }
}
数据集
数据集字段
{
//必填,名称
name: "...",
//可选,全名,在所属数据集内唯一,如果不设置,系统会自动生成,
//规则为:"父级字段fullname.name",示例:"parent.name"、"value"
fullname: "...",
//必填,类型:"string" 字符串;"boolean" 布尔值;"number" 数值;"integer" 整数;
//"date" 日期;"time" 时间;"timestamp" 时间戳;"object" 时间戳;"unknown" 未知。
type: "...",
//可选,字段值是否是数组
array: false、true,
//可选,标签名,可能为null
label: "...",
//可选,当type为object时的子级数据集字段数组
fields: [ ... ]
}
数据集参数
{
//必填,参数名
name: "...",
//必填,参数类型:"string" 字符串;"boolean" 布尔值;
//"integer" 整数;"number" 数值;"object" 对象
type: "...",
//可选,是否必填
required: true、false,
//可选,参数描述
desc: "...",
//可选,输入框类型:
//"text" 文本框;"select" 下拉框;"radio" 单选框;"checkbox" 复选框;
//"textarea" 文本域;"date" 日期;"time" 时间;"datetime" 日期时间
inputType: "...",
//可选,输入框配置
inputPayload: ...
}
数据集查询
{
//数据集参数值映射表,名为数据集参数名(其name值),值为对应参数值
paramValues: { "...": ..., ... },
//是否忽略加载结果
ignoreFetch: true、false,
}
dataSetBindAttachment(dataSign)
参数:
返回值:
数据集绑定,没找到则是
null。
dataSetBindIndex(dataSetBind)
参数:
-
dataSetBind
数据集绑定。
返回值:
索引号,未找到则是
-1。
dataSetBindMain(dataSign)
参数:
返回值:
数据集绑定,没找到则是
null。
dataSetBinds()
获取全部数据集绑定。
参数:
无。
返回值:
[ 数据集绑定, ... ]。
dataSetBindsAttachment(dataSign)
参数:
返回值:
[ 数据集绑定, ... ]。
dataSetBindsFetched(dataSetBinds, chartResult)
筛选未忽略结果的数据集绑定数组。
参数:
-
dataSetBinds
数据集绑定或其数组。 -
chartResult
可选,用于校验是否忽略结果的的图表结果, 如果未设置,则使用chart.dataSetIgnoreFetch()函数匹配。
返回值:
[ 数据集绑定, ... ],其中都是未忽略结果的。
dataSetBindsMain(dataSign)
参数:
返回值:
[ 数据集绑定, ... ]。
dataSetField(owner, identity)
深度查找指定标识的数据集字段。
参数:
返回值:
数据集字段,没有找到则是
null。
dataSetFieldAlias(dataSetBind, field, alias)
参数:
返回值:
要获取的别名,不会为
null。
dataSetFieldFlat(owner, identity)
获取
owner包含的指定标识的数据集字段,不会深度查找。
参数:
返回值:
数据集字段,没有找到则是
null。
dataSetFieldOfSign(dataSetBind, fieldsOwner, dataSign)
获取
此函数支持如下调用方式:
fieldsOwner中设置了指定数据标记的数据集字段,不会深度查找。
此函数支持如下调用方式:
chart.dataSetFieldOfSign(dataSetBind, dataSign); chart.dataSetFieldOfSign(dataSetBind, fieldsOwner, dataSign);
参数:
返回值:
数据集字段,没有找到则是
null。
dataSetFieldOrder(dataSetBind, field, order)
获取/设置数据集字段排序值。
参数:
返回值:
要获取的排序数值,未设置过则是
null。
dataSetFieldSigns(dataSetBind, field, dataSigns)
获取/设置指定数据集字段的数据标记。
参数:
返回值:
要获取的数据标记数组,格式为:
[ "...", ... ]。
dataSetFields(owner)
获取
owner包含的全部数据集字段,不会深度查找。
参数:
返回值:
[ 数据集字段, ... ]。
dataSetFieldsOfSign(dataSetBind, fieldsOwner, dataSign)
获取
此函数支持如下调用方式:
fieldsOwner中设置了指定数据标记的所有数据集字段,不会深度查找。
此函数支持如下调用方式:
chart.dataSetFieldsOfSign(dataSetBind, dataSign); chart.dataSetFieldsOfSign(dataSetBind, fieldsOwner, dataSign);
参数:
返回值:
[ 数据集字段, ... ]。
dataSetIgnoreFetch(dataSetBind, ignoreFetch)
参数:
返回值:
要获取的是否忽略结果布尔值。
dataSetIgnoreFetches(ignoreFetches)
参数:
-
ignoreFetches
可选,要设置的是否忽略结果布尔值或其数组,true全部是;false全部否;[ true、false, ... ]详细设置。
返回值:
要获取的全部是否忽略结果布尔值,格式为:
[ true、false, ... ]。
dataSetParam(dataSetBind, identity)
获取指定标识的数据集参数。
参数:
返回值:
数据集参数,没有找到则是
null。
dataSetParamValue(dataSetBind, name, value)
参数:
返回值:
要获取的参数值,没有找到则是
null。
dataSetParamValueFirst(name, value)
获取/设置第一个数据集(数据集绑定数组中第
设置后,下次刷新将会按照设定参数值加载结果, 如果是在图表监听器的
0个元素)的单个参数值。
设置后,下次刷新将会按照设定参数值加载结果, 如果是在图表监听器的
onRender()、rendered()函数中设置,
本次将会按照设定参数值加载结果。
参数:
返回值:
要获取的参数值,没有找到则是
null。
dataSetParamValues(dataSetBind, paramValues, increment)
参数:
返回值:
要获取的全部参数值映射表,格式为:
{ "...": ..., ... }。
dataSetParamValuesFirst(paramValues, increment)
获取/设置第一个数据集(数据集绑定数组中第
设置后,下次刷新将会按照设定参数值加载结果, 如果是在图表监听器的
0个元素)的多个参数值。
设置后,下次刷新将会按照设定参数值加载结果, 如果是在图表监听器的
onRender()、rendered()函数中设置,
本次将会按照设定参数值加载结果。
参数:
返回值:
要获取的全部参数值映射表,格式为:
{ "...": ..., ... }。
dataSetParams(dataSetBind)
获取指定数据集的全部数据集参数。
参数:
返回值:
[ 数据集参数, ... ]。
dataSetSigns(dataSetBind, dataSigns)
获取/设置指定数据集的数据标记。
参数:
返回值:
要获取的数据标记数组,格式为:
[ "...", ... ]。
destroy()
销毁图表,内部调用chart.doDestroy()函数,执行销毁,释放图表占用的资源、恢复图表HTML元素初始状态。
参数:
无。
返回值:
另参考图表生命周期。
disableTool(disable)
获取/设置是否禁用内置图表工具(参数、数据工具按钮)。
参数:
-
disable
可选,要设置的是否禁用内置图表工具信息,支持格式:
true:全部禁用;
false:全部启用;
{ //可选,是否禁用参数按钮功能 param: false、true, //可选,是否禁用数据按钮功能 data: true、false }:详细设置。
返回值:
要获取的是否禁用内置图表工具信息,格式为:
{ param: false、true, data: true、false }。
图表初始化时会使用chart.options()中的
设置操作应在chart.init()函数执行后且chart.render()函数执行前调用, 比如图表监听器的
disableTool选项值(高优先级)、dg-chart-disable-tool的值执行设置操作。
设置操作应在chart.init()函数执行后且chart.render()函数执行前调用, 比如图表监听器的
onRender()函数中。
doDestroy()
调用chart.renderer()、
或者chart.plugin().renderer的
通常用于图表监听器的
destroy()
函数执行销毁图表操作。
通常用于图表监听器的
onDestroy()函数,在阻止默认销毁逻辑后,再调用此函数执行销毁。
参数:
无。
返回值:
无。
doRender()
调用chart.renderer()
或者chart.plugin().renderer的
通常用于图表监听器的
此函数是一个异步函数。
render()
函数执行无数据的初始绘制操作。
通常用于图表监听器的
onRender()函数,在阻止默认渲染逻辑后,再调用此函数执行渲染。
此函数是一个异步函数。
参数:
无。
返回值:
Promise,兑现时表示已渲染完成,无兑现值。
doUpdate(chartResult)
调用chart.renderer()
或者chart.plugin().renderer的
通常用于图表监听器的
此函数是一个异步函数。
update()
函数执行更新操作。
通常用于图表监听器的
onUpdate()函数,在阻止默认更新数据逻辑后,再调用此函数执行更新。
此函数是一个异步函数。
参数:
-
chartResult
图表结果。
返回值:
Promise,兑现时表示已更新完成,无兑现值。
element()
获取
<div>图表元素,即chart.elementId()函数返回的元素ID对应的元素。
参数:
无。
返回值:
<div>图表元素,不存在时则是null。
elementId(elementId)
参数:
-
elementId
可选,要设置的<div>图表元素ID。
返回值:
要获取的
<div>图表元素ID。
fetchGroup(group)
获取/设置图表取数分组。
如果图表加载数据比较耗时,可以为其指定一个分组,让其使用单独的ajax请求加载数据。
如果图表加载数据比较耗时,可以为其指定一个分组,让其使用单独的ajax请求加载数据。
参数:
-
group
可选,要设置的图表取数分组字符串。
返回值:
"...",要获取的图表取数分组。
图表初始化时会使用dg-chart-fetch-group的值执行设置操作。
设置操作应在chart.init()函数执行后且chart.render()函数执行前调用, 比如图表监听器的
设置操作应在chart.init()函数执行后且chart.render()函数执行前调用, 比如图表监听器的
onRender()函数中。
fetcher(fetcher)
获取/设置图表取数器,自定义图表数据提供逻辑。
参数:
-
fetcher
可选,要设置的图表取数器,支持格式如下:
"global":表示使用dashboard.fetcher()看板取数器统一处理;
"empty":表示使用空图表结果更新图表,即:{ dataSetResults: [] };
"default"、null:表示使用看板的默认逻辑提供数据;
函数图表取数器:表示使用自定义的函数取数器。
返回值:
要获取的图表取数器,格式同
fetcher参数,没有则是null。
函数图表取数器
function(context)
{
...
return ...;
}
其中,
context参数是获取上下文,格式为:
elementWidgetId()
获取
<div>图表元素上的图表部件ID,即dg-chart-widget属性值。
参数:
无。
返回值:
"...",图表部件ID,如果元素上未设置过,则是null。
findEventHandlerDelegates(filter)
查找通过chart.registerEventHandlerDelegate()函数注册的图表事件处理代理信息。
参数:
-
filter
查找过滤函数,格式为://delegateInfo 事件处理代理信息 //返回
true表示匹配 function(delegateInfo) { ... return true、false; }
返回值:
[ 事件处理代理信息, ... ]。
hasDataSetParam(dataSetBinds)
判断其中是否有数据集参数。
参数:
返回值:
true 有;false 无。
id()
获取图表ID。
参数:
无。
返回值:
"...",图表ID。
inflateOptions(target, source, filter)
将源选项深度合并至目标选项中,合并后,修改目标选项不会影响源选项。
此函数支持如下调用方式:
此函数支持如下调用方式:
chart.inflateOptions(target); chart.inflateOptions(target, filter); chart.inflateOptions(target, source); chart.inflateOptions(target, source, filter);
参数:
-
target
合并目标选项,格式应为:{ ... }。 -
source
可选,合并源选项,格式应为:{ ... },默认值为:chart.options()。 -
filter
可选,合并过滤器,支持格式:
true:全部合并;
false:仅合并在target中存在的属性(仅处理顶级属性);
function(name, value){ return true、false; }:自定义source过滤处理函数, 返回false将不合并source中的对应属性。
默认值为;true。
返回值:
target目标选项。
init()
参数:
无。
返回值:
无。
只有图表处于
准备初始化(默认)、或者
已销毁
状态时,此函数才允许执行。
初始化过程中,图表处于正在初始化状态;初始化完成后,图表处于完成初始化状态。
看板页面加载时,会自动调用此函数(chart.manualRender()函数为
初始化过程中,图表处于正在初始化状态;初始化完成后,图表处于完成初始化状态。
看板页面加载时,会自动调用此函数(chart.manualRender()函数为
true的除外),具体参考dashboard.init()函数。
图表生命周期
chart.init() -->-- chart.render() -->-- chart.update() -->-- chart.destroy() -->--| | | | | | | | |-----<--------| | | |--------------------------<------------------------------------| |-----------------------------------<----------------------------------------------|
在图表渲染完成后,可重复调用chart.update()函数更新图表数据。
在调用chart.destroy()函数销毁图表后,可再次调用chart.init()函数重新初始化图表、
或者调用chart.render()函数重新渲染看板。
internal(internal)
获取/设置图表底层组件。
图表底层组件是用于为渲染图表提供底层支持的组件,比如:ECharts实例(ECharts图表)、表格组件实例(表格图表)、HTML元素(标签卡)。
图表底层组件是用于为渲染图表提供底层支持的组件,比如:ECharts实例(ECharts图表)、表格组件实例(表格图表)、HTML元素(标签卡)。
参数:
-
internal
可选,要设置的底层组件。
返回值:
要获取的底层组件,没有则则是
null。
isActive()
判断图表是否处于活跃状态,即:已渲染完成且未执行销毁。
已渲染完成:chart.render()已执行完(包括异步执行);
未执行销毁:chart.destroy()未执行。
某些函数仅在图表处于活跃状态时才可正确执行(比如chart.on()函数), 通常需要在图表监听器的
已渲染完成:chart.render()已执行完(包括异步执行);
未执行销毁:chart.destroy()未执行。
某些函数仅在图表处于活跃状态时才可正确执行(比如chart.on()函数), 通常需要在图表监听器的
rendered()函数内执行它们。
参数:
无。
返回值:
true 是;false 否。
isAlive()
参数:
无。
返回值:
true 是;false 否。
isDataSetFieldSigned(dataSetBind, field, dataSign)
判断数据集字段是否设置了指定数据标记。
参数:
返回值:
true 是;false 否。
isDataSetSigned(dataSetBind, dataSign)
判断数据集是否设置了指定数据标记。
参数:
返回值:
true 是;false 否。
isInstance(chartWidgetId)
判断此图表是否由指定的图表部件ID渲染的。
参数:
-
chartWidgetId
图表部件ID,即【图表管理】模块表格中的某个图表的ID值。
返回值:
true 是;false 否。
另参考chart.widgetId()函数。
isLocal()
判断此图表是否是本地图表。
通过dashboard.createChart()、 dashboard.createCharts()、 dashboard.createUnsolvedCharts()函数创建的图表即是本地图表。
通过dashboard.createChart()、 dashboard.createCharts()、 dashboard.createUnsolvedCharts()函数创建的图表即是本地图表。
参数:
无。
返回值:
true 是;false 否。
isMutableModel(dataSetBind)
判断给定数据集是否是易变模型的。
参数:
返回值:
true 是;false 否。
易变模型数据集概念参考定义数据集-易变模型章节。
links(links)
获取/设置图表联动配置。
参数:
-
links
可选,要设置的图表联动配置对象、配置数组。
返回值:
要获取的图表联动配置数组,格式为:
[ 图表联动配置, ... ]。
图表初始化时会使用dg-chart-link的值执行设置操作。
设置操作应在chart.init()函数执行后且chart.render()函数执行前调用, 比如图表监听器的
图表渲染器实现相关: 需要图表渲染器实现其
设置操作应在chart.init()函数执行后且chart.render()函数执行前调用, 比如图表监听器的
onRender()函数中。
图表渲染器实现相关: 需要图表渲染器实现其
on()函数。
图表联动配置
{
//可选,触发联动的图表事件类型、事件类型数组,由底层图表插件定义,通常是:"click"
trigger: "..."、["...", ...],
//可选,联动目标图表元素ID、图表对象、或者它们的数组,用于在下面data中使用的目标图表数据集参数索引中引用图表
target: "..."、图表对象、[ ... ],
//可选,下述data中使用的源事件对象属性名的统一根前缀属性名,末尾不应带'.'字符
root: "...",
//可选,联动数据配置,定义源图表事件至联动目标图表数据集参数值的映射关系,没有则不设置任何参数值
data:
//名值映射表,名为源事件对象属性名(除去root部分),值为联动目标图表数据集参数索引或其数组
{
"...": ...、[ ... ],
...
}、
//映射对象数组
[
{
//必填,源事件对象属性名(除去root部分)
name: "...",
//必填,联动目标图表数据集参数索引或其数组
index: ...、[ ... ],
//可选,自定义源事件对象属性值处理函数,返回要设置的目标参数值
//sourceValue 上述name对应的源事件对象属性值
//event 源图表事件对象
value: function(sourceValue, event){ return ...; }
},
...
]
}
源事件对象属性名
源事件对象属性名和
root统一根前缀属性名可以是源图表事件对象的简单属性名,例如:"name"、"value",
也可以是属性路径,例如:"data.name"、"data.value[0]"。
图表数据集参数索引
图表数据集参数索引用于定位特定图表的数据集参数,格式为:
{
//可选,目标图表索引号、图表元素ID、图表对象,
//当是数值且上述target不为空时,表示是target数组中对应索引的图表;
//否则,表示是看板中对应标识的图表。默认为:0
chart: 数值、"..."、图表对象,
//可选,目标图表数据集数组的索引号,默认为:0
dataSet: 数值,
//可选,目标图表数据集的参数数组索引号/参数名,默认为:0
param: 数值、"..."
}
或者,可简写为其
param属性值,例如:
1 等价于 {chart:0,dataSet:0,param:1};
"name" 等价于 {chart:0,dataSet:0,param:"name"}。
listener(listener)
获取/设置图表监听器。
参数:
-
listener
可选,要设置的图表监听器。
返回值:
要获取的图表监听器,没有则是
null。
图表监听器
{
//可选,图表渲染完成回调函数,参考chart.render()函数
//chart 图表对象
rendered: function(chart){ ... },
//可选,图表更新完成回调函数,参考chart.update()函数
//chart 图表对象
//chartResult 更新的图表结果
updated: function(chart, chartResult){ ... },
//可选,图表销毁完成回调函数,参考chart.destroy()函数
//chart 图表对象
destroyed: function(chart){ ... },
//可选,图表渲染前置回调函数(chart.render()函数执行前),
//返回false、或者返回兑现值为false的Promise对象将阻止图表渲染,另参考chart.doRender()函数
//chart 图表对象
onRender: function(chart){ ... },
//可选,图表获取数据前置回调函数(发送获取图表数据请求前)
//chart 图表对象
//query 图表查询
onFetch: function(chart, query){ ... },
//可选,图表更新前置回调函数(chart.update()函数执行前),
//返回false、或者返回兑现值为false的Promise对象将阻止图表更新,另参考chart.doUpdate()函数
//chart 图表对象
//chartResult 要更新的图表结果
onUpdate: function(chart, chartResult){ ... },
//可选,图表获取数据出错处理函数,出错后不会执行onUpdate()、update()函数
//chart 图表对象
//error Error错误信息对象
fetchError: function(chart, error){ ... },
//可选,图表销毁前置回调函数(chart.destroy()函数执行前),
//返回false将阻止图表销毁,另参考chart.doDestroy()函数
//chart 图表对象
onDestroy: function(chart){ ... }
}
图表查询
liveValue(name, value)
获取/设置生命周期数据。
在图表销毁后,所有这些数据都将被清除。
在图表销毁后,所有这些数据都将被清除。
参数:
-
name
数据名。 -
value
可选,要设置的数据值。
返回值:
要获取的数据值,没有则是
null。
loadLib(lib)
加载依赖库。
系统会从环境中选择尽量兼容的依赖库加载,并不一定是传入的
此函数是一个异步函数。
系统会从环境中选择尽量兼容的依赖库加载,并不一定是传入的
lib库。
此函数是一个异步函数。
参数:
-
lib
依赖库对象或数组。
注意:其中的【库源URL】应是可直接有效加载的,另参考 chart.contextURL()、 chart.pluginResourceURL()函数。
返回值:
Promise,兑现时表示已加载完成(无论是否成功),无兑现值。
另参考图表渲染器-依赖库。
manualRender(manualRender)
获取/设置是否手动渲染图表,而不是在看板页面加载后自动渲染,手动渲染的图表只有在手动调用chart.render()函数后才会渲染。
默认获取规则:
如果图表元素为
默认获取规则:
如果图表元素为
null,返回true;
否则,根据图表元素上的dg-chart-manual-render属性值判断。
参数:
-
manualRender
可选,设置是否手动渲染,true是;false否;null恢复默认获取规则。
返回值:
要获取的是否手动渲染布尔值,
true 是;false 否。
设置操作应在chart.init()函数执行前调用。
mapURL(name)
获取指定地图名对应的可加载地图资源URL。
参数:
-
name
地图名、以'/'字符开头的地图资源URL。
返回值:
"...",可加载地图资源URL。
name(name)
获取/设置图表名称。
参数:
-
name
可选,要设置的图表名称。
返回值:
要获取的名称,格式为:
"..."。
off(type, handler)
解绑图表事件处理函数。
参数:
-
type
要解绑的事件类型,由底层图表渲染器定义,比如:"click"、"mouseover"、"mouseout"、"mousedown"、"mouseup"。 -
handler
要解绑的图表事件处理函数。
返回值:
无。
on(type, handler)
绑定图表事件处理函数。
参数:
返回值:
无。
options(options)
获取/设置图表选项,这些选项通常用于控制图表展示、交互效果。
参数:
-
options
可选,要设置的图表选项,格式为:{ ... }。
返回值:
要获取的图表选项,格式为:
{ ... }。
图表初始化时会使用
chart.optionsOrigin()函数的值(低优先级)、
dg-chart-options的值(高优先级)合并而得的新值执行设置操作。
设置操作应在chart.init()函数执行后且chart.render()函数执行前调用, 比如图表监听器的
设置操作应在chart.init()函数执行后且chart.render()函数执行前调用, 比如图表监听器的
onRender()函数中。
optionsOrigin(eval)
获取原始图表选项,它们是在定义图表-设置图表选项时设置的。
参数:
-
eval
可选,是否返回经解析后的选项对象而非字符串,默认为:false。
返回值:
"..." 当eval为false时;
{ ... } 当eval为true时;
也可能为
null。
plugin(plugin)
获取/设置图表插件。
参数:
-
plugin
可选,要设置的图表插件。
返回值:
要获取的图表插件,没有则是
null。
pluginAddition(name)
获取图表插件指定名称的附加信息。
参数:
-
name
附加信息名。
返回值:
附加信息值,没有则是
null。
pluginConfigForm()
获取图表插件的配置表单。
参数:
无。
返回值:
配置表单,没有则是
null。
pluginDataSign(identity, owner)
参数:
返回值:
数据标记,没有找到则是
null。
pluginDataSignFlat(identity, owner)
参数:
返回值:
数据标记,没有找到则是
null。
pluginDataSignSpec()
参数:
无。
返回值:
数据标记规范,没有则是
null。
pluginDataSigns(owner)
参数:
-
owner
可选,图表插件、 数据标记规范对象、 父级数据标记,默认值为: chart.plugin()。
返回值:
[ 数据标记, ... ]。
pluginResourceURL(name)
获取图表插件指定资源的可加载URL,使用此URL可从服务端加载插件资源。
参数:
-
name
插件资源名称,即chart.pluginResources()函数返回值数组其中一个元素的name属性值, 比如:icon.png、img/bg.png。
返回值:
"...",可加载的图表插件资源URL。
pluginResources()
获取图表插件的全部资源信息。
参数:
无。
返回值:
[ { name: "..." }, ... ],插件资源信息数组。
refresh()
参数:
无。
返回值:
无。
如果仅需使用上次从服务端加载的数据刷新图表,调用chart.update()函数即可。
registerEventHandlerDelegate(type, hanlder, delegate)
注册事件处理函数代理。
当底层组件的事件处理逻辑不符合图表需求时, 图表渲染器的
此函数支持如下调用方式:
当底层组件的事件处理逻辑不符合图表需求时, 图表渲染器的
on()函数的实现逻辑通常是:
先创建一个底层组件的图表事件处理函数代理(即这里的delegate参数),
在代理中调用符合实际需求的图表事件处理函数(即这里的hanlder参数)。
此函数可用于注册这些信息,使得图表渲染器在实现off()函数时,
可以获取对应底层组件的图表事件处理函数代理,进而实现底层组件的解绑逻辑,
具体参考chart.findEventHandlerDelegates()、
chart.removeEventHandlerDelegate()函数。
此函数支持如下调用方式:
chart.registerEventHandlerDelegate(delegateInfo); chart.registerEventHandlerDelegate(type, hanlder, delegate);
参数:
返回值:
事件处理代理信息,已注册的事件处理代理信息对象。
事件处理代理信息
{
//事件类型
type: ...,
//事件处理函数
hanlder: ...,
//事件处理函数代理
delegate: ...
}
removeEventHandlerDelegate(filter)
删除通过chart.registerEventHandlerDelegate()函数注册的图表事件处理代理信息。
参数:
返回值:
[ 事件处理代理信息, ... ],已删除的事件处理代理信息数组。
render()
渲染图表,内部调用chart.doRender()函数,执行无数据的初始绘制操作。
另外,如果图表还未初始化(处于准备初始化状态时), 此函数内部会先调用chart.init()函数初始化图表。
此函数是一个异步函数。
另外,如果图表还未初始化(处于准备初始化状态时), 此函数内部会先调用chart.init()函数初始化图表。
此函数是一个异步函数。
参数:
无。
返回值:
Promise,兑现时表示已渲染完成,无兑现值。
只有图表处于准备初始化(默认)、
或者完成初始化、
或者准备渲染、
或者已销毁
状态时,此函数才允许执行。
渲染过程中,图表处于正在渲染状态; 渲染完成后(可能是异步渲染),图表处于渲染完成状态。
看板页面加载时,会自动调用此函数(chart.manualRender()函数为
渲染过程中,图表处于正在渲染状态; 渲染完成后(可能是异步渲染),图表处于渲染完成状态。
看板页面加载时,会自动调用此函数(chart.manualRender()函数为
true的除外),
具体参考dashboard.render()函数。
另参考图表生命周期。
renderContext()
获取渲染上下文。
参数:
无。
返回值:
渲染上下文,与dashboard.renderContext()返回值相同。
renderContextValue(name, value)
获取/设置渲染上下文中指定名称的值。
参数:
-
name
名称。 -
value
可选,要设置的值。
返回值:
要获取的值,没有则是
null。
renderer(renderer)
获取/设置自定义图表渲染器,
自定义图表渲染器可以重写图表插件的内置的图表渲染器逻辑。
参数:
-
renderer
可选,要设置的自定义图表渲染器。
返回值:
要获取的自定义图表渲染器,没有则是
null。
图表初始化时会使用dg-chart-renderer的值执行设置操作。
设置操作应在chart.init()函数执行后且chart.render()函数执行前调用, 比如图表监听器的
设置操作应在chart.init()函数执行后且chart.render()函数执行前调用, 比如图表监听器的
onRender()函数中。
rendererAddition(name)
参数:
-
name
附加信息名。
返回值:
附加信息值,没有则是
null。
resize()
重新调整图表尺寸,与图表所在元素尺寸保持一致。
参数:
无。
返回值:
无。
resultAddition(dataSetResult, name, value)
获取/设置数据集结果的附加信息。
参数:
-
dataSetResult
数据集结果。 -
name
附加信息名。 -
value
可选,要设置的附加信息值。
返回值:
附加信息值,没有则是
null。
resultColumnArrayDatas(dataSetResult, fields, row, count)
获取数据集结果数据的列值数组数据。
参数:
返回值:
当
当
fields是数组时,返回二维数组:[ [ ..., ... ], ...],
其第一维元素索引与fields一一对应,第二维元素索引即是行号;
当
fields不是数组时,返回一维列值数组:[ ..., ... ],其元素索引即是行号。
resultData(dataSetResult, data)
获取/设置数据集结果的数据。
如果只是要获取数据,建议使用更安全的chart.resultDatas()函数。
如果只是要获取数据,建议使用更安全的chart.resultDatas()函数。
参数:
-
dataSetResult
数据集结果。 -
data
可选,要设置的数据,通常是:{ ... }、[ { ... }, ... ]。
返回值:
要获取的数据,没有则是
null。
resultDataFormat(format)
获取/设置图表结果数据格式。
设置了新的数据格式后,后续图表刷新将采用这个新格式。
设置了新的数据格式后,后续图表刷新将采用这个新格式。
参数:
-
format
可选,要设置的结果数据格式。
返回值:
要获取的结果数据格式,没有则返回
null。
图表结果数据格式
{
//可选,日期类型:"string" 字符串;"number" 毫秒数值
dateType: "string",
//可选,当dateType为"string"时的日期格式
dateFormat: "yyyy-MM-dd",
//可选,时间类型:"string" 字符串;"number" 毫秒数值
timeType: "string",
//可选,当timeType为"string"时的日期格式
timeFormat: "HH:mm:ss",
//可选,日期时间类型:"string" 字符串;"number" 毫秒数值
timestampType: "string",
//可选,当timestampType为"string"时的日期格式
timestampFormat: "yyyy-MM-dd HH:mm:ss"
}
其中,日期格式符号说明如下表所示:
| 符号 | 描述 |
|---|---|
| yyyy | 年份(4位长度) |
| MM | 月份(2位长度,01-12) |
| dd | 天(2位长度,01-31) |
| HH | 小时(2位长度24时制,00-23) |
| mm | 分钟(2位长度,00-59) |
| ss | 秒数(2位长度,00-59) |
示例:
yyyy年MM月dd日、HH时mm分ss秒、yyyy年MM月dd日HH时mm分ss秒、
yyyy/MM/dd、HH:mm:ss。
resultDataOf(chartResult, dataSetBind, data)
参数:
返回值:
要获取的数据集结果数据,没有则是
null。
resultDataRow(dataSetResult, row)
参数:
-
dataSetResult
数据集结果、[ { ... }, ... ]数据对象数组。 -
row
行号、行号数组。
返回值:
与
row对应的行数据、行数据数组。
resultDataRowCell(rowObj, field, value)
获取/设置数据集结果数据的某行对象的指定字段值。
参数:
返回值:
要获取的字段值,没有则是
null。
resultDatas(dataSetResult)
获取数据集结果数据的数组形式,
如果原始数据是数组,直接返回;如果不是数组,则将其添加至新建的数组并返回。
参数:
-
dataSetResult
数据集结果。
返回值:
[ ... ],不会为null。
resultDatasOf(chartResult, dataSetBind)
参数:
返回值:
[ ... ],不会为null。
resultIgnoreFetch(dataSetResult, ignoreFetch)
获取/设置数据集结果是否是忽略结果的。
参数:
-
dataSetResult
数据集结果。 -
ignoreFetch
可选,设置是否忽略结果,true是;false否。
返回值:
要获取的是否忽略结果布尔值,
true 是;false 否。
设置操作应在chart.update()函数执行前调用,
比如图表监听器的
图表渲染器实现相关: 图表渲染器在其
onUpdate()函数中。
图表渲染器实现相关: 图表渲染器在其
update()函数中,
不应使用忽略结果的数据集结果绘制图表,
另参考chart.dataSetBindsFetched()函数。
resultIgnoreFetchOf(chartResult, dataSetBind, ignoreFetch)
参数:
返回值:
要获取的是否忽略结果布尔值,
true 是;false 否。
设置操作应在chart.update()函数执行前调用,
比如图表监听器的
图表渲染器实现相关: 图表渲染器在其
onUpdate()函数中。
图表渲染器实现相关: 图表渲染器在其
update()函数中,
不应使用忽略结果的数据集结果绘制图表,
另参考chart.dataSetBindsFetched()函数。
resultMapDatas(dataSetResult, fieldMap, row, count)
获取数据集结果数据经字段映射后的数据。
参数:
返回值:
经字段映射后的新对象数组。
resultNameValueDatas(dataSetResult, nameField, valueField, row, count)
获取数据集结果数据的名/值映射数据。
参数:
返回值:
当
当
valueField是数组时,返回格式为:
[ { name: "...", value: [ ..., ... ] } ];
当
valueField不是数组时,返回格式为:
[ { name: "...", value: ... } ]。
resultOf(chartResult, dataSetBind, dataSetResult)
参数:
返回值:
要获取的数据集结果,没有则是
null。
resultRowArrayDatas(dataSetResult, fields, row, count)
获取数据集结果数据的行值数组数据。
参数:
返回值:
当
当
fields是数组时,返回二维数组:[ [ ..., ... ], ...],
第一维元素索引表示行号,第二维元素索引则与fields一一对应;
当
fields不是数组时,返回一维行值数组:[ ..., ... ]。
results(chartResult, dataSetResults)
参数:
返回值:
要获取的数据集结果数组,没有则是
null。
sortDataSetFields(dataSetBind, fields)
按照通过chart.dataSetFieldOrder()函数设置的排序值,排序数据集字段数组,并返回一个新的排序好的数组。
参数:
返回值:
[ 数据集字段, ... ],已排序的数组。
status(value)
获取/设置图表状态。
对于设置操作,此函数仅会设置状态值,不会执行任何其他状态后置逻辑,因此,应优先使用具体的
对于设置操作,此函数仅会设置状态值,不会执行任何其他状态后置逻辑,因此,应优先使用具体的
chart.status*(true)状态设置函数。
参数:
-
value
可选,要设置的图表状态值字符串。
返回值:
要获取的图表状态值字符串。
谨慎设置图表状态,因为可能会影响图表内部逻辑。
statusDestroyed(set, postProcess)
获取/设置图表是否处于状态:已销毁。
参数:
-
set
可选,仅为true时执行设置操作。 -
postProcess
可选,当set为true时,是否执行销毁后置处理逻辑,true执行,false不执行,默认值为:true。
后置处理逻辑包括:调用图表监听器的destroyed()函数等。
返回值:
要获取的值,
true 是;false 否。
谨慎设置图表状态,因为可能会影响图表内部逻辑。
statusDestroying(set)
获取/设置图表是否处于状态:正在销毁。
参数:
-
set
可选,仅为true时执行设置操作。
返回值:
要获取的值,
true 是;false 否
chart.destroy()函数内部会设置此状态。
谨慎设置图表状态,因为可能会影响图表内部逻辑。
谨慎设置图表状态,因为可能会影响图表内部逻辑。
statusInited(set)
获取/设置图表是否处于状态:完成初始化。
参数:
-
set
可选,仅为true时执行设置操作。
返回值:
要获取的值,
true 是;false 否。
谨慎设置图表状态,因为可能会影响图表内部逻辑。
statusIniting(set)
获取/设置图表是否处于状态:正在初始化。
参数:
-
set
可选,仅为true时执行设置操作。
返回值:
要获取的值,
true 是;false 否。
chart.init()函数内部会设置此状态。
谨慎设置图表状态,因为可能会影响图表内部逻辑。
谨慎设置图表状态,因为可能会影响图表内部逻辑。
statusPreInit(set)
获取/设置图表是否处于状态:准备初始化。
参数:
-
set
可选,仅为true时执行设置操作。
返回值:
要获取的值,
true 是;false 否。
谨慎设置图表状态,因为可能会影响图表内部逻辑。
statusPreRender(set)
获取/设置图表是否处于状态:准备渲染。
参数:
-
set
可选,仅为true时执行设置操作。
返回值:
要获取的值,
true 是;false 否。
谨慎设置图表状态,因为可能会影响图表内部逻辑。
statusPreUpdate(set)
获取/设置图表是否处于状态:准备更新。
参数:
-
set
可选,仅为true时执行设置操作。
返回值:
要获取的值,
true 是;false 否
谨慎设置图表状态,因为可能会影响图表内部逻辑。
statusRendered(set, postProcess)
获取/设置图表是否处于状态:渲染完成。
参数:
-
set
可选,仅为true时执行设置操作。 -
postProcess
可选,当set为true时,是否执行渲染完成后置处理逻辑,true执行,false不执行,默认值为:true。
后置处理逻辑包括:渲染交互设置表单、绑定事件处理函数、调用图表监听器的rendered()函数等。
返回值:
要获取的值,
true 是;false 否。
谨慎设置图表状态,因为可能会影响图表内部逻辑。
statusRendering(set)
获取/设置图表是否处于状态:正在渲染。
参数:
-
set
可选,仅为true时执行设置操作。
返回值:
要获取的值,
true 是;false 否。
chart.render()函数内部会设置此状态。
谨慎设置图表状态,因为可能会影响图表内部逻辑。
谨慎设置图表状态,因为可能会影响图表内部逻辑。
statusUpdated(set, postProcess)
获取/设置图表是否处于状态:更新完成。
参数:
-
set
可选,仅为true时执行设置操作。 -
postProcess
可选,当set为true时,是否执行更新完成后置处理逻辑,true执行,false不执行,默认为true。
后置处理逻辑包括:调用图表监听器的updated()函数等。
返回值:
要获取的值,
true 是;false 否。
谨慎设置图表状态,因为可能会影响图表内部逻辑。
statusUpdating(set)
获取/设置图表是否处于状态:正在更新。
参数:
-
set
可选,仅为true时执行设置操作。
返回值:
要获取的值,
true 是;false 否。
chart.update()函数内部会设置此状态。
谨慎设置图表状态,因为可能会影响图表内部逻辑。
谨慎设置图表状态,因为可能会影响图表内部逻辑。
theme(theme)
获取/设置图表主题。
参数:
-
theme
可选,要设置的图表主题。
返回值:
要获取的图表主题,不会为
null。
图表初始化时会使用dg-chart-theme的值执行设置操作。
设置操作应在chart.init()函数执行后且chart.render()函数执行前调用, 比如图表监听器的
图表渲染器实现相关: 图表渲染器应使用此函数获取并应用图表主题, 另参考chart.themeGradualColor()、 chart.themeStyleName()、 chart.themeStyleSheet()函数。
设置操作应在chart.init()函数执行后且chart.render()函数执行前调用, 比如图表监听器的
onRender()函数中。
图表渲染器实现相关: 图表渲染器应使用此函数获取并应用图表主题, 另参考chart.themeGradualColor()、 chart.themeStyleName()、 chart.themeStyleSheet()函数。
图表主题
{
//可选,文本颜色
color: "..",
//可选,背景颜色
backgroundColor:"..",
//可选,实际背景色,当backgroundColor值为"transparent"时,用于设置实际页面背景色
actualBackgroundColor: "...",
//可选,字体尺寸像素数
fontSize: 数值,
//可选,图形条目颜色
graphColors: ["...", "...", "..."],
//可选,值域映射图形条目颜色,即数值到颜色的映射范围
graphRangeColors: ["...", "..."]
}
themeGradualColor(factor)
参数:
-
factor
渐变因子数值, 对于0-1之间的小数,0表示最接近实际背景色(actualBackgroundColor)的颜色,1表示最接近文本色(color)的颜色; 小于0则表示获取实际背景色(actualBackgroundColor);大于1则表示获取文本色(color)。
返回值:
"...",颜色字符串,格式类似:"#FFFFFF"。
图表渲染器在绘制图表时,可以使用此函数获取的颜色来设置图表配色。
themeStyleName()
获取此图表主题对应的样式类名,这个样式类名是全局唯一的,可添加至HTML元素的
图表在渲染前会自动在chart.element()图表元素的
class属性。
图表在渲染前会自动在chart.element()图表元素的
class属性中添加此样式类名,
使得通过chart.themeStyleSheet(name, css)函数创建的样式表可自动应用于图表元素。
参数:
无。
返回值:
"...",样式类名,不会为null。
themeStyleSheet(name, css, force)
判断/设置此图表主题关联指定名称的CSS样式表。
对于设置操作,最终生成的CSS样式表都会添加chart.themeStyleName()函数返回的样式类名选择器前缀, 确保样式表只会应用于添加了chart.themeStyleName()样式类名的HTML元素。
相同名称的CSS样式表,通常仅需创建一次,因此,当图表渲染器需要为图表内的某个HTML元素应用与主题相关的CSS样式表时, 通常使用方式如下:
对于设置操作,最终生成的CSS样式表都会添加chart.themeStyleName()函数返回的样式类名选择器前缀, 确保样式表只会应用于添加了chart.themeStyleName()样式类名的HTML元素。
相同名称的CSS样式表,通常仅需创建一次,因此,当图表渲染器需要为图表内的某个HTML元素应用与主题相关的CSS样式表时, 通常使用方式如下:
chart.themeStyleSheet("myName", function()
{
return ...;
});
或者
if(!chart.themeStyleSheet("myName"))
chart.themeStyleSheet("myName", css);
另外,图表渲染器在其destroy()函数内部,
无需销毁使用此函数创建的CSS样式表,必要时它们会被自动销毁。
参数:
返回值:
CSS样式
{
//CSS选择器,示例:" .success"、".success"、[ ".success", " .error" ]
//注意:前面加空格表示子元素、不加则表示元素本身
name: "..."、["...", ...],
//CSS属性字符串,示例:"color:red; background-color:blue;"
value: "..."
}
unreadyDataSetParams(stopOnFirst, checkIgnoreFetch)
获取此图表中未准备好的数据集参数信息(必填但参数值为
此函数支持如下调用方式:
null的)。
此函数支持如下调用方式:
chart.unreadyDataSetParams(); chart.unreadyDataSetParams(stopOnFirst); chart.unreadyDataSetParams(stopOnFirst, checkIgnoreFetch);
参数:
-
stopOnFirst
可选,是否在找到第一个后就返回,默认值为:false。 -
checkIgnoreFetch
可选,是否校验已忽略结果的数据集,默认值为:false。
返回值:
update(chartResult)
更新图表,内部调用chart.doUpdate()函数,执行有数据的更新绘制操作。
此函数是一个异步函数。
此函数是一个异步函数。
参数:
返回值:
Promise,兑现时表示已更新完成,无兑现值。
只有图表处于渲染完成、
或者准备更新、
或者更新完成状态时,此函数才允许执行。
更新过程中,图表处于正在更新状态; 更新完成后(可能是异步更新),图表处于更新完成状态;
此函数通常无需主动调用,看板页面加载后,会在必要时自动调用此函数(比如调用了chart.render()、chart.refresh()函数后), 具体参考dashboard.startHandleCharts()函数。
更新过程中,图表处于正在更新状态; 更新完成后(可能是异步更新),图表处于更新完成状态;
此函数通常无需主动调用,看板页面加载后,会在必要时自动调用此函数(比如调用了chart.render()、chart.refresh()函数后), 具体参考dashboard.startHandleCharts()函数。
另参考图表生命周期。
图表结果
数据集结果
{
//数据,格式允许:数据对象数组、数据对象、null,
//其中,数据对象的属性名应是对应的数据集字段名(其name值)
data: ...,
//是否是忽略结果的,忽略结果的不应用于绘制图表,其data通常为null
ignoreFetch: false、true,
//附加信息
additions: { "...": ..., ... }、null
}
updateAppendMode(appendMode)
获取/设置更新追加模式。
更新追加模式是指:每次调用chart.update()更新图表时, 使用上次更新结果追加合并新数据后再更新图表。
对于定时刷新图表,当希望保留使用部分旧数据更新图表时,可以开启更新追加模式。
更新追加模式是指:每次调用chart.update()更新图表时, 使用上次更新结果追加合并新数据后再更新图表。
对于定时刷新图表,当希望保留使用部分旧数据更新图表时,可以开启更新追加模式。
参数:
-
appendMode
可选,要设置的追加模式,支持格式:
true:最多保留10条数据,同{ size: 10, beforeListener: false };
数值:最多保留数值条数据,同{ size: 数值, beforeListener: false };
函数:多保留函数返回数值条数据,同{ size: 函数, beforeListener: false };
null:禁用追加模式;
{ ... }:详细设置,格式为:{ //追加后保留的最多数据数目(新数据优先保留),格式支持: //数值:保留数目; //函数:保留数目回调函数:。function(chart, chartResult){ return 数值; }, //其中的chartResult参数是新的要更新的图表结果 size: 数值、函数, //是否在图表监听器的onUpdate()函数前追加,否则,将在之后追加 beforeListener: false、true }
返回值:
要获取的更新追加模式,格式为:
{
size: 数值、函数,
beforeListener: false、true
}
,
null表示没有开启追加模式。
图表初始化时会使用chart.options()中的
设置操作应在chart.update()函数执行前调用, 比如图表监听器的
updateAppendMode选项值执行设置操作,另参考通用图表选项章节。
设置操作应在chart.update()函数执行前调用, 比如图表监听器的
onRender()、rendered()函数中。
updateInterval(interval)
获取/设置图表定时刷新间隔。
设置后,图表将即刻进入定时刷新状态,具体参考dashboard.startHandleCharts()函数。
设置后,图表将即刻进入定时刷新状态,具体参考dashboard.startHandleCharts()函数。
参数:
-
interval
可选,要设置的定时刷新间隔毫秒数,-1表示禁用定时刷新。
返回值:
要获取的定时刷新间隔毫秒数,
-1表示禁用。
updateResult(chartResult)
获取/设置此次更新的图表结果。
在chart.doUpdate()函数内部,会先调用此函数设置图表结果, 使得后续图表监听器的
在chart.doUpdate()函数内部,会先调用此函数设置图表结果, 使得后续图表监听器的
onUpdate()、
图表渲染器的update()函数中可以使用此函数获取此次更新结果。
参数:
-
chartResult
可选,要设置的图表结果。
返回值:
要获取的图表结果,没有则是
null。
widgetId()
获取实际渲染此图表的图表部件ID。
正常来说,此函数的返回值与期望渲染的图表部件ID相同(通常是chart.elementWidgetId()函数的返回值), 当不同时,表明服务端因加载图表异常(未找到或出现错误)而使用了一个备用图表,用于在页面展示异常信息。
正常来说,此函数的返回值与期望渲染的图表部件ID相同(通常是chart.elementWidgetId()函数的返回值), 当不同时,表明服务端因加载图表异常(未找到或出现错误)而使用了一个备用图表,用于在页面展示异常信息。
参数:
无。
返回值:
"...",图表部件ID,没有则是null。