Global - Documentation

Members

__importDefault

Source:

chartHelper.js, line 19

Datart Copyright 2021 Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0 Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.

Methods

compareSelectedItems(newSelectedItems, oldSelectedItemsopt) → {boolean}

Source:

chartHelper.js, line 1409

Comparing old and new selectedItems

Parameters:

Name	Type	Attributes	Description
`newSelectedItems`	Array.<SelectedItem>
`oldSelectedItems`	Array.<SelectedItem>	<optional>

Returns:

Type: boolean

getColumnRenderName(fieldopt) → {string}

Source:

chartHelper.js, line 836

[中文] 获取字段的图表显示名称
[EN] Get data field render name by alias, colName and aggregate

Parameters:

Name	Type	Attributes	Description
`field`	ChartDataSectionField	<optional>

Returns:

Type: string

getDataColumnMaxAndMin(dataset, configopt) → {*}

Source:

chartHelper.js, line 866

Deprecated:

to be remove in next release

Parameters:

Name	Type	Attributes	Description
`dataset`
`config`	ChartDataSectionField	<optional>

Returns:

Type: *

getDefaultThemeColor() → {Array.<string>}

Source:

chartHelper.js, line 205

[中文] 获取系统默认颜色
[EN] Gets an array of default colors

Example

const colorList = getDefaultThemeColor();
console.log(colorList); // ["#298ffe","#dae9ff","#fe705a","#ffdcdc","#751adb","#8663d7","#15AD31","#FAD414","#E62412"]

Returns:

default color array

Type: Array.<string>

getDrillableRows(configs, option) → {*}

Source:

chartHelper.js, line 1276

Get Fields when data section is drillable

Parameters:

Name	Type	Description
`configs`	Array.<ChartDataConfig>
`option`	ChartDrillOption

Returns:

{ChartDataSectionField[]}

Type: *

getGridStyleWithLegend(styles, legend, chartSizeopt) → {GridStyle}

Source:

chartHelper.js, line 1041

[中文] 获取绘图区网格样式，并根据图例位置与尺寸自动预留空间，避免图例与图表主区重叠
[EN] Get grid style and reserve space for the legend automatically to avoid overlapping between legend and chart main area

Parameters:

Name	Type	Attributes	Description
`styles`	Array.<ChartStyleConfig>		required
`legend`	LegendStyle		required the final legend style of the chart
`chartSize`	Object	<optional>	optional { width, height } from echarts instance, used to resolve percentage margins for comparison

Returns:

Type: GridStyle

getLegendEstimatedHeight()

Source:

chartHelper.js, line 989

[中文] 估算图例实际渲染高度（像素）
[EN] Estimate the rendered height (px) of the legend

getLegendEstimatedWidth()

Source:

chartHelper.js, line 1018

[中文] 估算图例单项的最大渲染宽度（像素），系列名未设置别名时会带上聚合函数前缀（如 SUM(xxx)），按渲染的完整名称测量
[EN] Estimate the max rendered width (px) of a legend item. The full rendered series name is measured, including the aggregate prefix (e.g. SUM(xxx)) when the field has no alias

getLegendOrientAndPositions(legendPos, optionsopt)

Source:

chartHelper.js, line 303

[中文] 将图例位置配置转换为 ECharts 图例的排列方向与定位样式
[EN] Convert legend position option to ECharts legend orient and positions

Parameters:

Name Type Attributes Description

options

Object

optional

Properties

Name	Type	Attributes	Description
`top`	number	<optional>	optional pin the legend to a fixed top offset instead of center anchoring (used by charts that compute the offset dynamically, e.g. funnel)

Returns:

getMarkArea(settingConfigs, dataColumns, dataConfig, isHorizonDisplay) → {*}

Source:

chartHelper.js, line 677

Deprecated:

to be remove in next release

Parameters:

Name	Type	Description
`settingConfigs`	*
`dataColumns`	*
`dataConfig`	*
`isHorizonDisplay`	*

Returns:

Type: *

getMarkAreaData(settingConfigs, dataColumns, dataConfig, isHorizonDisplay) → {*}

Source:

chartHelper.js, line 618

Deprecated:

to be remove in next release

Parameters:

Name	Type	Description
`settingConfigs`	*
`dataColumns`	*
`dataConfig`	*
`isHorizonDisplay`	*

Returns:

Type: *

getMarkLine(settingConfigs, dataColumns, dataConfig, isHorizonDisplay) → {*}

Source:

chartHelper.js, line 425

Deprecated:

to be remove in next release

Parameters:

Name	Type	Description
`settingConfigs`	*
`dataColumns`	*
`dataConfig`	*
`isHorizonDisplay`	*

Returns:

Type: *

getMarkLineData(settingConfigs, dataColumns, dataConfig, isHorizonDisplay) → {*}

Source:

chartHelper.js, line 450

Deprecated:

to be remove in next release

Parameters:

Name	Type	Description
`settingConfigs`	*
`dataColumns`	*
`dataConfig`	*
`isHorizonDisplay`	*

Returns:

Type: *

getMinAndMaxNumber(configs, chartDatasetopt)

Source:

chartHelper.js, line 1456

Get min and max number.

Parameters:

Name	Type	Attributes	Description
`configs`	Array.<ChartDataSectionField>
`chartDataset`	IChartDataSet.<string>	<optional>

Returns:

getReference(settingConfigs, dataColumns, dataConfig, isHorizonDisplay) → {*}

Source:

chartHelper.js, line 399

Deprecated:

to be remove in next release

Parameters:

Name	Type	Description
`settingConfigs`	*
`dataColumns`	*
`dataConfig`	*
`isHorizonDisplay`	*

Returns:

Type: *

getRuntimeComputedFields()

Source:

chartHelper.js, line 1307

Merging runtime date level into computed fields

getSelectedItemStyles(comIndex, dcIndex, selectionList)

Source:

chartHelper.js, line 1390

Get common selected styles

Parameters:

Name	Type	Description
`comIndex`	string \| number
`dcIndex`	string \| number
`selectionList`	Array.<SelectedItem>

Returns:

getSettingValue(configs, path, targetKey) → {*}

Source:

chartHelper.js, line 235

Deprecated:

This function will be removed in next version, please use @see getStyles instread

[中文] 使用路径语法获取配置信息，此方法已过时，请参考方法getStyles
[EN] Get setting config info by value path, please use getStyles instead

Parameters:

Name	Type	Description
`configs`	Array.<ChartStyleConfig>
`path`	string
`targetKey`	string

Returns:

Type: *

getStyles(configs, parentKeyPaths, childTargetKeys) → {*}

Source:

chartHelper.js, line 281

[中文] 通过数组路径语法，获取对应的配置的值集合
[EN] Get config style values

Example

const styleConfigs = [
      {
       key: 'label',
       rows: [
          { key: 'color', value: 'red' },
          { key: 'font', value: 'sans-serif' },
        ],
      },
    ];
const [color, font] = getStyles(styleConfigs, ['label'], ['color', 'font']);
console.log(color); // red
console.log(font); // sans-serif

Parameters:

Name	Type	Description
`configs`	Array.<ChartStyleConfig>	required
`parentKeyPaths`	Array.<string>	required
`childTargetKeys`	Array.<string>	required

Returns:

array of child keys with the same order

Type: *

getStyleValue(styleConfigs, paths) → {*}

Source:

chartHelper.js, line 219

Deprecated:

This function will be removed in next version, please use @see getStyles instread

[中文] 使用路径语法获取配置信息，此方法已过时，请参考方法getStyles
[EN] Get config info by value path, please use getStyles instead

Parameters:

Name	Type	Description
`styleConfigs`	Array.<ChartStyleConfig>
`paths`	Array.<string>

Returns:

{*}

Type: *

getStyleValueByGroup(styles, groupPath, childPath) → {*}

Source:

chartHelper.js, line 251

Deprecated:

This function will be removed in next version, please use @see getStyles instead

[中文] 使用路径语法获取配置信息，此方法已过时，请参考方法getStyles
[EN] Get setting config info by value path, please use getStyles instead

Parameters:

Name	Type	Description
`styles`	Array.<ChartStyleConfig>
`groupPath`	string
`childPath`	string

Returns:

Type: *

getValue(configs, keyPaths, targetKeyopt) → {*}

Source:

chartHelper.js, line 374

[中文] 通过数组路径语法，获取对应的配置信息
[EN] Get style config value base function with default target key

Example

const styleConfigs = [
      {
       key: 'label',
       rows: [
          { key: 'color', value: 'red' },
          { key: 'font', value: 'sans-serif' },
        ],
      },
    ];
const colorValue = getValue(styleConfigs, ['label', 'color']);
console.log(colorValue); // red

Parameters:

Name	Type	Attributes	Default
`configs`	Array.<ChartStyleConfig>
`keyPaths`	Array.<string>
`targetKey`	string	<optional>	`'value'`

Returns:

Type: *

isMatchRequirement(meta, config) → {boolean}

Source:

chartHelper.js, line 1153

[中文] 是否满足当前meta中标识的限制要求，以满足图表绘制
[EN] Check if current config with required fields match the chart basic requirement of meta info.

Example

const meta = {
     requirements: [
       {
         group: [1, 999],
         aggregate: [1, 999],
       },
     ],
   };
   const config = {
    datas: [
       {
        type: 'group',
         required: true,
         rows: [
           {
             colName: 'category',
           },
         ],
       },
       {
         type: 'aggregate',
         required: true,
         rows: [
           {
             colName: 'amount',
           },
         ],
       },
     ],
   };
 const isMatch = isMatchRequirement(meta, config);
 console.log(isMatch); // true;

Parameters:

Name	Type	Description
`meta`	ChartMetadata
`config`	ChartConfig

Returns:

Type: boolean

round(x, precisionopt) → {number}

Source:

chartHelper.js, line 1440

Get precision number.

Parameters:

Name	Type	Attributes	Description
`x`	number \| string
`precision`	number	<optional>

Returns:

Type: number

toFormattedValue(valueopt, formatopt) → {*}

Source:

chartHelper.js, line 58

[中文] 获取格式聚合数据
[EN] Gets format aggregate data

Example

const format = {
  percentage: {
    decimalPlaces: 2,
  },
  type: "percentage",
}
const formattedData = toFormattedValue('1', format);
console.log(formattedData); // '100.00%';

Parameters:

Name	Type	Attributes	Description
`value`	number \| string	<optional>
`format`	FormatFieldAction	<optional>

Returns:

Type: *

transformToDataSet(datasopt, metasopt, dataConfigsopt) → {*}

Source:

chartHelper.js, line 765

[中文] 将服务端返回数据转换为ChartDataSet模型
[EN] Create ChartDataSet Model with sorted values

Parameters:

Name	Type	Attributes
`datas`	Array.<Array.<T>>	<optional>
`metas`	Array.<ChartDatasetMeta>	<optional>
`dataConfigs`	Array.<ChartDataConfig>	<optional>

Returns:

{IChartDataSet}

Type: *

transformToObjectArray(columnsopt, metasopt) → {*}

Source:

chartHelper.js, line 797

Deprecated:

should use DataSet model, @see transformToDataSet

Support: 1. Case Insensitive to get value 2. More util helper

Example

const columns = [
     ['r1-c1-v', 'r1-c2-v'],
     ['r2-c1-v', 'r2-c2-v'],
   ];
const metas = [{ name: 'name' }, { name: 'age' }];
const datas = transformToObjectArray(columns, metas);
console.log(datas); // [{"name":"r1-c1-v","age":"r1-c2-v2"},{"name":"r2-c1-v","age":"r2-c2-v"}]

Parameters:

Name	Type	Attributes	Description
`columns`	Array.<Array.<string>>	<optional>
`metas`	Array.<ChartDatasetMeta>	<optional>

Returns:

Type: *

valueFormatter(configopt, valueopt) → {string}

Source:

chartHelper.js, line 954

[中文] 获取字段的Tooltip显示名称和内容
[EN] Get chart render string with field name and value

Example

const config = {
  aggregate: "SUM"
  colName: 'name',
  type: 'STRING',
  category: 'field',
  uid: '123456',
}
const formatValue = valueFormatter(config, '示例')；
console.log(formatValue) // SUM(name): 示例

Parameters:

Name	Type	Attributes	Description
`config`	ChartDataSectionField	<optional>
`value`	number	<optional>

Returns:

Type: string