forked from opentiny/tiny-vue
feat: update charts demos
Match-id-6b779a341cbac05c76e1876a8612a5a998f6b38c
This commit is contained in:
parent
451d48a83f
commit
539ff30b4e
|
@ -62,6 +62,11 @@ packages/theme/src/theme/*-theme/component.js
|
|||
pnpm-lock.yaml
|
||||
gulp/bundle.json
|
||||
|
||||
# 屏蔽测试用例报告相关文件
|
||||
allure-report
|
||||
allure-results
|
||||
test-results
|
||||
|
||||
# 本地构建的saas相关资源文件
|
||||
examples/sites/public/tiny-vue*.js
|
||||
examples/sites/public/tiny-vue*.mjs
|
||||
|
|
|
@ -1,7 +1,6 @@
|
|||
{
|
||||
"recommendations": [
|
||||
"vue.volar",
|
||||
"vue.vscode-typescript-vue-plugin",
|
||||
"bradlc.vscode-tailwindcss",
|
||||
"davidanson.vscode-markdownlint",
|
||||
"dbaeumer.vscode-eslint",
|
||||
|
|
|
@ -18,9 +18,9 @@
|
|||
"sortablejs": "1.15.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@playwright/test": "^1.40.1"
|
||||
"@playwright/test": "~1.42.0"
|
||||
},
|
||||
"files": [
|
||||
"resources"
|
||||
]
|
||||
}
|
||||
}
|
|
@ -8,7 +8,7 @@ export default {
|
|||
{
|
||||
name: 'arrow',
|
||||
type: 'string',
|
||||
defaultValue: "该属性的默认值为 'hover'",
|
||||
defaultValue: "'hover'",
|
||||
desc: {
|
||||
'zh-CN': '切换箭头的显示效果,该属性的可选值为 always / hover / never',
|
||||
'en-US': 'Switch the display effect of arrows,The optional values for this attribute are always/hover/never'
|
||||
|
@ -31,7 +31,7 @@ export default {
|
|||
{
|
||||
name: 'autoplay',
|
||||
type: 'boolean',
|
||||
defaultValue: '该属性的默认值为 false',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否自动切换',
|
||||
'en-US': 'Whether to automatically switch'
|
||||
|
@ -57,7 +57,7 @@ export default {
|
|||
type: 'string',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '指示器的位置。该属性的可选值为 outside / none',
|
||||
'zh-CN': '指示器的位置,该属性的可选值为 outside / none',
|
||||
'en-US': 'The position of the indicator. The optional values for this attribute are outside/none'
|
||||
},
|
||||
mode: ['pc', 'mobile-first'],
|
||||
|
@ -67,10 +67,10 @@ export default {
|
|||
{
|
||||
name: 'indicator-style',
|
||||
type: 'String',
|
||||
defaultValue: '该属性的可选值为 light/dark ,默认为light。',
|
||||
defaultValue: "'light'",
|
||||
desc: {
|
||||
'zh-CN': '指示器的样式。',
|
||||
'en-US': 'The style of the indicator.'
|
||||
'zh-CN': '指示器的样式,该属性的可选值为 light/dark',
|
||||
'en-US': 'The style of the indicator, The optional values for this attribute are light/mark.'
|
||||
},
|
||||
mode: ['mobile-first'],
|
||||
mfDemo: 'indicator-style'
|
||||
|
@ -78,7 +78,7 @@ export default {
|
|||
{
|
||||
name: 'initial-index',
|
||||
type: 'number',
|
||||
defaultValue: '该属性的默认值为 0',
|
||||
defaultValue: '0',
|
||||
desc: {
|
||||
'zh-CN': '初始状态激活的幻灯片的索引,从 0 开始',
|
||||
'en-US': 'Index of slides activated in initial state, starting from 0'
|
||||
|
@ -90,7 +90,7 @@ export default {
|
|||
{
|
||||
name: 'interval',
|
||||
type: 'number',
|
||||
defaultValue: '该属性的默认值为 3000',
|
||||
defaultValue: '3000',
|
||||
desc: {
|
||||
'zh-CN': '自动切换的时间间隔,单位为毫秒',
|
||||
'en-US': 'The time interval for automatic switching, in milliseconds'
|
||||
|
@ -102,7 +102,7 @@ export default {
|
|||
{
|
||||
name: 'loop',
|
||||
type: 'boolean',
|
||||
defaultValue: '该属性的默认值为 true',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否循环显示',
|
||||
'en-US': 'Whether to display in a loop'
|
||||
|
@ -114,7 +114,7 @@ export default {
|
|||
{
|
||||
name: 'show-title',
|
||||
type: 'boolean',
|
||||
defaultValue: '该属性的默认值为 false',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否显示标题',
|
||||
'en-US': 'Is the title displayed'
|
||||
|
@ -126,11 +126,10 @@ export default {
|
|||
{
|
||||
name: 'trigger',
|
||||
type: 'string',
|
||||
defaultValue: "该属性的默认值为 'hover'",
|
||||
defaultValue: "'hover'",
|
||||
desc: {
|
||||
'zh-CN': '指示器的触发方式,默认为 hover。该属性的可选值为 click',
|
||||
'en-US':
|
||||
'The triggering method of the indicator is hover by default. The optional value for this attribute is click'
|
||||
'zh-CN': '指示器的触发方式,该属性的可选值为 hover / click',
|
||||
'en-US': 'The triggering method of the indicator. The optional value for this attribute is click'
|
||||
},
|
||||
mode: ['pc', 'mobile-first'],
|
||||
pcDemo: 'indicator-trigger',
|
||||
|
@ -139,7 +138,7 @@ export default {
|
|||
{
|
||||
name: 'type',
|
||||
type: 'string',
|
||||
defaultValue: "该属性的默认值为 'horizontal'",
|
||||
defaultValue: "'horizontal'",
|
||||
desc: {
|
||||
'zh-CN': '走马灯的类型,该属性的可选值为 horizontal / vertical / card',
|
||||
'en-US': 'The type of horse lantern,The optional values for this attribute are horizontal/vertical/card'
|
||||
|
@ -152,11 +151,12 @@ export default {
|
|||
events: [
|
||||
{
|
||||
name: 'change',
|
||||
type: '',
|
||||
type: '(curIndex: number, preIndex: number) => void',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '幻灯片切换时触发',
|
||||
'en-US': 'Trigger during slide transition'
|
||||
'zh-CN': '幻灯片切换时触发,第一个参数为当前幻灯片索引,第二个参数为上一张幻灯片索引',
|
||||
'en-US':
|
||||
'Trigger during slide transition, The first parameter is the current slide index, and the second parameter is the index of the previous slide'
|
||||
},
|
||||
mode: ['pc', 'mobile-first'],
|
||||
pcDemo: 'carousel-events',
|
||||
|
@ -193,8 +193,9 @@ export default {
|
|||
type: '',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '手动切换幻灯片',
|
||||
'en-US': 'Manually switch slides'
|
||||
'zh-CN': '手动切换幻灯片,参数为需要切换的幻灯片的索引,从 0 开始',
|
||||
'en-US':
|
||||
'Manually switch slides,the parameter is the index of the slides that need to be switched, starting from 0'
|
||||
},
|
||||
mode: ['pc', 'mobile-first'],
|
||||
pcDemo: 'manual-play',
|
||||
|
|
|
@ -0,0 +1,297 @@
|
|||
export default {
|
||||
mode: ['pc'],
|
||||
apis: [
|
||||
{
|
||||
name: 'chart',
|
||||
type: 'component',
|
||||
props: [
|
||||
{
|
||||
name: 'cancel-resize-check',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否禁用 resize 时的容器检测',
|
||||
'en-US': 'Whether to disable container detection during resize'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'0'",
|
||||
desc: {
|
||||
'zh-CN': '属性修改触发图表重绘回调的延迟',
|
||||
'en-US': 'Delay for triggering chart redrawing callback after attribute modification'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'data',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '数据由指标和维度组成,“维度” 指的是数据的属性,“指标” 是量化衡量标准',
|
||||
'en-US':
|
||||
'Data consists of indicators and dimensions. Dimension refers to data attributes, and indicator refers to quantitative measurement standards.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'events',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '事件绑定',
|
||||
'en-US': 'Event binding'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'extend',
|
||||
typeAnchorName: 'chart#IChartProps',
|
||||
type: 'IChartProps',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'echarts 的配置项',
|
||||
'en-US': 'Configuration items of echarts'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'height',
|
||||
type: 'string',
|
||||
defaultValue: "'400px'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的高度。',
|
||||
'en-US': 'Set the height of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'init-options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'init 附加参数',
|
||||
'en-US': 'Init Additional Parameters'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'judge-width',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否处理生成图表时的宽度问题',
|
||||
'en-US': 'Do you want to process the width issue when generating charts?'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'legend-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示图例',
|
||||
'en-US': 'Display legend'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'not-set-unchange',
|
||||
type: 'array',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '未发生变化时不参加 setOption 的属性',
|
||||
'en-US': 'The setOption attribute does not change.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
name: 'resize-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'200'",
|
||||
desc: {
|
||||
'zh-CN': '窗口 resize 事件回调的延迟',
|
||||
'en-US': 'Delay of the window resize event callback'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'resizeable',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否处理窗口 resize 事件',
|
||||
'en-US': 'Whether to process the window resize event'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'set-option-opts',
|
||||
type: 'boolean | object',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': 'echarts setOption 的第二个参数',
|
||||
'en-US': 'Echarts setOption second parameter'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
mode: []
|
||||
},
|
||||
{
|
||||
name: 'theme',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称。;自定义主题对象。',
|
||||
'en-US': 'User-defined theme name. ;User-defined theme object.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'theme-name',
|
||||
type: 'string',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称,如果设置了 theme-name, 则 theme 无效',
|
||||
'en-US': 'User-defined theme name. If theme-name is set, the theme is invalid.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'tooltip-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示提示框',
|
||||
'en-US': 'Display dialog box'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width',
|
||||
type: 'string',
|
||||
defaultValue: "'auto'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的宽度。',
|
||||
'en-US': 'Set the width of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width-change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'300'",
|
||||
desc: {
|
||||
'zh-CN': '容器宽度变化的延迟',
|
||||
'en-US': 'Container width change delay'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '图表配置项(无法与settings混用)',
|
||||
'en-US': 'Chart Configuration item (cannot be used together with settings)'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
}
|
||||
],
|
||||
|
||||
events: [],
|
||||
methods: [],
|
||||
slots: []
|
||||
}
|
||||
],
|
||||
types: [
|
||||
{
|
||||
name: 'IChartProps',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartProps {
|
||||
afterConfig: () => void
|
||||
afterSetOption: () => void
|
||||
afterSetOptionOnce: () => void
|
||||
animation: object
|
||||
axisPointer: object | array
|
||||
backgroundColor: object | string
|
||||
beforeConfig: () => void
|
||||
brush: object | array
|
||||
cancelResizeCheck: boolean
|
||||
changeDelay: number // 默认值 0
|
||||
colorMode: string
|
||||
colors: array
|
||||
data: object | array
|
||||
dataEmpty: boolean
|
||||
dataZoom: object | array
|
||||
events: object
|
||||
extend: object
|
||||
geo: object | array
|
||||
graphic: object | array
|
||||
grid: object | array
|
||||
height: string // 默认值 '400px'
|
||||
initOptions: object
|
||||
judgeWidth: boolean // 默认值 false
|
||||
legend: object | array
|
||||
legendPosition: string
|
||||
legendVisible: boolean // 默认值 true
|
||||
loading: boolean
|
||||
markArea: object
|
||||
markLine: object
|
||||
markPoint: object
|
||||
notSetUnchange: array
|
||||
radar: object
|
||||
resizeDelay: number // 默认值 200
|
||||
resizeable: boolean // 默认值 true
|
||||
series: object | array
|
||||
setOptionOpts: boolean | object // 默认值 true
|
||||
settings: object
|
||||
textStyle: object | array
|
||||
theme: object
|
||||
themeName: object | string
|
||||
timeline: object | array
|
||||
title: object | array
|
||||
toolbox: object | array
|
||||
tooltip: object
|
||||
tooltipFormatter: () => void
|
||||
tooltipVisible: boolean // 默认值 true
|
||||
visualMap: object | array
|
||||
width: string // 默认值 'auto'
|
||||
widthChangeDelay: number // 默认值 300
|
||||
xAxis: object | array
|
||||
yAxis: object | array
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'IChartSettings',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartSettings {
|
||||
type: string // 图表类型,可选值' bar ',' histogram ',' line ',' pie ',' ring ',' funnel ',' radar ',' waterfall '
|
||||
}`
|
||||
}
|
||||
]
|
||||
}
|
|
@ -0,0 +1,309 @@
|
|||
export default {
|
||||
mode: ['pc'],
|
||||
apis: [
|
||||
{
|
||||
name: 'chart',
|
||||
type: 'component',
|
||||
props: [
|
||||
{
|
||||
name: 'cancel-resize-check',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否禁用 resize 时的容器检测',
|
||||
'en-US': 'Whether to disable container detection during resize'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'0'",
|
||||
desc: {
|
||||
'zh-CN': '属性修改触发图表重绘回调的延迟',
|
||||
'en-US': 'Delay for triggering chart redrawing callback after attribute modification'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'data',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '数据由指标和维度组成,“维度” 指的是数据的属性,“指标” 是量化衡量标准',
|
||||
'en-US':
|
||||
'Data consists of indicators and dimensions. Dimension refers to data attributes, and indicator refers to quantitative measurement standards.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'events',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '事件绑定',
|
||||
'en-US': 'Event binding'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'extend',
|
||||
typeAnchorName: 'chart#IChartProps',
|
||||
type: 'IChartProps',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'echarts 的配置项',
|
||||
'en-US': 'Configuration items of echarts'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'height',
|
||||
type: 'string',
|
||||
defaultValue: "'400px'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的高度。',
|
||||
'en-US': 'Set the height of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'init-options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'init 附加参数',
|
||||
'en-US': 'Init Additional Parameters'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'judge-width',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否处理生成图表时的宽度问题',
|
||||
'en-US': 'Do you want to process the width issue when generating charts?'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'legend-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示图例',
|
||||
'en-US': 'Display legend'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'not-set-unchange',
|
||||
type: 'array',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '未发生变化时不参加 setOption 的属性',
|
||||
'en-US': 'The setOption attribute does not change.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
name: 'resize-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'200'",
|
||||
desc: {
|
||||
'zh-CN': '窗口 resize 事件回调的延迟',
|
||||
'en-US': 'Delay of the window resize event callback'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'resizeable',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否处理窗口 resize 事件',
|
||||
'en-US': 'Whether to process the window resize event'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'set-option-opts',
|
||||
type: 'boolean | object',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': 'echarts setOption 的第二个参数',
|
||||
'en-US': 'Echarts setOption second parameter'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
mode: []
|
||||
},
|
||||
{
|
||||
name: 'theme',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称。;自定义主题对象。',
|
||||
'en-US': 'User-defined theme name. ;User-defined theme object.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'theme-name',
|
||||
type: 'string',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称,如果设置了 theme-name, 则 theme 无效',
|
||||
'en-US': 'User-defined theme name. If theme-name is set, the theme is invalid.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'tooltip-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示提示框',
|
||||
'en-US': 'Display dialog box'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width',
|
||||
type: 'string',
|
||||
defaultValue: "'auto'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的宽度。',
|
||||
'en-US': 'Set the width of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width-change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'300'",
|
||||
desc: {
|
||||
'zh-CN': '容器宽度变化的延迟',
|
||||
'en-US': 'Container width change delay'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '图表配置项(无法与settings混用)',
|
||||
'en-US': 'Chart Configuration item (cannot be used together with settings)'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
}
|
||||
],
|
||||
|
||||
events: [],
|
||||
methods: [],
|
||||
slots: []
|
||||
}
|
||||
],
|
||||
types: [
|
||||
{
|
||||
name: 'IChartProps',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartProps {
|
||||
afterConfig: () => void
|
||||
afterSetOption: () => void
|
||||
afterSetOptionOnce: () => void
|
||||
animation: object
|
||||
axisPointer: object | array
|
||||
backgroundColor: object | string
|
||||
beforeConfig: () => void
|
||||
brush: object | array
|
||||
cancelResizeCheck: boolean
|
||||
changeDelay: number // 默认值 0
|
||||
colorMode: string
|
||||
colors: array
|
||||
data: object | array
|
||||
dataEmpty: boolean
|
||||
dataZoom: object | array
|
||||
events: object
|
||||
extend: object
|
||||
geo: object | array
|
||||
graphic: object | array
|
||||
grid: object | array
|
||||
height: string // 默认值 '400px'
|
||||
initOptions: object
|
||||
judgeWidth: boolean // 默认值 false
|
||||
legend: object | array
|
||||
legendPosition: string
|
||||
legendVisible: boolean // 默认值 true
|
||||
loading: boolean
|
||||
markArea: object
|
||||
markLine: object
|
||||
markPoint: object
|
||||
notSetUnchange: array
|
||||
radar: object
|
||||
resizeDelay: number // 默认值 200
|
||||
resizeable: boolean // 默认值 true
|
||||
series: object | array
|
||||
setOptionOpts: boolean | object // 默认值 true
|
||||
settings: object
|
||||
textStyle: object | array
|
||||
theme: object
|
||||
themeName: object | string
|
||||
timeline: object | array
|
||||
title: object | array
|
||||
toolbox: object | array
|
||||
tooltip: object
|
||||
tooltipFormatter: () => void
|
||||
tooltipVisible: boolean // 默认值 true
|
||||
visualMap: object | array
|
||||
width: string // 默认值 'auto'
|
||||
widthChangeDelay: number // 默认值 300
|
||||
xAxis: object | array
|
||||
yAxis: object | array
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'IChartSettings',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartSettings {
|
||||
type: string // 图表类型,可选值' bar ',' histogram ',' line ',' pie ',' ring ',' funnel ',' radar ',' waterfall '
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'Options',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface Options {
|
||||
key: string // 高德地图密钥
|
||||
url: string // 高德地图密钥
|
||||
v: string // 高德地图版本,默认值: 1.4.3
|
||||
amap: object // 高德地图配置项 默认不触发
|
||||
series: object // 高德地图插件配置项
|
||||
}`
|
||||
}
|
||||
]
|
||||
}
|
|
@ -0,0 +1,309 @@
|
|||
export default {
|
||||
mode: ['pc'],
|
||||
apis: [
|
||||
{
|
||||
name: 'chart',
|
||||
type: 'component',
|
||||
props: [
|
||||
{
|
||||
name: 'cancel-resize-check',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否禁用 resize 时的容器检测',
|
||||
'en-US': 'Whether to disable container detection during resize'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'0'",
|
||||
desc: {
|
||||
'zh-CN': '属性修改触发图表重绘回调的延迟',
|
||||
'en-US': 'Delay for triggering chart redrawing callback after attribute modification'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'data',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '数据由指标和维度组成,“维度” 指的是数据的属性,“指标” 是量化衡量标准',
|
||||
'en-US':
|
||||
'Data consists of indicators and dimensions. Dimension refers to data attributes, and indicator refers to quantitative measurement standards.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'events',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '事件绑定',
|
||||
'en-US': 'Event binding'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'extend',
|
||||
typeAnchorName: 'chart#IChartProps',
|
||||
type: 'IChartProps',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'echarts 的配置项',
|
||||
'en-US': 'Configuration items of echarts'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'height',
|
||||
type: 'string',
|
||||
defaultValue: "'400px'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的高度。',
|
||||
'en-US': 'Set the height of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'init-options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'init 附加参数',
|
||||
'en-US': 'Init Additional Parameters'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'judge-width',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否处理生成图表时的宽度问题',
|
||||
'en-US': 'Do you want to process the width issue when generating charts?'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'legend-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示图例',
|
||||
'en-US': 'Display legend'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'not-set-unchange',
|
||||
type: 'array',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '未发生变化时不参加 setOption 的属性',
|
||||
'en-US': 'The setOption attribute does not change.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
name: 'resize-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'200'",
|
||||
desc: {
|
||||
'zh-CN': '窗口 resize 事件回调的延迟',
|
||||
'en-US': 'Delay of the window resize event callback'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'resizeable',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否处理窗口 resize 事件',
|
||||
'en-US': 'Whether to process the window resize event'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'set-option-opts',
|
||||
type: 'boolean | object',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': 'echarts setOption 的第二个参数',
|
||||
'en-US': 'Echarts setOption second parameter'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
mode: []
|
||||
},
|
||||
{
|
||||
name: 'theme',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称。;自定义主题对象。',
|
||||
'en-US': 'User-defined theme name. ;User-defined theme object.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'theme-name',
|
||||
type: 'string',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称,如果设置了 theme-name, 则 theme 无效',
|
||||
'en-US': 'User-defined theme name. If theme-name is set, the theme is invalid.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'tooltip-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示提示框',
|
||||
'en-US': 'Display dialog box'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width',
|
||||
type: 'string',
|
||||
defaultValue: "'auto'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的宽度。',
|
||||
'en-US': 'Set the width of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width-change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'300'",
|
||||
desc: {
|
||||
'zh-CN': '容器宽度变化的延迟',
|
||||
'en-US': 'Container width change delay'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '图表配置项(无法与settings混用)',
|
||||
'en-US': 'Chart Configuration item (cannot be used together with settings)'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
}
|
||||
],
|
||||
|
||||
events: [],
|
||||
methods: [],
|
||||
slots: []
|
||||
}
|
||||
],
|
||||
types: [
|
||||
{
|
||||
name: 'IChartProps',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartProps {
|
||||
afterConfig: () => void
|
||||
afterSetOption: () => void
|
||||
afterSetOptionOnce: () => void
|
||||
animation: object
|
||||
axisPointer: object | array
|
||||
backgroundColor: object | string
|
||||
beforeConfig: () => void
|
||||
brush: object | array
|
||||
cancelResizeCheck: boolean
|
||||
changeDelay: number // 默认值 0
|
||||
colorMode: string
|
||||
colors: array
|
||||
data: object | array
|
||||
dataEmpty: boolean
|
||||
dataZoom: object | array
|
||||
events: object
|
||||
extend: object
|
||||
geo: object | array
|
||||
graphic: object | array
|
||||
grid: object | array
|
||||
height: string // 默认值 '400px'
|
||||
initOptions: object
|
||||
judgeWidth: boolean // 默认值 false
|
||||
legend: object | array
|
||||
legendPosition: string
|
||||
legendVisible: boolean // 默认值 true
|
||||
loading: boolean
|
||||
markArea: object
|
||||
markLine: object
|
||||
markPoint: object
|
||||
notSetUnchange: array
|
||||
radar: object
|
||||
resizeDelay: number // 默认值 200
|
||||
resizeable: boolean // 默认值 true
|
||||
series: object | array
|
||||
setOptionOpts: boolean | object // 默认值 true
|
||||
settings: object
|
||||
textStyle: object | array
|
||||
theme: object
|
||||
themeName: object | string
|
||||
timeline: object | array
|
||||
title: object | array
|
||||
toolbox: object | array
|
||||
tooltip: object
|
||||
tooltipFormatter: () => void
|
||||
tooltipVisible: boolean // 默认值 true
|
||||
visualMap: object | array
|
||||
width: string // 默认值 'auto'
|
||||
widthChangeDelay: number // 默认值 300
|
||||
xAxis: object | array
|
||||
yAxis: object | array
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'IChartSettings',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartSettings {
|
||||
type: string // 图表类型,可选值' bar ',' histogram ',' line ',' pie ',' ring ',' funnel ',' radar ',' waterfall '
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'Options',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface Options {
|
||||
key: string // 百度地图密钥
|
||||
url: string // 百度地图密钥
|
||||
v: string // 百度地图版本,默认值: 1.4.3
|
||||
bmap: object // 百度地图配置项 默认不触发
|
||||
series: object // 百度地图插件配置项
|
||||
}`
|
||||
}
|
||||
]
|
||||
}
|
|
@ -0,0 +1,326 @@
|
|||
export default {
|
||||
mode: ['pc'],
|
||||
apis: [
|
||||
{
|
||||
name: 'chart',
|
||||
type: 'component',
|
||||
props: [
|
||||
{
|
||||
name: 'cancel-resize-check',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否禁用 resize 时的容器检测',
|
||||
'en-US': 'Whether to disable container detection during resize'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'0'",
|
||||
desc: {
|
||||
'zh-CN': '属性修改触发图表重绘回调的延迟',
|
||||
'en-US': 'Delay for triggering chart redrawing callback after attribute modification'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'data',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '数据由指标和维度组成,“维度” 指的是数据的属性,“指标” 是量化衡量标准',
|
||||
'en-US':
|
||||
'Data consists of indicators and dimensions. Dimension refers to data attributes, and indicator refers to quantitative measurement standards.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'events',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '事件绑定',
|
||||
'en-US': 'Event binding'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'extend',
|
||||
typeAnchorName: 'chart#IChartProps',
|
||||
type: 'IChartProps',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'echarts 的配置项',
|
||||
'en-US': 'Configuration items of echarts'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'height',
|
||||
type: 'string',
|
||||
defaultValue: "'400px'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的高度。',
|
||||
'en-US': 'Set the height of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'init-options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'init 附加参数',
|
||||
'en-US': 'Init Additional Parameters'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'judge-width',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否处理生成图表时的宽度问题',
|
||||
'en-US': 'Do you want to process the width issue when generating charts?'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'legend-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示图例',
|
||||
'en-US': 'Display legend'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'not-set-unchange',
|
||||
type: 'array',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '未发生变化时不参加 setOption 的属性',
|
||||
'en-US': 'The setOption attribute does not change.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
name: 'resize-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'200'",
|
||||
desc: {
|
||||
'zh-CN': '窗口 resize 事件回调的延迟',
|
||||
'en-US': 'Delay of the window resize event callback'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'resizeable',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否处理窗口 resize 事件',
|
||||
'en-US': 'Whether to process the window resize event'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'set-option-opts',
|
||||
type: 'boolean | object',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': 'echarts setOption 的第二个参数',
|
||||
'en-US': 'Echarts setOption second parameter'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
mode: []
|
||||
},
|
||||
{
|
||||
name: 'theme',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称。;自定义主题对象。',
|
||||
'en-US': 'User-defined theme name. ;User-defined theme object.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'theme-name',
|
||||
type: 'string',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称,如果设置了 theme-name, 则 theme 无效',
|
||||
'en-US': 'User-defined theme name. If theme-name is set, the theme is invalid.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'tooltip-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示提示框',
|
||||
'en-US': 'Display dialog box'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width',
|
||||
type: 'string',
|
||||
defaultValue: "'auto'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的宽度。',
|
||||
'en-US': 'Set the width of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width-change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'300'",
|
||||
desc: {
|
||||
'zh-CN': '容器宽度变化的延迟',
|
||||
'en-US': 'Container width change delay'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '图表配置项(无法与settings混用)',
|
||||
'en-US': 'Chart Configuration item (cannot be used together with settings)'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
}
|
||||
],
|
||||
|
||||
events: [],
|
||||
methods: [],
|
||||
slots: []
|
||||
}
|
||||
],
|
||||
types: [
|
||||
{
|
||||
name: 'IChartProps',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartProps {
|
||||
afterConfig: () => void
|
||||
afterSetOption: () => void
|
||||
afterSetOptionOnce: () => void
|
||||
animation: object
|
||||
axisPointer: object | array
|
||||
backgroundColor: object | string
|
||||
beforeConfig: () => void
|
||||
brush: object | array
|
||||
cancelResizeCheck: boolean
|
||||
changeDelay: number // 默认值 0
|
||||
colorMode: string
|
||||
colors: array
|
||||
data: object | array
|
||||
dataEmpty: boolean
|
||||
dataZoom: object | array
|
||||
events: object
|
||||
extend: object
|
||||
geo: object | array
|
||||
graphic: object | array
|
||||
grid: object | array
|
||||
height: string // 默认值 '400px'
|
||||
initOptions: object
|
||||
judgeWidth: boolean // 默认值 false
|
||||
legend: object | array
|
||||
legendPosition: string
|
||||
legendVisible: boolean // 默认值 true
|
||||
loading: boolean
|
||||
markArea: object
|
||||
markLine: object
|
||||
markPoint: object
|
||||
notSetUnchange: array
|
||||
radar: object
|
||||
resizeDelay: number // 默认值 200
|
||||
resizeable: boolean // 默认值 true
|
||||
series: object | array
|
||||
setOptionOpts: boolean | object // 默认值 true
|
||||
settings: object
|
||||
textStyle: object | array
|
||||
theme: object
|
||||
themeName: object | string
|
||||
timeline: object | array
|
||||
title: object | array
|
||||
toolbox: object | array
|
||||
tooltip: object
|
||||
tooltipFormatter: () => void
|
||||
tooltipVisible: boolean // 默认值 true
|
||||
visualMap: object | array
|
||||
width: string // 默认值 'auto'
|
||||
widthChangeDelay: number // 默认值 300
|
||||
xAxis: object | array
|
||||
yAxis: object | array
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'IChartSettings',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartSettings {
|
||||
type: string // 图表类型,可选值' bar ',' histogram ',' line ',' pie ',' ring ',' funnel ',' radar ',' waterfall '
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'Options',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface Options {
|
||||
theme: string // 主题, 默认值: cloud-light
|
||||
legend: object // 图例配置, 默认显示
|
||||
xAxis: string | object // 配置x轴, 默认值: 图表数据data数据中data[0]对象的第一个key值
|
||||
yAxis: array | object // 配置y轴, 默认值: [50,20,50,20]
|
||||
padding: array // 图表内边距值, 默认值: [50,20,50,20]
|
||||
color: array | string // 颜色
|
||||
tipHtml: function // 悬浮提示框内容配置, 默认显示
|
||||
tipHtmlStyle: object // 悬浮提示框样式配置, 默认值: { padding: [14,16] }
|
||||
dataZoom: object // 区域缩放轴配置, 默认不显示
|
||||
linearGradient: object // 线性渐变
|
||||
event: object // 图表事件, 默认不触发
|
||||
data: array // 图表数据(必填)
|
||||
type: string // 配置柱状图类型, 默认值: bar
|
||||
stepGradient: array // 柱体分段渐变
|
||||
axisPointer: object // 坐标指示器(数据背景区域样式),(支持 rgb 颜色、英文单词颜色、十六进制颜色), 默认值: rgba(25,25,25,0.08)
|
||||
topTipHtml: function // 顶部位置悬浮提示框, 默认不显示
|
||||
itemStyle: object // 图表数据点文本样式, 默认值: {barWidth: 8, barGap: '60%'}
|
||||
direction: string // 柱体方向, 默认值: vertical
|
||||
label: object | array // 柱体文本, 默认不显示
|
||||
lineDataName: array // 柱状图更改为折线图的数据名
|
||||
markline: object // 阈值线配置, 默认不显示
|
||||
|
||||
}`
|
||||
}
|
||||
]
|
||||
}
|
|
@ -0,0 +1,314 @@
|
|||
export default {
|
||||
mode: ['pc'],
|
||||
apis: [
|
||||
{
|
||||
name: 'chart',
|
||||
type: 'component',
|
||||
props: [
|
||||
{
|
||||
name: 'cancel-resize-check',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否禁用 resize 时的容器检测',
|
||||
'en-US': 'Whether to disable container detection during resize'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'0'",
|
||||
desc: {
|
||||
'zh-CN': '属性修改触发图表重绘回调的延迟',
|
||||
'en-US': 'Delay for triggering chart redrawing callback after attribute modification'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'data',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '数据由指标和维度组成,“维度” 指的是数据的属性,“指标” 是量化衡量标准',
|
||||
'en-US':
|
||||
'Data consists of indicators and dimensions. Dimension refers to data attributes, and indicator refers to quantitative measurement standards.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'events',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '事件绑定',
|
||||
'en-US': 'Event binding'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'extend',
|
||||
typeAnchorName: 'chart#IChartProps',
|
||||
type: 'IChartProps',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'echarts 的配置项',
|
||||
'en-US': 'Configuration items of echarts'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'height',
|
||||
type: 'string',
|
||||
defaultValue: "'400px'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的高度。',
|
||||
'en-US': 'Set the height of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'init-options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'init 附加参数',
|
||||
'en-US': 'Init Additional Parameters'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'judge-width',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否处理生成图表时的宽度问题',
|
||||
'en-US': 'Do you want to process the width issue when generating charts?'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'legend-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示图例',
|
||||
'en-US': 'Display legend'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'not-set-unchange',
|
||||
type: 'array',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '未发生变化时不参加 setOption 的属性',
|
||||
'en-US': 'The setOption attribute does not change.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
name: 'resize-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'200'",
|
||||
desc: {
|
||||
'zh-CN': '窗口 resize 事件回调的延迟',
|
||||
'en-US': 'Delay of the window resize event callback'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'resizeable',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否处理窗口 resize 事件',
|
||||
'en-US': 'Whether to process the window resize event'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'set-option-opts',
|
||||
type: 'boolean | object',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': 'echarts setOption 的第二个参数',
|
||||
'en-US': 'Echarts setOption second parameter'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
mode: []
|
||||
},
|
||||
{
|
||||
name: 'theme',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称。;自定义主题对象。',
|
||||
'en-US': 'User-defined theme name. ;User-defined theme object.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'theme-name',
|
||||
type: 'string',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称,如果设置了 theme-name, 则 theme 无效',
|
||||
'en-US': 'User-defined theme name. If theme-name is set, the theme is invalid.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'tooltip-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示提示框',
|
||||
'en-US': 'Display dialog box'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width',
|
||||
type: 'string',
|
||||
defaultValue: "'auto'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的宽度。',
|
||||
'en-US': 'Set the width of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width-change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'300'",
|
||||
desc: {
|
||||
'zh-CN': '容器宽度变化的延迟',
|
||||
'en-US': 'Container width change delay'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '图表配置项(无法与settings混用)',
|
||||
'en-US': 'Chart Configuration item (cannot be used together with settings)'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
}
|
||||
],
|
||||
|
||||
events: [],
|
||||
methods: [],
|
||||
slots: []
|
||||
}
|
||||
],
|
||||
types: [
|
||||
{
|
||||
name: 'IChartProps',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartProps {
|
||||
afterConfig: () => void
|
||||
afterSetOption: () => void
|
||||
afterSetOptionOnce: () => void
|
||||
animation: object
|
||||
axisPointer: object | array
|
||||
backgroundColor: object | string
|
||||
beforeConfig: () => void
|
||||
brush: object | array
|
||||
cancelResizeCheck: boolean
|
||||
changeDelay: number // 默认值 0
|
||||
colorMode: string
|
||||
colors: array
|
||||
data: object | array
|
||||
dataEmpty: boolean
|
||||
dataZoom: object | array
|
||||
events: object
|
||||
extend: object
|
||||
geo: object | array
|
||||
graphic: object | array
|
||||
grid: object | array
|
||||
height: string // 默认值 '400px'
|
||||
initOptions: object
|
||||
judgeWidth: boolean // 默认值 false
|
||||
legend: object | array
|
||||
legendPosition: string
|
||||
legendVisible: boolean // 默认值 true
|
||||
loading: boolean
|
||||
markArea: object
|
||||
markLine: object
|
||||
markPoint: object
|
||||
notSetUnchange: array
|
||||
radar: object
|
||||
resizeDelay: number // 默认值 200
|
||||
resizeable: boolean // 默认值 true
|
||||
series: object | array
|
||||
setOptionOpts: boolean | object // 默认值 true
|
||||
settings: object
|
||||
textStyle: object | array
|
||||
theme: object
|
||||
themeName: object | string
|
||||
timeline: object | array
|
||||
title: object | array
|
||||
toolbox: object | array
|
||||
tooltip: object
|
||||
tooltipFormatter: () => void
|
||||
tooltipVisible: boolean // 默认值 true
|
||||
visualMap: object | array
|
||||
width: string // 默认值 'auto'
|
||||
widthChangeDelay: number // 默认值 300
|
||||
xAxis: object | array
|
||||
yAxis: object | array
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'IChartSettings',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartSettings {
|
||||
type: string // 图表类型,可选值' bar ',' histogram ',' line ',' pie ',' ring ',' funnel ',' radar ',' waterfall '
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'Options',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface Options {
|
||||
theme: string // 主题, 默认值: cloud-light
|
||||
color: array | string // 颜色
|
||||
tipHtml: function // 悬浮提示框内容配置, 默认显示
|
||||
tipHtmlStyle: object // 悬浮提示框样式配置, 默认值: { padding: [14,16] }
|
||||
event: object // 图表事件, 默认不触发
|
||||
data: array // 图表数据(必填)
|
||||
series: array // 自定义图表series
|
||||
dataset: array // 自定义图表dataset
|
||||
|
||||
}`
|
||||
}
|
||||
|
||||
]
|
||||
}
|
|
@ -0,0 +1,314 @@
|
|||
export default {
|
||||
mode: ['pc'],
|
||||
apis: [
|
||||
{
|
||||
name: 'chart',
|
||||
type: 'component',
|
||||
props: [
|
||||
{
|
||||
name: 'cancel-resize-check',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否禁用 resize 时的容器检测',
|
||||
'en-US': 'Whether to disable container detection during resize'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'0'",
|
||||
desc: {
|
||||
'zh-CN': '属性修改触发图表重绘回调的延迟',
|
||||
'en-US': 'Delay for triggering chart redrawing callback after attribute modification'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'data',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '数据由指标和维度组成,“维度” 指的是数据的属性,“指标” 是量化衡量标准',
|
||||
'en-US':
|
||||
'Data consists of indicators and dimensions. Dimension refers to data attributes, and indicator refers to quantitative measurement standards.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'events',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '事件绑定',
|
||||
'en-US': 'Event binding'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'extend',
|
||||
typeAnchorName: 'chart#IChartProps',
|
||||
type: 'IChartProps',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'echarts 的配置项',
|
||||
'en-US': 'Configuration items of echarts'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'height',
|
||||
type: 'string',
|
||||
defaultValue: "'400px'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的高度。',
|
||||
'en-US': 'Set the height of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'init-options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'init 附加参数',
|
||||
'en-US': 'Init Additional Parameters'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'judge-width',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否处理生成图表时的宽度问题',
|
||||
'en-US': 'Do you want to process the width issue when generating charts?'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'legend-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示图例',
|
||||
'en-US': 'Display legend'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'not-set-unchange',
|
||||
type: 'array',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '未发生变化时不参加 setOption 的属性',
|
||||
'en-US': 'The setOption attribute does not change.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
name: 'resize-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'200'",
|
||||
desc: {
|
||||
'zh-CN': '窗口 resize 事件回调的延迟',
|
||||
'en-US': 'Delay of the window resize event callback'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'resizeable',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否处理窗口 resize 事件',
|
||||
'en-US': 'Whether to process the window resize event'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'set-option-opts',
|
||||
type: 'boolean | object',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': 'echarts setOption 的第二个参数',
|
||||
'en-US': 'Echarts setOption second parameter'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
mode: []
|
||||
},
|
||||
{
|
||||
name: 'theme',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称。;自定义主题对象。',
|
||||
'en-US': 'User-defined theme name. ;User-defined theme object.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'theme-name',
|
||||
type: 'string',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称,如果设置了 theme-name, 则 theme 无效',
|
||||
'en-US': 'User-defined theme name. If theme-name is set, the theme is invalid.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'tooltip-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示提示框',
|
||||
'en-US': 'Display dialog box'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width',
|
||||
type: 'string',
|
||||
defaultValue: "'auto'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的宽度。',
|
||||
'en-US': 'Set the width of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width-change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'300'",
|
||||
desc: {
|
||||
'zh-CN': '容器宽度变化的延迟',
|
||||
'en-US': 'Container width change delay'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '图表配置项(无法与settings混用)',
|
||||
'en-US': 'Chart Configuration item (cannot be used together with settings)'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
}
|
||||
],
|
||||
|
||||
events: [],
|
||||
methods: [],
|
||||
slots: []
|
||||
}
|
||||
],
|
||||
types: [
|
||||
{
|
||||
name: 'IChartProps',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartProps {
|
||||
afterConfig: () => void
|
||||
afterSetOption: () => void
|
||||
afterSetOptionOnce: () => void
|
||||
animation: object
|
||||
axisPointer: object | array
|
||||
backgroundColor: object | string
|
||||
beforeConfig: () => void
|
||||
brush: object | array
|
||||
cancelResizeCheck: boolean
|
||||
changeDelay: number // 默认值 0
|
||||
colorMode: string
|
||||
colors: array
|
||||
data: object | array
|
||||
dataEmpty: boolean
|
||||
dataZoom: object | array
|
||||
events: object
|
||||
extend: object
|
||||
geo: object | array
|
||||
graphic: object | array
|
||||
grid: object | array
|
||||
height: string // 默认值 '400px'
|
||||
initOptions: object
|
||||
judgeWidth: boolean // 默认值 false
|
||||
legend: object | array
|
||||
legendPosition: string
|
||||
legendVisible: boolean // 默认值 true
|
||||
loading: boolean
|
||||
markArea: object
|
||||
markLine: object
|
||||
markPoint: object
|
||||
notSetUnchange: array
|
||||
radar: object
|
||||
resizeDelay: number // 默认值 200
|
||||
resizeable: boolean // 默认值 true
|
||||
series: object | array
|
||||
setOptionOpts: boolean | object // 默认值 true
|
||||
settings: object
|
||||
textStyle: object | array
|
||||
theme: object
|
||||
themeName: object | string
|
||||
timeline: object | array
|
||||
title: object | array
|
||||
toolbox: object | array
|
||||
tooltip: object
|
||||
tooltipFormatter: () => void
|
||||
tooltipVisible: boolean // 默认值 true
|
||||
visualMap: object | array
|
||||
width: string // 默认值 'auto'
|
||||
widthChangeDelay: number // 默认值 300
|
||||
xAxis: object | array
|
||||
yAxis: object | array
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'IChartSettings',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartSettings {
|
||||
type: string // 图表类型,可选值' bar ',' histogram ',' line ',' pie ',' ring ',' funnel ',' radar ',' waterfall '
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'Options',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface Options {
|
||||
theme: string // 主题, 默认值: light
|
||||
color: array | string // 颜色
|
||||
legend: object // 图例配置, 默认显示
|
||||
dataZoom: object // 区域缩放轴配置, 默认不显示
|
||||
event: object // 图表事件, 默认不触发
|
||||
MA: array // k线图的MA数据均线
|
||||
data: array // 图表数据(必填)
|
||||
upColor: string // 上行数据颜色
|
||||
downColor: string // 下行数据颜色
|
||||
|
||||
}`
|
||||
}
|
||||
]
|
||||
}
|
|
@ -0,0 +1,297 @@
|
|||
export default {
|
||||
mode: ['pc'],
|
||||
apis: [
|
||||
{
|
||||
name: 'chart',
|
||||
type: 'component',
|
||||
props: [
|
||||
{
|
||||
name: 'cancel-resize-check',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否禁用 resize 时的容器检测',
|
||||
'en-US': 'Whether to disable container detection during resize'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'0'",
|
||||
desc: {
|
||||
'zh-CN': '属性修改触发图表重绘回调的延迟',
|
||||
'en-US': 'Delay for triggering chart redrawing callback after attribute modification'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'data',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '数据由指标和维度组成,“维度” 指的是数据的属性,“指标” 是量化衡量标准',
|
||||
'en-US':
|
||||
'Data consists of indicators and dimensions. Dimension refers to data attributes, and indicator refers to quantitative measurement standards.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'events',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '事件绑定',
|
||||
'en-US': 'Event binding'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'extend',
|
||||
typeAnchorName: 'chart#IChartProps',
|
||||
type: 'IChartProps',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'echarts 的配置项',
|
||||
'en-US': 'Configuration items of echarts'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'height',
|
||||
type: 'string',
|
||||
defaultValue: "'400px'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的高度。',
|
||||
'en-US': 'Set the height of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'init-options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'init 附加参数',
|
||||
'en-US': 'Init Additional Parameters'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'judge-width',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否处理生成图表时的宽度问题',
|
||||
'en-US': 'Do you want to process the width issue when generating charts?'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'legend-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示图例',
|
||||
'en-US': 'Display legend'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'not-set-unchange',
|
||||
type: 'array',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '未发生变化时不参加 setOption 的属性',
|
||||
'en-US': 'The setOption attribute does not change.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
name: 'resize-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'200'",
|
||||
desc: {
|
||||
'zh-CN': '窗口 resize 事件回调的延迟',
|
||||
'en-US': 'Delay of the window resize event callback'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'resizeable',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否处理窗口 resize 事件',
|
||||
'en-US': 'Whether to process the window resize event'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'set-option-opts',
|
||||
type: 'boolean | object',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': 'echarts setOption 的第二个参数',
|
||||
'en-US': 'Echarts setOption second parameter'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
mode: []
|
||||
},
|
||||
{
|
||||
name: 'theme',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称。;自定义主题对象。',
|
||||
'en-US': 'User-defined theme name. ;User-defined theme object.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'theme-name',
|
||||
type: 'string',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称,如果设置了 theme-name, 则 theme 无效',
|
||||
'en-US': 'User-defined theme name. If theme-name is set, the theme is invalid.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'tooltip-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示提示框',
|
||||
'en-US': 'Display dialog box'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width',
|
||||
type: 'string',
|
||||
defaultValue: "'auto'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的宽度。',
|
||||
'en-US': 'Set the width of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width-change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'300'",
|
||||
desc: {
|
||||
'zh-CN': '容器宽度变化的延迟',
|
||||
'en-US': 'Container width change delay'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '图表配置项(无法与settings混用)',
|
||||
'en-US': 'Chart Configuration item (cannot be used together with settings)'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
}
|
||||
],
|
||||
|
||||
events: [],
|
||||
methods: [],
|
||||
slots: []
|
||||
}
|
||||
],
|
||||
types: [
|
||||
{
|
||||
name: 'IChartProps',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartProps {
|
||||
afterConfig: () => void
|
||||
afterSetOption: () => void
|
||||
afterSetOptionOnce: () => void
|
||||
animation: object
|
||||
axisPointer: object | array
|
||||
backgroundColor: object | string
|
||||
beforeConfig: () => void
|
||||
brush: object | array
|
||||
cancelResizeCheck: boolean
|
||||
changeDelay: number // 默认值 0
|
||||
colorMode: string
|
||||
colors: array
|
||||
data: object | array
|
||||
dataEmpty: boolean
|
||||
dataZoom: object | array
|
||||
events: object
|
||||
extend: object
|
||||
geo: object | array
|
||||
graphic: object | array
|
||||
grid: object | array
|
||||
height: string // 默认值 '400px'
|
||||
initOptions: object
|
||||
judgeWidth: boolean // 默认值 false
|
||||
legend: object | array
|
||||
legendPosition: string
|
||||
legendVisible: boolean // 默认值 true
|
||||
loading: boolean
|
||||
markArea: object
|
||||
markLine: object
|
||||
markPoint: object
|
||||
notSetUnchange: array
|
||||
radar: object
|
||||
resizeDelay: number // 默认值 200
|
||||
resizeable: boolean // 默认值 true
|
||||
series: object | array
|
||||
setOptionOpts: boolean | object // 默认值 true
|
||||
settings: object
|
||||
textStyle: object | array
|
||||
theme: object
|
||||
themeName: object | string
|
||||
timeline: object | array
|
||||
title: object | array
|
||||
toolbox: object | array
|
||||
tooltip: object
|
||||
tooltipFormatter: () => void
|
||||
tooltipVisible: boolean // 默认值 true
|
||||
visualMap: object | array
|
||||
width: string // 默认值 'auto'
|
||||
widthChangeDelay: number // 默认值 300
|
||||
xAxis: object | array
|
||||
yAxis: object | array
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'IChartSettings',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartSettings {
|
||||
type: string // 图表类型,可选值' bar ',' histogram ',' line ',' pie ',' ring ',' funnel ',' radar ',' waterfall '
|
||||
}`
|
||||
}
|
||||
]
|
||||
}
|
|
@ -0,0 +1,297 @@
|
|||
export default {
|
||||
mode: ['pc'],
|
||||
apis: [
|
||||
{
|
||||
name: 'chart',
|
||||
type: 'component',
|
||||
props: [
|
||||
{
|
||||
name: 'cancel-resize-check',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否禁用 resize 时的容器检测',
|
||||
'en-US': 'Whether to disable container detection during resize'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'0'",
|
||||
desc: {
|
||||
'zh-CN': '属性修改触发图表重绘回调的延迟',
|
||||
'en-US': 'Delay for triggering chart redrawing callback after attribute modification'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'data',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '数据由指标和维度组成,“维度” 指的是数据的属性,“指标” 是量化衡量标准',
|
||||
'en-US':
|
||||
'Data consists of indicators and dimensions. Dimension refers to data attributes, and indicator refers to quantitative measurement standards.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'events',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '事件绑定',
|
||||
'en-US': 'Event binding'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'extend',
|
||||
typeAnchorName: 'chart#IChartProps',
|
||||
type: 'IChartProps',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'echarts 的配置项',
|
||||
'en-US': 'Configuration items of echarts'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'height',
|
||||
type: 'string',
|
||||
defaultValue: "'400px'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的高度。',
|
||||
'en-US': 'Set the height of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'init-options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'init 附加参数',
|
||||
'en-US': 'Init Additional Parameters'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'judge-width',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否处理生成图表时的宽度问题',
|
||||
'en-US': 'Do you want to process the width issue when generating charts?'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'legend-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示图例',
|
||||
'en-US': 'Display legend'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'not-set-unchange',
|
||||
type: 'array',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '未发生变化时不参加 setOption 的属性',
|
||||
'en-US': 'The setOption attribute does not change.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
name: 'resize-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'200'",
|
||||
desc: {
|
||||
'zh-CN': '窗口 resize 事件回调的延迟',
|
||||
'en-US': 'Delay of the window resize event callback'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'resizeable',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否处理窗口 resize 事件',
|
||||
'en-US': 'Whether to process the window resize event'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'set-option-opts',
|
||||
type: 'boolean | object',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': 'echarts setOption 的第二个参数',
|
||||
'en-US': 'Echarts setOption second parameter'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
mode: []
|
||||
},
|
||||
{
|
||||
name: 'theme',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称。;自定义主题对象。',
|
||||
'en-US': 'User-defined theme name. ;User-defined theme object.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'theme-name',
|
||||
type: 'string',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称,如果设置了 theme-name, 则 theme 无效',
|
||||
'en-US': 'User-defined theme name. If theme-name is set, the theme is invalid.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'tooltip-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示提示框',
|
||||
'en-US': 'Display dialog box'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width',
|
||||
type: 'string',
|
||||
defaultValue: "'auto'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的宽度。',
|
||||
'en-US': 'Set the width of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width-change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'300'",
|
||||
desc: {
|
||||
'zh-CN': '容器宽度变化的延迟',
|
||||
'en-US': 'Container width change delay'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '图表配置项(无法与settings混用)',
|
||||
'en-US': 'Chart Configuration item (cannot be used together with settings)'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
}
|
||||
],
|
||||
|
||||
events: [],
|
||||
methods: [],
|
||||
slots: []
|
||||
}
|
||||
],
|
||||
types: [
|
||||
{
|
||||
name: 'IChartProps',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartProps {
|
||||
afterConfig: () => void
|
||||
afterSetOption: () => void
|
||||
afterSetOptionOnce: () => void
|
||||
animation: object
|
||||
axisPointer: object | array
|
||||
backgroundColor: object | string
|
||||
beforeConfig: () => void
|
||||
brush: object | array
|
||||
cancelResizeCheck: boolean
|
||||
changeDelay: number // 默认值 0
|
||||
colorMode: string
|
||||
colors: array
|
||||
data: object | array
|
||||
dataEmpty: boolean
|
||||
dataZoom: object | array
|
||||
events: object
|
||||
extend: object
|
||||
geo: object | array
|
||||
graphic: object | array
|
||||
grid: object | array
|
||||
height: string // 默认值 '400px'
|
||||
initOptions: object
|
||||
judgeWidth: boolean // 默认值 false
|
||||
legend: object | array
|
||||
legendPosition: string
|
||||
legendVisible: boolean // 默认值 true
|
||||
loading: boolean
|
||||
markArea: object
|
||||
markLine: object
|
||||
markPoint: object
|
||||
notSetUnchange: array
|
||||
radar: object
|
||||
resizeDelay: number // 默认值 200
|
||||
resizeable: boolean // 默认值 true
|
||||
series: object | array
|
||||
setOptionOpts: boolean | object // 默认值 true
|
||||
settings: object
|
||||
textStyle: object | array
|
||||
theme: object
|
||||
themeName: object | string
|
||||
timeline: object | array
|
||||
title: object | array
|
||||
toolbox: object | array
|
||||
tooltip: object
|
||||
tooltipFormatter: () => void
|
||||
tooltipVisible: boolean // 默认值 true
|
||||
visualMap: object | array
|
||||
width: string // 默认值 'auto'
|
||||
widthChangeDelay: number // 默认值 300
|
||||
xAxis: object | array
|
||||
yAxis: object | array
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'IChartSettings',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartSettings {
|
||||
type: string // 图表类型,可选值' bar ',' histogram ',' line ',' pie ',' ring ',' funnel ',' radar ',' waterfall '
|
||||
}`
|
||||
}
|
||||
]
|
||||
}
|
|
@ -0,0 +1,316 @@
|
|||
export default {
|
||||
mode: ['pc'],
|
||||
apis: [
|
||||
{
|
||||
name: 'chart',
|
||||
type: 'component',
|
||||
props: [
|
||||
{
|
||||
name: 'cancel-resize-check',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否禁用 resize 时的容器检测',
|
||||
'en-US': 'Whether to disable container detection during resize'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'0'",
|
||||
desc: {
|
||||
'zh-CN': '属性修改触发图表重绘回调的延迟',
|
||||
'en-US': 'Delay for triggering chart redrawing callback after attribute modification'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'data',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '数据由指标和维度组成,“维度” 指的是数据的属性,“指标” 是量化衡量标准',
|
||||
'en-US':
|
||||
'Data consists of indicators and dimensions. Dimension refers to data attributes, and indicator refers to quantitative measurement standards.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'events',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '事件绑定',
|
||||
'en-US': 'Event binding'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'extend',
|
||||
typeAnchorName: 'chart#IChartProps',
|
||||
type: 'IChartProps',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'echarts 的配置项',
|
||||
'en-US': 'Configuration items of echarts'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'height',
|
||||
type: 'string',
|
||||
defaultValue: "'400px'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的高度。',
|
||||
'en-US': 'Set the height of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'init-options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'init 附加参数',
|
||||
'en-US': 'Init Additional Parameters'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'judge-width',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否处理生成图表时的宽度问题',
|
||||
'en-US': 'Do you want to process the width issue when generating charts?'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'legend-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示图例',
|
||||
'en-US': 'Display legend'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'not-set-unchange',
|
||||
type: 'array',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '未发生变化时不参加 setOption 的属性',
|
||||
'en-US': 'The setOption attribute does not change.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
name: 'resize-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'200'",
|
||||
desc: {
|
||||
'zh-CN': '窗口 resize 事件回调的延迟',
|
||||
'en-US': 'Delay of the window resize event callback'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'resizeable',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否处理窗口 resize 事件',
|
||||
'en-US': 'Whether to process the window resize event'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'set-option-opts',
|
||||
type: 'boolean | object',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': 'echarts setOption 的第二个参数',
|
||||
'en-US': 'Echarts setOption second parameter'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
mode: []
|
||||
},
|
||||
{
|
||||
name: 'theme',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称。;自定义主题对象。',
|
||||
'en-US': 'User-defined theme name. ;User-defined theme object.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'theme-name',
|
||||
type: 'string',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称,如果设置了 theme-name, 则 theme 无效',
|
||||
'en-US': 'User-defined theme name. If theme-name is set, the theme is invalid.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'tooltip-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示提示框',
|
||||
'en-US': 'Display dialog box'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width',
|
||||
type: 'string',
|
||||
defaultValue: "'auto'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的宽度。',
|
||||
'en-US': 'Set the width of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width-change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'300'",
|
||||
desc: {
|
||||
'zh-CN': '容器宽度变化的延迟',
|
||||
'en-US': 'Container width change delay'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '图表配置项(无法与settings混用)',
|
||||
'en-US': 'Chart Configuration item (cannot be used together with settings)'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
}
|
||||
],
|
||||
|
||||
events: [],
|
||||
methods: [],
|
||||
slots: []
|
||||
}
|
||||
],
|
||||
types: [
|
||||
{
|
||||
name: 'IChartProps',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartProps {
|
||||
afterConfig: () => void
|
||||
afterSetOption: () => void
|
||||
afterSetOptionOnce: () => void
|
||||
animation: object
|
||||
axisPointer: object | array
|
||||
backgroundColor: object | string
|
||||
beforeConfig: () => void
|
||||
brush: object | array
|
||||
cancelResizeCheck: boolean
|
||||
changeDelay: number // 默认值 0
|
||||
colorMode: string
|
||||
colors: array
|
||||
data: object | array
|
||||
dataEmpty: boolean
|
||||
dataZoom: object | array
|
||||
events: object
|
||||
extend: object
|
||||
geo: object | array
|
||||
graphic: object | array
|
||||
grid: object | array
|
||||
height: string // 默认值 '400px'
|
||||
initOptions: object
|
||||
judgeWidth: boolean // 默认值 false
|
||||
legend: object | array
|
||||
legendPosition: string
|
||||
legendVisible: boolean // 默认值 true
|
||||
loading: boolean
|
||||
markArea: object
|
||||
markLine: object
|
||||
markPoint: object
|
||||
notSetUnchange: array
|
||||
radar: object
|
||||
resizeDelay: number // 默认值 200
|
||||
resizeable: boolean // 默认值 true
|
||||
series: object | array
|
||||
setOptionOpts: boolean | object // 默认值 true
|
||||
settings: object
|
||||
textStyle: object | array
|
||||
theme: object
|
||||
themeName: object | string
|
||||
timeline: object | array
|
||||
title: object | array
|
||||
toolbox: object | array
|
||||
tooltip: object
|
||||
tooltipFormatter: () => void
|
||||
tooltipVisible: boolean // 默认值 true
|
||||
visualMap: object | array
|
||||
width: string // 默认值 'auto'
|
||||
widthChangeDelay: number // 默认值 300
|
||||
xAxis: object | array
|
||||
yAxis: object | array
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'IChartSettings',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartSettings {
|
||||
type: string // 图表类型,可选值' bar ',' histogram ',' line ',' pie ',' ring ',' funnel ',' radar ',' waterfall '
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'Options',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface Options {
|
||||
theme: string // 主题, 默认值: light
|
||||
color: array | string // 颜色
|
||||
tipHtml: function // 悬浮提示框内容配置, 默认值: { padding: [14,16] }
|
||||
event: object // 图表事件, 默认不触发
|
||||
legend: object // 图例配置, 默认显示
|
||||
gap: number // 数据图形间距, 默认值: 1
|
||||
sort: string // 图表排序方式, 默认值: descending
|
||||
size: object // 图表大小, 默认不显示
|
||||
position: object // 图标位置, 默认显示
|
||||
label: object // 图表文本, 默认显示
|
||||
data: array // 图表数据(必填)
|
||||
series: object // 图表series
|
||||
}`
|
||||
}
|
||||
]
|
||||
}
|
|
@ -0,0 +1,327 @@
|
|||
export default {
|
||||
mode: ['pc'],
|
||||
apis: [
|
||||
{
|
||||
name: 'chart',
|
||||
type: 'component',
|
||||
props: [
|
||||
{
|
||||
name: 'cancel-resize-check',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否禁用 resize 时的容器检测',
|
||||
'en-US': 'Whether to disable container detection during resize'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'0'",
|
||||
desc: {
|
||||
'zh-CN': '属性修改触发图表重绘回调的延迟',
|
||||
'en-US': 'Delay for triggering chart redrawing callback after attribute modification'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'data',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '数据由指标和维度组成,“维度” 指的是数据的属性,“指标” 是量化衡量标准',
|
||||
'en-US':
|
||||
'Data consists of indicators and dimensions. Dimension refers to data attributes, and indicator refers to quantitative measurement standards.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'events',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '事件绑定',
|
||||
'en-US': 'Event binding'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'extend',
|
||||
typeAnchorName: 'chart#IChartProps',
|
||||
type: 'IChartProps',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'echarts 的配置项',
|
||||
'en-US': 'Configuration items of echarts'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'height',
|
||||
type: 'string',
|
||||
defaultValue: "'400px'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的高度。',
|
||||
'en-US': 'Set the height of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'init-options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'init 附加参数',
|
||||
'en-US': 'Init Additional Parameters'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'judge-width',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否处理生成图表时的宽度问题',
|
||||
'en-US': 'Do you want to process the width issue when generating charts?'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'legend-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示图例',
|
||||
'en-US': 'Display legend'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'not-set-unchange',
|
||||
type: 'array',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '未发生变化时不参加 setOption 的属性',
|
||||
'en-US': 'The setOption attribute does not change.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
name: 'resize-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'200'",
|
||||
desc: {
|
||||
'zh-CN': '窗口 resize 事件回调的延迟',
|
||||
'en-US': 'Delay of the window resize event callback'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'resizeable',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否处理窗口 resize 事件',
|
||||
'en-US': 'Whether to process the window resize event'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'set-option-opts',
|
||||
type: 'boolean | object',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': 'echarts setOption 的第二个参数',
|
||||
'en-US': 'Echarts setOption second parameter'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
mode: []
|
||||
},
|
||||
{
|
||||
name: 'theme',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称。;自定义主题对象。',
|
||||
'en-US': 'User-defined theme name. ;User-defined theme object.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'theme-name',
|
||||
type: 'string',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称,如果设置了 theme-name, 则 theme 无效',
|
||||
'en-US': 'User-defined theme name. If theme-name is set, the theme is invalid.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'tooltip-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示提示框',
|
||||
'en-US': 'Display dialog box'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width',
|
||||
type: 'string',
|
||||
defaultValue: "'auto'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的宽度。',
|
||||
'en-US': 'Set the width of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width-change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'300'",
|
||||
desc: {
|
||||
'zh-CN': '容器宽度变化的延迟',
|
||||
'en-US': 'Container width change delay'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '图表配置项(无法与settings混用)',
|
||||
'en-US': 'Chart Configuration item (cannot be used together with settings)'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
}
|
||||
],
|
||||
|
||||
events: [],
|
||||
methods: [],
|
||||
slots: []
|
||||
}
|
||||
],
|
||||
types: [
|
||||
{
|
||||
name: 'IChartProps',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartProps {
|
||||
afterConfig: () => void
|
||||
afterSetOption: () => void
|
||||
afterSetOptionOnce: () => void
|
||||
animation: object
|
||||
axisPointer: object | array
|
||||
backgroundColor: object | string
|
||||
beforeConfig: () => void
|
||||
brush: object | array
|
||||
cancelResizeCheck: boolean
|
||||
changeDelay: number // 默认值 0
|
||||
colorMode: string
|
||||
colors: array
|
||||
data: object | array
|
||||
dataEmpty: boolean
|
||||
dataZoom: object | array
|
||||
events: object
|
||||
extend: object
|
||||
geo: object | array
|
||||
graphic: object | array
|
||||
grid: object | array
|
||||
height: string // 默认值 '400px'
|
||||
initOptions: object
|
||||
judgeWidth: boolean // 默认值 false
|
||||
legend: object | array
|
||||
legendPosition: string
|
||||
legendVisible: boolean // 默认值 true
|
||||
loading: boolean
|
||||
markArea: object
|
||||
markLine: object
|
||||
markPoint: object
|
||||
notSetUnchange: array
|
||||
radar: object
|
||||
resizeDelay: number // 默认值 200
|
||||
resizeable: boolean // 默认值 true
|
||||
series: object | array
|
||||
setOptionOpts: boolean | object // 默认值 true
|
||||
settings: object
|
||||
textStyle: object | array
|
||||
theme: object
|
||||
themeName: object | string
|
||||
timeline: object | array
|
||||
title: object | array
|
||||
toolbox: object | array
|
||||
tooltip: object
|
||||
tooltipFormatter: () => void
|
||||
tooltipVisible: boolean // 默认值 true
|
||||
visualMap: object | array
|
||||
width: string // 默认值 'auto'
|
||||
widthChangeDelay: number // 默认值 300
|
||||
xAxis: object | array
|
||||
yAxis: object | array
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'IChartSettings',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartSettings {
|
||||
type: string // 图表类型,可选值' bar ',' histogram ',' line ',' pie ',' ring ',' funnel ',' radar ',' waterfall '
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'Options',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface Options {
|
||||
theme: string // 主题, 默认值: light
|
||||
color: array | string // 颜色
|
||||
tipHtml: function // 悬浮提示框内容配置, 默认值: { padding: [14,16] }
|
||||
event: object // 图表事件, 默认不触发
|
||||
data: array // 图表数据(必填), 默认值: { value: 90, name: 'Utilization rate' }
|
||||
position: object // 图表位置及大小, 默认值: {center: ['50%','50%'], radius: '70%'}
|
||||
pointer: boolean // 刻度指针是否显示, 默认值: false
|
||||
min: number // 仪表盘最小刻度, 默认值: 0
|
||||
max: number // 仪表盘最大刻度, 默认值: 100
|
||||
text: object // 中心文本配置, 默认值: 显示data中的value和name值
|
||||
startAngle: number // 仪表盘起始角度, 默认值: 225
|
||||
endAngle: number // 仪表盘结束角度, 默认值: -45
|
||||
splitColor: array // 配置分割区间及颜色
|
||||
splitNumber: number // 刻度线数量配置, 默认值: 4
|
||||
splitLine: object // 刻度线及文本配置, 默认显示
|
||||
markLine: number // 阈值线配置
|
||||
gradientColor: array // 线性配置
|
||||
itemStyle: object // 进度条样式配置
|
||||
axisLabelStyle: object // 调整指针样式
|
||||
pointerStyle: object // 调整指针样式
|
||||
mask: object // 外层光晕蒙层配置
|
||||
orbitalColor: string // 仪表盘的轨道颜色
|
||||
silent: boolean // 是否关闭hover动效, 默认值: false
|
||||
}`
|
||||
}
|
||||
]
|
||||
}
|
|
@ -0,0 +1,305 @@
|
|||
export default {
|
||||
mode: ['pc'],
|
||||
apis: [
|
||||
{
|
||||
name: 'chart',
|
||||
type: 'component',
|
||||
props: [
|
||||
{
|
||||
name: 'cancel-resize-check',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否禁用 resize 时的容器检测',
|
||||
'en-US': 'Whether to disable container detection during resize'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'0'",
|
||||
desc: {
|
||||
'zh-CN': '属性修改触发图表重绘回调的延迟',
|
||||
'en-US': 'Delay for triggering chart redrawing callback after attribute modification'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'data',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '数据由指标和维度组成,“维度” 指的是数据的属性,“指标” 是量化衡量标准',
|
||||
'en-US':
|
||||
'Data consists of indicators and dimensions. Dimension refers to data attributes, and indicator refers to quantitative measurement standards.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'events',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '事件绑定',
|
||||
'en-US': 'Event binding'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'extend',
|
||||
typeAnchorName: 'chart#IChartProps',
|
||||
type: 'IChartProps',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'echarts 的配置项',
|
||||
'en-US': 'Configuration items of echarts'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'height',
|
||||
type: 'string',
|
||||
defaultValue: "'400px'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的高度。',
|
||||
'en-US': 'Set the height of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'init-options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'init 附加参数',
|
||||
'en-US': 'Init Additional Parameters'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'judge-width',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否处理生成图表时的宽度问题',
|
||||
'en-US': 'Do you want to process the width issue when generating charts?'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'legend-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示图例',
|
||||
'en-US': 'Display legend'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'not-set-unchange',
|
||||
type: 'array',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '未发生变化时不参加 setOption 的属性',
|
||||
'en-US': 'The setOption attribute does not change.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
name: 'resize-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'200'",
|
||||
desc: {
|
||||
'zh-CN': '窗口 resize 事件回调的延迟',
|
||||
'en-US': 'Delay of the window resize event callback'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'resizeable',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否处理窗口 resize 事件',
|
||||
'en-US': 'Whether to process the window resize event'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'set-option-opts',
|
||||
type: 'boolean | object',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': 'echarts setOption 的第二个参数',
|
||||
'en-US': 'Echarts setOption second parameter'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
mode: []
|
||||
},
|
||||
{
|
||||
name: 'theme',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称。;自定义主题对象。',
|
||||
'en-US': 'User-defined theme name. ;User-defined theme object.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'theme-name',
|
||||
type: 'string',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称,如果设置了 theme-name, 则 theme 无效',
|
||||
'en-US': 'User-defined theme name. If theme-name is set, the theme is invalid.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'tooltip-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示提示框',
|
||||
'en-US': 'Display dialog box'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width',
|
||||
type: 'string',
|
||||
defaultValue: "'auto'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的宽度。',
|
||||
'en-US': 'Set the width of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width-change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'300'",
|
||||
desc: {
|
||||
'zh-CN': '容器宽度变化的延迟',
|
||||
'en-US': 'Container width change delay'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '图表配置项(无法与settings混用)',
|
||||
'en-US': 'Chart Configuration item (cannot be used together with settings)'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
}
|
||||
],
|
||||
|
||||
events: [],
|
||||
methods: [],
|
||||
slots: []
|
||||
}
|
||||
],
|
||||
types: [
|
||||
{
|
||||
name: 'IChartProps',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartProps {
|
||||
afterConfig: () => void
|
||||
afterSetOption: () => void
|
||||
afterSetOptionOnce: () => void
|
||||
animation: object
|
||||
axisPointer: object | array
|
||||
backgroundColor: object | string
|
||||
beforeConfig: () => void
|
||||
brush: object | array
|
||||
cancelResizeCheck: boolean
|
||||
changeDelay: number // 默认值 0
|
||||
colorMode: string
|
||||
colors: array
|
||||
data: object | array
|
||||
dataEmpty: boolean
|
||||
dataZoom: object | array
|
||||
events: object
|
||||
extend: object
|
||||
geo: object | array
|
||||
graphic: object | array
|
||||
grid: object | array
|
||||
height: string // 默认值 '400px'
|
||||
initOptions: object
|
||||
judgeWidth: boolean // 默认值 false
|
||||
legend: object | array
|
||||
legendPosition: string
|
||||
legendVisible: boolean // 默认值 true
|
||||
loading: boolean
|
||||
markArea: object
|
||||
markLine: object
|
||||
markPoint: object
|
||||
notSetUnchange: array
|
||||
radar: object
|
||||
resizeDelay: number // 默认值 200
|
||||
resizeable: boolean // 默认值 true
|
||||
series: object | array
|
||||
setOptionOpts: boolean | object // 默认值 true
|
||||
settings: object
|
||||
textStyle: object | array
|
||||
theme: object
|
||||
themeName: object | string
|
||||
timeline: object | array
|
||||
title: object | array
|
||||
toolbox: object | array
|
||||
tooltip: object
|
||||
tooltipFormatter: () => void
|
||||
tooltipVisible: boolean // 默认值 true
|
||||
visualMap: object | array
|
||||
width: string // 默认值 'auto'
|
||||
widthChangeDelay: number // 默认值 300
|
||||
xAxis: object | array
|
||||
yAxis: object | array
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'IChartSettings',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartSettings {
|
||||
type: string // 图表类型,可选值' bar ',' histogram ',' line ',' pie ',' ring ',' funnel ',' radar ',' waterfall '
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'Options',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface Options {
|
||||
// 使用方法目前仅支持 eCharts 原生属性配置, 使用方法和 echarts 一致。 详细配置请参考https://echarts.apache.org/examples/zh/index.html#chart-type-graph
|
||||
}`
|
||||
}
|
||||
]
|
||||
}
|
|
@ -0,0 +1,324 @@
|
|||
export default {
|
||||
mode: ['pc'],
|
||||
apis: [
|
||||
{
|
||||
name: 'chart',
|
||||
type: 'component',
|
||||
props: [
|
||||
{
|
||||
name: 'cancel-resize-check',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否禁用 resize 时的容器检测',
|
||||
'en-US': 'Whether to disable container detection during resize'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'0'",
|
||||
desc: {
|
||||
'zh-CN': '属性修改触发图表重绘回调的延迟',
|
||||
'en-US': 'Delay for triggering chart redrawing callback after attribute modification'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'data',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '数据由指标和维度组成,“维度” 指的是数据的属性,“指标” 是量化衡量标准',
|
||||
'en-US':
|
||||
'Data consists of indicators and dimensions. Dimension refers to data attributes, and indicator refers to quantitative measurement standards.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'events',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '事件绑定',
|
||||
'en-US': 'Event binding'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'extend',
|
||||
typeAnchorName: 'chart#IChartProps',
|
||||
type: 'IChartProps',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'echarts 的配置项',
|
||||
'en-US': 'Configuration items of echarts'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'height',
|
||||
type: 'string',
|
||||
defaultValue: "'400px'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的高度。',
|
||||
'en-US': 'Set the height of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'init-options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'init 附加参数',
|
||||
'en-US': 'Init Additional Parameters'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'judge-width',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否处理生成图表时的宽度问题',
|
||||
'en-US': 'Do you want to process the width issue when generating charts?'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'legend-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示图例',
|
||||
'en-US': 'Display legend'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'not-set-unchange',
|
||||
type: 'array',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '未发生变化时不参加 setOption 的属性',
|
||||
'en-US': 'The setOption attribute does not change.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
name: 'resize-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'200'",
|
||||
desc: {
|
||||
'zh-CN': '窗口 resize 事件回调的延迟',
|
||||
'en-US': 'Delay of the window resize event callback'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'resizeable',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否处理窗口 resize 事件',
|
||||
'en-US': 'Whether to process the window resize event'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'set-option-opts',
|
||||
type: 'boolean | object',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': 'echarts setOption 的第二个参数',
|
||||
'en-US': 'Echarts setOption second parameter'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
mode: []
|
||||
},
|
||||
{
|
||||
name: 'theme',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称。;自定义主题对象。',
|
||||
'en-US': 'User-defined theme name. ;User-defined theme object.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'theme-name',
|
||||
type: 'string',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称,如果设置了 theme-name, 则 theme 无效',
|
||||
'en-US': 'User-defined theme name. If theme-name is set, the theme is invalid.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'tooltip-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示提示框',
|
||||
'en-US': 'Display dialog box'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width',
|
||||
type: 'string',
|
||||
defaultValue: "'auto'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的宽度。',
|
||||
'en-US': 'Set the width of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width-change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'300'",
|
||||
desc: {
|
||||
'zh-CN': '容器宽度变化的延迟',
|
||||
'en-US': 'Container width change delay'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '图表配置项(无法与settings混用)',
|
||||
'en-US': 'Chart Configuration item (cannot be used together with settings)'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
}
|
||||
],
|
||||
|
||||
events: [],
|
||||
methods: [],
|
||||
slots: []
|
||||
}
|
||||
],
|
||||
types: [
|
||||
{
|
||||
name: 'IChartProps',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartProps {
|
||||
afterConfig: () => void
|
||||
afterSetOption: () => void
|
||||
afterSetOptionOnce: () => void
|
||||
animation: object
|
||||
axisPointer: object | array
|
||||
backgroundColor: object | string
|
||||
beforeConfig: () => void
|
||||
brush: object | array
|
||||
cancelResizeCheck: boolean
|
||||
changeDelay: number // 默认值 0
|
||||
colorMode: string
|
||||
colors: array
|
||||
data: object | array
|
||||
dataEmpty: boolean
|
||||
dataZoom: object | array
|
||||
events: object
|
||||
extend: object
|
||||
geo: object | array
|
||||
graphic: object | array
|
||||
grid: object | array
|
||||
height: string // 默认值 '400px'
|
||||
initOptions: object
|
||||
judgeWidth: boolean // 默认值 false
|
||||
legend: object | array
|
||||
legendPosition: string
|
||||
legendVisible: boolean // 默认值 true
|
||||
loading: boolean
|
||||
markArea: object
|
||||
markLine: object
|
||||
markPoint: object
|
||||
notSetUnchange: array
|
||||
radar: object
|
||||
resizeDelay: number // 默认值 200
|
||||
resizeable: boolean // 默认值 true
|
||||
series: object | array
|
||||
setOptionOpts: boolean | object // 默认值 true
|
||||
settings: object
|
||||
textStyle: object | array
|
||||
theme: object
|
||||
themeName: object | string
|
||||
timeline: object | array
|
||||
title: object | array
|
||||
toolbox: object | array
|
||||
tooltip: object
|
||||
tooltipFormatter: () => void
|
||||
tooltipVisible: boolean // 默认值 true
|
||||
visualMap: object | array
|
||||
width: string // 默认值 'auto'
|
||||
widthChangeDelay: number // 默认值 300
|
||||
xAxis: object | array
|
||||
yAxis: object | array
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'IChartSettings',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartSettings {
|
||||
type: string // 图表类型,可选值' bar ',' histogram ',' line ',' pie ',' ring ',' funnel ',' radar ',' waterfall '
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'Options',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface Options {
|
||||
theme: string // 主题, 默认值: light
|
||||
color: array | string // 颜色
|
||||
padding: array // 图表内边距值, 默认值: [50,20,50,20]
|
||||
tipHtml: function // 悬浮提示框内容配置, 默认值: { padding: [14,16] }
|
||||
event: object // 图表事件, 默认不触发
|
||||
data: array // 图表数据(必填)
|
||||
type: string // 配置热力图类型
|
||||
borderColor: string // 日历热力图举行边框色, 默认值: #1F55B5
|
||||
showLabel: boolean // 日历热力图矩形文本显示, 默认值: true
|
||||
rectangleSize: number // 矩形热力图矩形矩形大小, 默认值: 8
|
||||
handle: object // 日历热力图手柄相关配置
|
||||
quantity: number // 蜂窝热力图单行排列数量设置, 默认值: 40
|
||||
changeProperty: string // 日历热力图热力的变化设置, 默认值: opacity
|
||||
xAxis: object // 配置x轴坐标数据, 默认显示
|
||||
yAxis: object // 配置y轴, 默认显示
|
||||
xAxisName: string // 配置x轴文本(建议使用xAxis.name)
|
||||
yAxisName: string // 配置y轴文本(建议使用yAxis.name)
|
||||
xAxisLine: object // 设置x轴样式(建议使用xAxis.line), 默认显示
|
||||
xAxisLabelRotate: number // x轴label旋转角度(建议使用xAxis.labelRotate)
|
||||
xAixsInterval:number | function // 配置x轴label间距(建议使用xAxis.interval),默认值: 0
|
||||
}`
|
||||
}
|
||||
]
|
||||
}
|
|
@ -0,0 +1,326 @@
|
|||
export default {
|
||||
mode: ['pc'],
|
||||
apis: [
|
||||
{
|
||||
name: 'chart',
|
||||
type: 'component',
|
||||
props: [
|
||||
{
|
||||
name: 'cancel-resize-check',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否禁用 resize 时的容器检测',
|
||||
'en-US': 'Whether to disable container detection during resize'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'0'",
|
||||
desc: {
|
||||
'zh-CN': '属性修改触发图表重绘回调的延迟',
|
||||
'en-US': 'Delay for triggering chart redrawing callback after attribute modification'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'data',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '数据由指标和维度组成,“维度” 指的是数据的属性,“指标” 是量化衡量标准',
|
||||
'en-US':
|
||||
'Data consists of indicators and dimensions. Dimension refers to data attributes, and indicator refers to quantitative measurement standards.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'events',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '事件绑定',
|
||||
'en-US': 'Event binding'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'extend',
|
||||
typeAnchorName: 'chart#IChartProps',
|
||||
type: 'IChartProps',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'echarts 的配置项',
|
||||
'en-US': 'Configuration items of echarts'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'height',
|
||||
type: 'string',
|
||||
defaultValue: "'400px'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的高度。',
|
||||
'en-US': 'Set the height of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'init-options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'init 附加参数',
|
||||
'en-US': 'Init Additional Parameters'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'judge-width',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否处理生成图表时的宽度问题',
|
||||
'en-US': 'Do you want to process the width issue when generating charts?'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'legend-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示图例',
|
||||
'en-US': 'Display legend'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'not-set-unchange',
|
||||
type: 'array',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '未发生变化时不参加 setOption 的属性',
|
||||
'en-US': 'The setOption attribute does not change.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
name: 'resize-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'200'",
|
||||
desc: {
|
||||
'zh-CN': '窗口 resize 事件回调的延迟',
|
||||
'en-US': 'Delay of the window resize event callback'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'resizeable',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否处理窗口 resize 事件',
|
||||
'en-US': 'Whether to process the window resize event'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'set-option-opts',
|
||||
type: 'boolean | object',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': 'echarts setOption 的第二个参数',
|
||||
'en-US': 'Echarts setOption second parameter'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
mode: []
|
||||
},
|
||||
{
|
||||
name: 'theme',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称。;自定义主题对象。',
|
||||
'en-US': 'User-defined theme name. ;User-defined theme object.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'theme-name',
|
||||
type: 'string',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称,如果设置了 theme-name, 则 theme 无效',
|
||||
'en-US': 'User-defined theme name. If theme-name is set, the theme is invalid.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'tooltip-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示提示框',
|
||||
'en-US': 'Display dialog box'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width',
|
||||
type: 'string',
|
||||
defaultValue: "'auto'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的宽度。',
|
||||
'en-US': 'Set the width of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width-change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'300'",
|
||||
desc: {
|
||||
'zh-CN': '容器宽度变化的延迟',
|
||||
'en-US': 'Container width change delay'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '图表配置项(无法与settings混用)',
|
||||
'en-US': 'Chart Configuration item (cannot be used together with settings)'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
}
|
||||
],
|
||||
|
||||
events: [],
|
||||
methods: [],
|
||||
slots: []
|
||||
}
|
||||
],
|
||||
types: [
|
||||
{
|
||||
name: 'IChartProps',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartProps {
|
||||
afterConfig: () => void
|
||||
afterSetOption: () => void
|
||||
afterSetOptionOnce: () => void
|
||||
animation: object
|
||||
axisPointer: object | array
|
||||
backgroundColor: object | string
|
||||
beforeConfig: () => void
|
||||
brush: object | array
|
||||
cancelResizeCheck: boolean
|
||||
changeDelay: number // 默认值 0
|
||||
colorMode: string
|
||||
colors: array
|
||||
data: object | array
|
||||
dataEmpty: boolean
|
||||
dataZoom: object | array
|
||||
events: object
|
||||
extend: object
|
||||
geo: object | array
|
||||
graphic: object | array
|
||||
grid: object | array
|
||||
height: string // 默认值 '400px'
|
||||
initOptions: object
|
||||
judgeWidth: boolean // 默认值 false
|
||||
legend: object | array
|
||||
legendPosition: string
|
||||
legendVisible: boolean // 默认值 true
|
||||
loading: boolean
|
||||
markArea: object
|
||||
markLine: object
|
||||
markPoint: object
|
||||
notSetUnchange: array
|
||||
radar: object
|
||||
resizeDelay: number // 默认值 200
|
||||
resizeable: boolean // 默认值 true
|
||||
series: object | array
|
||||
setOptionOpts: boolean | object // 默认值 true
|
||||
settings: object
|
||||
textStyle: object | array
|
||||
theme: object
|
||||
themeName: object | string
|
||||
timeline: object | array
|
||||
title: object | array
|
||||
toolbox: object | array
|
||||
tooltip: object
|
||||
tooltipFormatter: () => void
|
||||
tooltipVisible: boolean // 默认值 true
|
||||
visualMap: object | array
|
||||
width: string // 默认值 'auto'
|
||||
widthChangeDelay: number // 默认值 300
|
||||
xAxis: object | array
|
||||
yAxis: object | array
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'IChartSettings',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartSettings {
|
||||
type: string // 图表类型,可选值' bar ',' histogram ',' line ',' pie ',' ring ',' funnel ',' radar ',' waterfall '
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'Options',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface Options {
|
||||
theme: string // 主题, 默认值: light
|
||||
legend: object // 图例配置, 默认显示
|
||||
xAxis: string | object // 配置x轴, 默认值: 图表数据data数据中data[0]对象的第一个key值
|
||||
yAxis: array | object // 配置y轴, 默认值: [50,20,50,20]
|
||||
padding: array // 图表内边距值, 默认值: [50,20,50,20]
|
||||
color: array | string // 颜色
|
||||
tipHtml: function // 悬浮提示框内容配置, 默认值: { padding: [14,16] }
|
||||
tipHtmlStyle: object // 悬浮提示框样式配置, 默认值: { padding: [14,16] }
|
||||
dataZoom: object // 区域缩放轴配置, 默认不显示
|
||||
linearGradient: object // 线性渐变
|
||||
event: object // 图表事件, 默认不触发
|
||||
data: array // 图表数据(必填)
|
||||
type: string // 配置柱状图类型, 默认值: bar
|
||||
stepGradient: array // 柱体分段渐变
|
||||
axisPointer: object // 坐标指示器(数据背景区域样式),(支持 rgb 颜色、英文单词颜色、十六进制颜色), 默认值: rgba(25,25,25,0.08)
|
||||
topTipHtml: function // 顶部位置悬浮提示框, 默认不显示
|
||||
itemStyle: object // 图表数据点文本样式, 默认值: {barWidth: 8, barGap: '60%'}
|
||||
direction: string // 柱体方向, 默认值: vertical
|
||||
label: object | array // 柱体文本, 默认不显示
|
||||
lineDataName: array // 柱状图更改为折线图的数据名
|
||||
markline: object // 阈值线配置, 默认不显示
|
||||
|
||||
}`
|
||||
}
|
||||
]
|
||||
}
|
|
@ -0,0 +1,323 @@
|
|||
export default {
|
||||
mode: ['pc'],
|
||||
apis: [
|
||||
{
|
||||
name: 'chart',
|
||||
type: 'component',
|
||||
props: [
|
||||
{
|
||||
name: 'cancel-resize-check',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否禁用 resize 时的容器检测',
|
||||
'en-US': 'Whether to disable container detection during resize'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'0'",
|
||||
desc: {
|
||||
'zh-CN': '属性修改触发图表重绘回调的延迟',
|
||||
'en-US': 'Delay for triggering chart redrawing callback after attribute modification'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'data',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '数据由指标和维度组成,“维度” 指的是数据的属性,“指标” 是量化衡量标准',
|
||||
'en-US':
|
||||
'Data consists of indicators and dimensions. Dimension refers to data attributes, and indicator refers to quantitative measurement standards.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'events',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '事件绑定',
|
||||
'en-US': 'Event binding'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'extend',
|
||||
typeAnchorName: 'chart#IChartProps',
|
||||
type: 'IChartProps',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'echarts 的配置项',
|
||||
'en-US': 'Configuration items of echarts'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'height',
|
||||
type: 'string',
|
||||
defaultValue: "'400px'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的高度。',
|
||||
'en-US': 'Set the height of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'init-options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'init 附加参数',
|
||||
'en-US': 'Init Additional Parameters'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'judge-width',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否处理生成图表时的宽度问题',
|
||||
'en-US': 'Do you want to process the width issue when generating charts?'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'legend-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示图例',
|
||||
'en-US': 'Display legend'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'not-set-unchange',
|
||||
type: 'array',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '未发生变化时不参加 setOption 的属性',
|
||||
'en-US': 'The setOption attribute does not change.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
name: 'resize-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'200'",
|
||||
desc: {
|
||||
'zh-CN': '窗口 resize 事件回调的延迟',
|
||||
'en-US': 'Delay of the window resize event callback'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'resizeable',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否处理窗口 resize 事件',
|
||||
'en-US': 'Whether to process the window resize event'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'set-option-opts',
|
||||
type: 'boolean | object',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': 'echarts setOption 的第二个参数',
|
||||
'en-US': 'Echarts setOption second parameter'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
mode: []
|
||||
},
|
||||
{
|
||||
name: 'theme',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称。;自定义主题对象。',
|
||||
'en-US': 'User-defined theme name. ;User-defined theme object.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'theme-name',
|
||||
type: 'string',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称,如果设置了 theme-name, 则 theme 无效',
|
||||
'en-US': 'User-defined theme name. If theme-name is set, the theme is invalid.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'tooltip-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示提示框',
|
||||
'en-US': 'Display dialog box'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width',
|
||||
type: 'string',
|
||||
defaultValue: "'auto'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的宽度。',
|
||||
'en-US': 'Set the width of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width-change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'300'",
|
||||
desc: {
|
||||
'zh-CN': '容器宽度变化的延迟',
|
||||
'en-US': 'Container width change delay'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '图表配置项(无法与settings混用)',
|
||||
'en-US': 'Chart Configuration item (cannot be used together with settings)'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
}
|
||||
],
|
||||
|
||||
events: [],
|
||||
methods: [],
|
||||
slots: []
|
||||
}
|
||||
],
|
||||
types: [
|
||||
{
|
||||
name: 'IChartProps',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartProps {
|
||||
afterConfig: () => void
|
||||
afterSetOption: () => void
|
||||
afterSetOptionOnce: () => void
|
||||
animation: object
|
||||
axisPointer: object | array
|
||||
backgroundColor: object | string
|
||||
beforeConfig: () => void
|
||||
brush: object | array
|
||||
cancelResizeCheck: boolean
|
||||
changeDelay: number // 默认值 0
|
||||
colorMode: string
|
||||
colors: array
|
||||
data: object | array
|
||||
dataEmpty: boolean
|
||||
dataZoom: object | array
|
||||
events: object
|
||||
extend: object
|
||||
geo: object | array
|
||||
graphic: object | array
|
||||
grid: object | array
|
||||
height: string // 默认值 '400px'
|
||||
initOptions: object
|
||||
judgeWidth: boolean // 默认值 false
|
||||
legend: object | array
|
||||
legendPosition: string
|
||||
legendVisible: boolean // 默认值 true
|
||||
loading: boolean
|
||||
markArea: object
|
||||
markLine: object
|
||||
markPoint: object
|
||||
notSetUnchange: array
|
||||
radar: object
|
||||
resizeDelay: number // 默认值 200
|
||||
resizeable: boolean // 默认值 true
|
||||
series: object | array
|
||||
setOptionOpts: boolean | object // 默认值 true
|
||||
settings: object
|
||||
textStyle: object | array
|
||||
theme: object
|
||||
themeName: object | string
|
||||
timeline: object | array
|
||||
title: object | array
|
||||
toolbox: object | array
|
||||
tooltip: object
|
||||
tooltipFormatter: () => void
|
||||
tooltipVisible: boolean // 默认值 true
|
||||
visualMap: object | array
|
||||
width: string // 默认值 'auto'
|
||||
widthChangeDelay: number // 默认值 300
|
||||
xAxis: object | array
|
||||
yAxis: object | array
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'IChartSettings',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartSettings {
|
||||
type: string // 图表类型,可选值' bar ',' histogram ',' line ',' pie ',' ring ',' funnel ',' radar ',' waterfall '
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'Options',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface Options {
|
||||
theme: string // 主题, 默认值: light
|
||||
color: array | string // 颜色
|
||||
padding: array // 图表内边距值, 默认值: [50,20,50,20]
|
||||
legend: object // 图例配置, 默认显示
|
||||
smooth: boolean // 是否关闭hover动效, 默认值: false
|
||||
silent: boolean // 是否关闭hover动效, 默认值: false
|
||||
data: array // 图表数据(必填)
|
||||
itemStyle: object // 折线是否更改为阶梯线, 默认值: false
|
||||
step: boolean // 折线图是否更改为阶梯线, 默认值: false
|
||||
predict: string // 折线是否更改为预测线的数据名
|
||||
tipHtml: function // 悬浮提示框内容配置, 默认值: { padding: [14,16] }
|
||||
tipHtmlStyle: object // 悬浮提示框样式配置, 默认值: { padding: [14,16] }
|
||||
xAxis: string | object // 配置x轴, 默认值: 图表数据data数据中data[0]对象的第一个key值
|
||||
yAxis: array | object // 配置y轴, 默认值: [50,20,50,20]
|
||||
dataZoom: object // 区域缩放轴配置, 默认不显示
|
||||
linearGradient: object // 线性渐变
|
||||
event: object // 图表事件, 默认不触发
|
||||
markline: object // 阈值线配置, 默认不显示
|
||||
markPoint: object // 峰值标记, 默认值: markPoint: {max:false, min:false}
|
||||
}`
|
||||
}
|
||||
]
|
||||
}
|
|
@ -0,0 +1,314 @@
|
|||
export default {
|
||||
mode: ['pc'],
|
||||
apis: [
|
||||
{
|
||||
name: 'chart',
|
||||
type: 'component',
|
||||
props: [
|
||||
{
|
||||
name: 'cancel-resize-check',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否禁用 resize 时的容器检测',
|
||||
'en-US': 'Whether to disable container detection during resize'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'0'",
|
||||
desc: {
|
||||
'zh-CN': '属性修改触发图表重绘回调的延迟',
|
||||
'en-US': 'Delay for triggering chart redrawing callback after attribute modification'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'data',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '数据由指标和维度组成,“维度” 指的是数据的属性,“指标” 是量化衡量标准',
|
||||
'en-US':
|
||||
'Data consists of indicators and dimensions. Dimension refers to data attributes, and indicator refers to quantitative measurement standards.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'events',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '事件绑定',
|
||||
'en-US': 'Event binding'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'extend',
|
||||
typeAnchorName: 'chart#IChartProps',
|
||||
type: 'IChartProps',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'echarts 的配置项',
|
||||
'en-US': 'Configuration items of echarts'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'height',
|
||||
type: 'string',
|
||||
defaultValue: "'400px'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的高度。',
|
||||
'en-US': 'Set the height of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'init-options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'init 附加参数',
|
||||
'en-US': 'Init Additional Parameters'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'judge-width',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否处理生成图表时的宽度问题',
|
||||
'en-US': 'Do you want to process the width issue when generating charts?'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'legend-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示图例',
|
||||
'en-US': 'Display legend'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'not-set-unchange',
|
||||
type: 'array',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '未发生变化时不参加 setOption 的属性',
|
||||
'en-US': 'The setOption attribute does not change.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
name: 'resize-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'200'",
|
||||
desc: {
|
||||
'zh-CN': '窗口 resize 事件回调的延迟',
|
||||
'en-US': 'Delay of the window resize event callback'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'resizeable',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否处理窗口 resize 事件',
|
||||
'en-US': 'Whether to process the window resize event'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'set-option-opts',
|
||||
type: 'boolean | object',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': 'echarts setOption 的第二个参数',
|
||||
'en-US': 'Echarts setOption second parameter'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
mode: []
|
||||
},
|
||||
{
|
||||
name: 'theme',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称。;自定义主题对象。',
|
||||
'en-US': 'User-defined theme name. ;User-defined theme object.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'theme-name',
|
||||
type: 'string',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称,如果设置了 theme-name, 则 theme 无效',
|
||||
'en-US': 'User-defined theme name. If theme-name is set, the theme is invalid.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'tooltip-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示提示框',
|
||||
'en-US': 'Display dialog box'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width',
|
||||
type: 'string',
|
||||
defaultValue: "'auto'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的宽度。',
|
||||
'en-US': 'Set the width of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width-change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'300'",
|
||||
desc: {
|
||||
'zh-CN': '容器宽度变化的延迟',
|
||||
'en-US': 'Container width change delay'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '图表配置项(无法与settings混用)',
|
||||
'en-US': 'Chart Configuration item (cannot be used together with settings)'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
}
|
||||
],
|
||||
|
||||
events: [],
|
||||
methods: [],
|
||||
slots: []
|
||||
}
|
||||
],
|
||||
types: [
|
||||
{
|
||||
name: 'IChartProps',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartProps {
|
||||
afterConfig: () => void
|
||||
afterSetOption: () => void
|
||||
afterSetOptionOnce: () => void
|
||||
animation: object
|
||||
axisPointer: object | array
|
||||
backgroundColor: object | string
|
||||
beforeConfig: () => void
|
||||
brush: object | array
|
||||
cancelResizeCheck: boolean
|
||||
changeDelay: number // 默认值 0
|
||||
colorMode: string
|
||||
colors: array
|
||||
data: object | array
|
||||
dataEmpty: boolean
|
||||
dataZoom: object | array
|
||||
events: object
|
||||
extend: object
|
||||
geo: object | array
|
||||
graphic: object | array
|
||||
grid: object | array
|
||||
height: string // 默认值 '400px'
|
||||
initOptions: object
|
||||
judgeWidth: boolean // 默认值 false
|
||||
legend: object | array
|
||||
legendPosition: string
|
||||
legendVisible: boolean // 默认值 true
|
||||
loading: boolean
|
||||
markArea: object
|
||||
markLine: object
|
||||
markPoint: object
|
||||
notSetUnchange: array
|
||||
radar: object
|
||||
resizeDelay: number // 默认值 200
|
||||
resizeable: boolean // 默认值 true
|
||||
series: object | array
|
||||
setOptionOpts: boolean | object // 默认值 true
|
||||
settings: object
|
||||
textStyle: object | array
|
||||
theme: object
|
||||
themeName: object | string
|
||||
timeline: object | array
|
||||
title: object | array
|
||||
toolbox: object | array
|
||||
tooltip: object
|
||||
tooltipFormatter: () => void
|
||||
tooltipVisible: boolean // 默认值 true
|
||||
visualMap: object | array
|
||||
width: string // 默认值 'auto'
|
||||
widthChangeDelay: number // 默认值 300
|
||||
xAxis: object | array
|
||||
yAxis: object | array
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'IChartSettings',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartSettings {
|
||||
type: string // 图表类型,可选值' bar ',' histogram ',' line ',' pie ',' ring ',' funnel ',' radar ',' waterfall '
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'Options',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface Options {
|
||||
theme: string // 主题, 默认值: light
|
||||
color: array | string // 颜色
|
||||
tipHtml: function // 悬浮提示框内容配置, 默认值: { padding: [14,16] }
|
||||
waveAnimation: boolean // 图表动画, 默认值: true
|
||||
backgroundstyle: object // 图表背景配置, 默认显示
|
||||
shape: string // 图表形状, 默认显示
|
||||
outline: object // 图表外框配置, 默认显示
|
||||
label: object // 图标文本, 默认显示
|
||||
data: array // 图表数据(必填)
|
||||
series: object // 图表series
|
||||
}`
|
||||
}
|
||||
]
|
||||
}
|
|
@ -0,0 +1,305 @@
|
|||
export default {
|
||||
mode: ['pc'],
|
||||
apis: [
|
||||
{
|
||||
name: 'chart',
|
||||
type: 'component',
|
||||
props: [
|
||||
{
|
||||
name: 'cancel-resize-check',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否禁用 resize 时的容器检测',
|
||||
'en-US': 'Whether to disable container detection during resize'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'0'",
|
||||
desc: {
|
||||
'zh-CN': '属性修改触发图表重绘回调的延迟',
|
||||
'en-US': 'Delay for triggering chart redrawing callback after attribute modification'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'data',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '数据由指标和维度组成,“维度” 指的是数据的属性,“指标” 是量化衡量标准',
|
||||
'en-US':
|
||||
'Data consists of indicators and dimensions. Dimension refers to data attributes, and indicator refers to quantitative measurement standards.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'events',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '事件绑定',
|
||||
'en-US': 'Event binding'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'extend',
|
||||
typeAnchorName: 'chart#IChartProps',
|
||||
type: 'IChartProps',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'echarts 的配置项',
|
||||
'en-US': 'Configuration items of echarts'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'height',
|
||||
type: 'string',
|
||||
defaultValue: "'400px'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的高度。',
|
||||
'en-US': 'Set the height of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'init-options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'init 附加参数',
|
||||
'en-US': 'Init Additional Parameters'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'judge-width',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否处理生成图表时的宽度问题',
|
||||
'en-US': 'Do you want to process the width issue when generating charts?'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'legend-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示图例',
|
||||
'en-US': 'Display legend'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'not-set-unchange',
|
||||
type: 'array',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '未发生变化时不参加 setOption 的属性',
|
||||
'en-US': 'The setOption attribute does not change.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
name: 'resize-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'200'",
|
||||
desc: {
|
||||
'zh-CN': '窗口 resize 事件回调的延迟',
|
||||
'en-US': 'Delay of the window resize event callback'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'resizeable',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否处理窗口 resize 事件',
|
||||
'en-US': 'Whether to process the window resize event'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'set-option-opts',
|
||||
type: 'boolean | object',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': 'echarts setOption 的第二个参数',
|
||||
'en-US': 'Echarts setOption second parameter'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
mode: []
|
||||
},
|
||||
{
|
||||
name: 'theme',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称。;自定义主题对象。',
|
||||
'en-US': 'User-defined theme name. ;User-defined theme object.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'theme-name',
|
||||
type: 'string',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称,如果设置了 theme-name, 则 theme 无效',
|
||||
'en-US': 'User-defined theme name. If theme-name is set, the theme is invalid.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'tooltip-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示提示框',
|
||||
'en-US': 'Display dialog box'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width',
|
||||
type: 'string',
|
||||
defaultValue: "'auto'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的宽度。',
|
||||
'en-US': 'Set the width of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width-change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'300'",
|
||||
desc: {
|
||||
'zh-CN': '容器宽度变化的延迟',
|
||||
'en-US': 'Container width change delay'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '图表配置项(无法与settings混用)',
|
||||
'en-US': 'Chart Configuration item (cannot be used together with settings)'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
}
|
||||
],
|
||||
|
||||
events: [],
|
||||
methods: [],
|
||||
slots: []
|
||||
}
|
||||
],
|
||||
types: [
|
||||
{
|
||||
name: 'IChartProps',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartProps {
|
||||
afterConfig: () => void
|
||||
afterSetOption: () => void
|
||||
afterSetOptionOnce: () => void
|
||||
animation: object
|
||||
axisPointer: object | array
|
||||
backgroundColor: object | string
|
||||
beforeConfig: () => void
|
||||
brush: object | array
|
||||
cancelResizeCheck: boolean
|
||||
changeDelay: number // 默认值 0
|
||||
colorMode: string
|
||||
colors: array
|
||||
data: object | array
|
||||
dataEmpty: boolean
|
||||
dataZoom: object | array
|
||||
events: object
|
||||
extend: object
|
||||
geo: object | array
|
||||
graphic: object | array
|
||||
grid: object | array
|
||||
height: string // 默认值 '400px'
|
||||
initOptions: object
|
||||
judgeWidth: boolean // 默认值 false
|
||||
legend: object | array
|
||||
legendPosition: string
|
||||
legendVisible: boolean // 默认值 true
|
||||
loading: boolean
|
||||
markArea: object
|
||||
markLine: object
|
||||
markPoint: object
|
||||
notSetUnchange: array
|
||||
radar: object
|
||||
resizeDelay: number // 默认值 200
|
||||
resizeable: boolean // 默认值 true
|
||||
series: object | array
|
||||
setOptionOpts: boolean | object // 默认值 true
|
||||
settings: object
|
||||
textStyle: object | array
|
||||
theme: object
|
||||
themeName: object | string
|
||||
timeline: object | array
|
||||
title: object | array
|
||||
toolbox: object | array
|
||||
tooltip: object
|
||||
tooltipFormatter: () => void
|
||||
tooltipVisible: boolean // 默认值 true
|
||||
visualMap: object | array
|
||||
width: string // 默认值 'auto'
|
||||
widthChangeDelay: number // 默认值 300
|
||||
xAxis: object | array
|
||||
yAxis: object | array
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'IChartSettings',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartSettings {
|
||||
type: string // 图表类型,可选值' bar ',' histogram ',' line ',' pie ',' ring ',' funnel ',' radar ',' waterfall '
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'Options',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface Options {
|
||||
// 使用方法目前仅支持 eCharts 原生属性配置, 使用方法和 echarts 一致。 详细配置请参考https://echarts.apache.org/examples/zh/index.html#chart-type-map
|
||||
}`
|
||||
}
|
||||
]
|
||||
}
|
|
@ -0,0 +1,321 @@
|
|||
export default {
|
||||
mode: ['pc'],
|
||||
apis: [
|
||||
{
|
||||
name: 'chart',
|
||||
type: 'component',
|
||||
props: [
|
||||
{
|
||||
name: 'cancel-resize-check',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否禁用 resize 时的容器检测',
|
||||
'en-US': 'Whether to disable container detection during resize'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'0'",
|
||||
desc: {
|
||||
'zh-CN': '属性修改触发图表重绘回调的延迟',
|
||||
'en-US': 'Delay for triggering chart redrawing callback after attribute modification'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'data',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '数据由指标和维度组成,“维度” 指的是数据的属性,“指标” 是量化衡量标准',
|
||||
'en-US':
|
||||
'Data consists of indicators and dimensions. Dimension refers to data attributes, and indicator refers to quantitative measurement standards.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'events',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '事件绑定',
|
||||
'en-US': 'Event binding'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'extend',
|
||||
typeAnchorName: 'chart#IChartProps',
|
||||
type: 'IChartProps',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'echarts 的配置项',
|
||||
'en-US': 'Configuration items of echarts'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'height',
|
||||
type: 'string',
|
||||
defaultValue: "'400px'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的高度。',
|
||||
'en-US': 'Set the height of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'init-options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'init 附加参数',
|
||||
'en-US': 'Init Additional Parameters'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'judge-width',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否处理生成图表时的宽度问题',
|
||||
'en-US': 'Do you want to process the width issue when generating charts?'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'legend-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示图例',
|
||||
'en-US': 'Display legend'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'not-set-unchange',
|
||||
type: 'array',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '未发生变化时不参加 setOption 的属性',
|
||||
'en-US': 'The setOption attribute does not change.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
name: 'resize-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'200'",
|
||||
desc: {
|
||||
'zh-CN': '窗口 resize 事件回调的延迟',
|
||||
'en-US': 'Delay of the window resize event callback'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'resizeable',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否处理窗口 resize 事件',
|
||||
'en-US': 'Whether to process the window resize event'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'set-option-opts',
|
||||
type: 'boolean | object',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': 'echarts setOption 的第二个参数',
|
||||
'en-US': 'Echarts setOption second parameter'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
mode: []
|
||||
},
|
||||
{
|
||||
name: 'theme',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称。;自定义主题对象。',
|
||||
'en-US': 'User-defined theme name. ;User-defined theme object.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'theme-name',
|
||||
type: 'string',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称,如果设置了 theme-name, 则 theme 无效',
|
||||
'en-US': 'User-defined theme name. If theme-name is set, the theme is invalid.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'tooltip-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示提示框',
|
||||
'en-US': 'Display dialog box'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width',
|
||||
type: 'string',
|
||||
defaultValue: "'auto'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的宽度。',
|
||||
'en-US': 'Set the width of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width-change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'300'",
|
||||
desc: {
|
||||
'zh-CN': '容器宽度变化的延迟',
|
||||
'en-US': 'Container width change delay'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '图表配置项(无法与settings混用)',
|
||||
'en-US': 'Chart Configuration item (cannot be used together with settings)'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
}
|
||||
],
|
||||
|
||||
events: [],
|
||||
methods: [],
|
||||
slots: []
|
||||
}
|
||||
],
|
||||
types: [
|
||||
{
|
||||
name: 'IChartProps',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartProps {
|
||||
afterConfig: () => void
|
||||
afterSetOption: () => void
|
||||
afterSetOptionOnce: () => void
|
||||
animation: object
|
||||
axisPointer: object | array
|
||||
backgroundColor: object | string
|
||||
beforeConfig: () => void
|
||||
brush: object | array
|
||||
cancelResizeCheck: boolean
|
||||
changeDelay: number // 默认值 0
|
||||
colorMode: string
|
||||
colors: array
|
||||
data: object | array
|
||||
dataEmpty: boolean
|
||||
dataZoom: object | array
|
||||
events: object
|
||||
extend: object
|
||||
geo: object | array
|
||||
graphic: object | array
|
||||
grid: object | array
|
||||
height: string // 默认值 '400px'
|
||||
initOptions: object
|
||||
judgeWidth: boolean // 默认值 false
|
||||
legend: object | array
|
||||
legendPosition: string
|
||||
legendVisible: boolean // 默认值 true
|
||||
loading: boolean
|
||||
markArea: object
|
||||
markLine: object
|
||||
markPoint: object
|
||||
notSetUnchange: array
|
||||
radar: object
|
||||
resizeDelay: number // 默认值 200
|
||||
resizeable: boolean // 默认值 true
|
||||
series: object | array
|
||||
setOptionOpts: boolean | object // 默认值 true
|
||||
settings: object
|
||||
textStyle: object | array
|
||||
theme: object
|
||||
themeName: object | string
|
||||
timeline: object | array
|
||||
title: object | array
|
||||
toolbox: object | array
|
||||
tooltip: object
|
||||
tooltipFormatter: () => void
|
||||
tooltipVisible: boolean // 默认值 true
|
||||
visualMap: object | array
|
||||
width: string // 默认值 'auto'
|
||||
widthChangeDelay: number // 默认值 300
|
||||
xAxis: object | array
|
||||
yAxis: object | array
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'IChartSettings',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartSettings {
|
||||
type: string // 图表类型,可选值' bar ',' histogram ',' line ',' pie ',' ring ',' funnel ',' radar ',' waterfall '
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'Options',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface Options {
|
||||
theme: string // 主题, 默认值: cloud-light
|
||||
color: array | string // 颜色
|
||||
title: object // 中心文本配置
|
||||
legend: object // 图例配置, 默认显示
|
||||
tipHtml: function // 悬浮提示框内容配置, 默认显示
|
||||
tipHtmlStyle: object // 悬浮提示框样式配置, 默认值: { padding: [14,16] }
|
||||
event: object // 图表事件, 默认不触发
|
||||
data: array // 图表数据(必填)
|
||||
type: string // 圆盘图类型, 默认值: circle
|
||||
position: object // 图标位置及大小, 默认值: { center: ['50%','45%'], radius: ['44%', '50%'] }
|
||||
minAngle: number // 最小扇区角度
|
||||
silent: boolean // 是否关闭hover动效, 默认值: false
|
||||
label: object // 外侧文本配置, 默认显示
|
||||
itemStyle: object // 图表数据点文本样式, 默认值: { borderColor: '#ffffff', borderWidth: 3, borderRadius: 0 }
|
||||
stillShowZeroSum: boolean // 是否在数据和为0的时候仍显示扇区, 默认值: true
|
||||
selectedMode: boolean // 扇区选中模式配置, 默认值: false
|
||||
roseType: boolean // 是否展示成南丁格尔图, 默认值: false
|
||||
}`
|
||||
}
|
||||
]
|
||||
}
|
|
@ -0,0 +1,49 @@
|
|||
export default {
|
||||
mode: ['pc'],
|
||||
apis: [
|
||||
{
|
||||
name: 'chart',
|
||||
type: 'component',
|
||||
props: [
|
||||
{
|
||||
name: 'options',
|
||||
type: 'object',
|
||||
defaultValue: '--',
|
||||
desc: {
|
||||
'zh-CN': '图表参数',
|
||||
'en-US': 'Whether to disable container detection during resize'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
}
|
||||
],
|
||||
events: [],
|
||||
methods: [],
|
||||
slots: []
|
||||
}
|
||||
],
|
||||
types: [
|
||||
{
|
||||
name: 'options',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface options {
|
||||
theme: string // 主题
|
||||
color: array | string // 颜色
|
||||
padding: array // 图表内边距值
|
||||
tipHtml: function // 悬浮提示框内容配置
|
||||
event: object // 图表事件
|
||||
data: array // 图表数据
|
||||
name: string // 图表名称(必填)
|
||||
unit: string // 进度图右侧文本单位
|
||||
barWidth: number // 进度图柱形宽度
|
||||
minWidth: string // 进度图单项数据的最小宽度
|
||||
calibrationValue: number // 进度图标定值
|
||||
label: object // 堆叠进度图图表图元文本样式
|
||||
state: object // 根据状态设置颜色
|
||||
title: object // 进度图图表标题样式
|
||||
text: object // 进度图图表右侧文本样式
|
||||
}`
|
||||
}
|
||||
]
|
||||
}
|
|
@ -0,0 +1,297 @@
|
|||
export default {
|
||||
mode: ['pc'],
|
||||
apis: [
|
||||
{
|
||||
name: 'chart',
|
||||
type: 'component',
|
||||
props: [
|
||||
{
|
||||
name: 'cancel-resize-check',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否禁用 resize 时的容器检测',
|
||||
'en-US': 'Whether to disable container detection during resize'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'0'",
|
||||
desc: {
|
||||
'zh-CN': '属性修改触发图表重绘回调的延迟',
|
||||
'en-US': 'Delay for triggering chart redrawing callback after attribute modification'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'data',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '数据由指标和维度组成,“维度” 指的是数据的属性,“指标” 是量化衡量标准',
|
||||
'en-US':
|
||||
'Data consists of indicators and dimensions. Dimension refers to data attributes, and indicator refers to quantitative measurement standards.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'events',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '事件绑定',
|
||||
'en-US': 'Event binding'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'extend',
|
||||
typeAnchorName: 'chart#IChartProps',
|
||||
type: 'IChartProps',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'echarts 的配置项',
|
||||
'en-US': 'Configuration items of echarts'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'height',
|
||||
type: 'string',
|
||||
defaultValue: "'400px'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的高度。',
|
||||
'en-US': 'Set the height of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'init-options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'init 附加参数',
|
||||
'en-US': 'Init Additional Parameters'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'judge-width',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否处理生成图表时的宽度问题',
|
||||
'en-US': 'Do you want to process the width issue when generating charts?'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'legend-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示图例',
|
||||
'en-US': 'Display legend'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'not-set-unchange',
|
||||
type: 'array',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '未发生变化时不参加 setOption 的属性',
|
||||
'en-US': 'The setOption attribute does not change.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
name: 'resize-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'200'",
|
||||
desc: {
|
||||
'zh-CN': '窗口 resize 事件回调的延迟',
|
||||
'en-US': 'Delay of the window resize event callback'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'resizeable',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否处理窗口 resize 事件',
|
||||
'en-US': 'Whether to process the window resize event'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'set-option-opts',
|
||||
type: 'boolean | object',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': 'echarts setOption 的第二个参数',
|
||||
'en-US': 'Echarts setOption second parameter'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
mode: []
|
||||
},
|
||||
{
|
||||
name: 'theme',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称。;自定义主题对象。',
|
||||
'en-US': 'User-defined theme name. ;User-defined theme object.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'theme-name',
|
||||
type: 'string',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称,如果设置了 theme-name, 则 theme 无效',
|
||||
'en-US': 'User-defined theme name. If theme-name is set, the theme is invalid.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'tooltip-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示提示框',
|
||||
'en-US': 'Display dialog box'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width',
|
||||
type: 'string',
|
||||
defaultValue: "'auto'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的宽度。',
|
||||
'en-US': 'Set the width of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width-change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'300'",
|
||||
desc: {
|
||||
'zh-CN': '容器宽度变化的延迟',
|
||||
'en-US': 'Container width change delay'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '图表配置项(无法与settings混用)',
|
||||
'en-US': 'Chart Configuration item (cannot be used together with settings)'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
}
|
||||
],
|
||||
|
||||
events: [],
|
||||
methods: [],
|
||||
slots: []
|
||||
}
|
||||
],
|
||||
types: [
|
||||
{
|
||||
name: 'IChartProps',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartProps {
|
||||
afterConfig: () => void
|
||||
afterSetOption: () => void
|
||||
afterSetOptionOnce: () => void
|
||||
animation: object
|
||||
axisPointer: object | array
|
||||
backgroundColor: object | string
|
||||
beforeConfig: () => void
|
||||
brush: object | array
|
||||
cancelResizeCheck: boolean
|
||||
changeDelay: number // 默认值 0
|
||||
colorMode: string
|
||||
colors: array
|
||||
data: object | array
|
||||
dataEmpty: boolean
|
||||
dataZoom: object | array
|
||||
events: object
|
||||
extend: object
|
||||
geo: object | array
|
||||
graphic: object | array
|
||||
grid: object | array
|
||||
height: string // 默认值 '400px'
|
||||
initOptions: object
|
||||
judgeWidth: boolean // 默认值 false
|
||||
legend: object | array
|
||||
legendPosition: string
|
||||
legendVisible: boolean // 默认值 true
|
||||
loading: boolean
|
||||
markArea: object
|
||||
markLine: object
|
||||
markPoint: object
|
||||
notSetUnchange: array
|
||||
radar: object
|
||||
resizeDelay: number // 默认值 200
|
||||
resizeable: boolean // 默认值 true
|
||||
series: object | array
|
||||
setOptionOpts: boolean | object // 默认值 true
|
||||
settings: object
|
||||
textStyle: object | array
|
||||
theme: object
|
||||
themeName: object | string
|
||||
timeline: object | array
|
||||
title: object | array
|
||||
toolbox: object | array
|
||||
tooltip: object
|
||||
tooltipFormatter: () => void
|
||||
tooltipVisible: boolean // 默认值 true
|
||||
visualMap: object | array
|
||||
width: string // 默认值 'auto'
|
||||
widthChangeDelay: number // 默认值 300
|
||||
xAxis: object | array
|
||||
yAxis: object | array
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'IChartSettings',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartSettings {
|
||||
type: string // 图表类型,可选值' bar ',' histogram ',' line ',' pie ',' ring ',' funnel ',' radar ',' waterfall '
|
||||
}`
|
||||
}
|
||||
]
|
||||
}
|
|
@ -0,0 +1,319 @@
|
|||
export default {
|
||||
mode: ['pc'],
|
||||
apis: [
|
||||
{
|
||||
name: 'chart',
|
||||
type: 'component',
|
||||
props: [
|
||||
{
|
||||
name: 'cancel-resize-check',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否禁用 resize 时的容器检测',
|
||||
'en-US': 'Whether to disable container detection during resize'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'0'",
|
||||
desc: {
|
||||
'zh-CN': '属性修改触发图表重绘回调的延迟',
|
||||
'en-US': 'Delay for triggering chart redrawing callback after attribute modification'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'data',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '数据由指标和维度组成,“维度” 指的是数据的属性,“指标” 是量化衡量标准',
|
||||
'en-US':
|
||||
'Data consists of indicators and dimensions. Dimension refers to data attributes, and indicator refers to quantitative measurement standards.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'events',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '事件绑定',
|
||||
'en-US': 'Event binding'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'extend',
|
||||
typeAnchorName: 'chart#IChartProps',
|
||||
type: 'IChartProps',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'echarts 的配置项',
|
||||
'en-US': 'Configuration items of echarts'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'height',
|
||||
type: 'string',
|
||||
defaultValue: "'400px'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的高度。',
|
||||
'en-US': 'Set the height of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'init-options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'init 附加参数',
|
||||
'en-US': 'Init Additional Parameters'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'judge-width',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否处理生成图表时的宽度问题',
|
||||
'en-US': 'Do you want to process the width issue when generating charts?'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'legend-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示图例',
|
||||
'en-US': 'Display legend'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'not-set-unchange',
|
||||
type: 'array',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '未发生变化时不参加 setOption 的属性',
|
||||
'en-US': 'The setOption attribute does not change.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
name: 'resize-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'200'",
|
||||
desc: {
|
||||
'zh-CN': '窗口 resize 事件回调的延迟',
|
||||
'en-US': 'Delay of the window resize event callback'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'resizeable',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否处理窗口 resize 事件',
|
||||
'en-US': 'Whether to process the window resize event'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'set-option-opts',
|
||||
type: 'boolean | object',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': 'echarts setOption 的第二个参数',
|
||||
'en-US': 'Echarts setOption second parameter'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
mode: []
|
||||
},
|
||||
{
|
||||
name: 'theme',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称。;自定义主题对象。',
|
||||
'en-US': 'User-defined theme name. ;User-defined theme object.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'theme-name',
|
||||
type: 'string',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称,如果设置了 theme-name, 则 theme 无效',
|
||||
'en-US': 'User-defined theme name. If theme-name is set, the theme is invalid.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'tooltip-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示提示框',
|
||||
'en-US': 'Display dialog box'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width',
|
||||
type: 'string',
|
||||
defaultValue: "'auto'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的宽度。',
|
||||
'en-US': 'Set the width of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width-change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'300'",
|
||||
desc: {
|
||||
'zh-CN': '容器宽度变化的延迟',
|
||||
'en-US': 'Container width change delay'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '图表配置项(无法与settings混用)',
|
||||
'en-US': 'Chart Configuration item (cannot be used together with settings)'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
}
|
||||
],
|
||||
|
||||
events: [],
|
||||
methods: [],
|
||||
slots: []
|
||||
}
|
||||
],
|
||||
types: [
|
||||
{
|
||||
name: 'IChartProps',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartProps {
|
||||
afterConfig: () => void
|
||||
afterSetOption: () => void
|
||||
afterSetOptionOnce: () => void
|
||||
animation: object
|
||||
axisPointer: object | array
|
||||
backgroundColor: object | string
|
||||
beforeConfig: () => void
|
||||
brush: object | array
|
||||
cancelResizeCheck: boolean
|
||||
changeDelay: number // 默认值 0
|
||||
colorMode: string
|
||||
colors: array
|
||||
data: object | array
|
||||
dataEmpty: boolean
|
||||
dataZoom: object | array
|
||||
events: object
|
||||
extend: object
|
||||
geo: object | array
|
||||
graphic: object | array
|
||||
grid: object | array
|
||||
height: string // 默认值 '400px'
|
||||
initOptions: object
|
||||
judgeWidth: boolean // 默认值 false
|
||||
legend: object | array
|
||||
legendPosition: string
|
||||
legendVisible: boolean // 默认值 true
|
||||
loading: boolean
|
||||
markArea: object
|
||||
markLine: object
|
||||
markPoint: object
|
||||
notSetUnchange: array
|
||||
radar: object
|
||||
resizeDelay: number // 默认值 200
|
||||
resizeable: boolean // 默认值 true
|
||||
series: object | array
|
||||
setOptionOpts: boolean | object // 默认值 true
|
||||
settings: object
|
||||
textStyle: object | array
|
||||
theme: object
|
||||
themeName: object | string
|
||||
timeline: object | array
|
||||
title: object | array
|
||||
toolbox: object | array
|
||||
tooltip: object
|
||||
tooltipFormatter: () => void
|
||||
tooltipVisible: boolean // 默认值 true
|
||||
visualMap: object | array
|
||||
width: string // 默认值 'auto'
|
||||
widthChangeDelay: number // 默认值 300
|
||||
xAxis: object | array
|
||||
yAxis: object | array
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'IChartSettings',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartSettings {
|
||||
type: string // 图表类型,可选值' bar ',' histogram ',' line ',' pie ',' ring ',' funnel ',' radar ',' waterfall '
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'Options',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface Options {
|
||||
data: array // 图表数据(必填)
|
||||
theme: string // 主题, 默认值: cloud-light
|
||||
color: array | string // 颜色
|
||||
title: object // 中心文本配置
|
||||
unit: string // 单组数据雷达图的数据单位, 默认值: %
|
||||
legend: object // 图例配置, 默认显示
|
||||
tipHtml: function // 悬浮提示框内容配置, 默认显示
|
||||
markline: number | object // 阈值线配置
|
||||
radarMax: number | array // 最外圈代表的数值, 默认值: 坐标系的最外圈为数据中的最大值
|
||||
tipHtmlStyle: object // 悬浮提示框样式配置, 默认值: { padding: [14,16] }
|
||||
event: object // 图表事件, 默认不触发
|
||||
position: object // 图表位置, 默认不触发
|
||||
radarMark: boolean // 底部坐标系刻度值显示, 默认值: true
|
||||
radar: object // 雷达图的坐标系配置
|
||||
|
||||
}`
|
||||
}
|
||||
]
|
||||
}
|
|
@ -0,0 +1,321 @@
|
|||
export default {
|
||||
mode: ['pc'],
|
||||
apis: [
|
||||
{
|
||||
name: 'chart',
|
||||
type: 'component',
|
||||
props: [
|
||||
{
|
||||
name: 'cancel-resize-check',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否禁用 resize 时的容器检测',
|
||||
'en-US': 'Whether to disable container detection during resize'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'0'",
|
||||
desc: {
|
||||
'zh-CN': '属性修改触发图表重绘回调的延迟',
|
||||
'en-US': 'Delay for triggering chart redrawing callback after attribute modification'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'data',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '数据由指标和维度组成,“维度” 指的是数据的属性,“指标” 是量化衡量标准',
|
||||
'en-US':
|
||||
'Data consists of indicators and dimensions. Dimension refers to data attributes, and indicator refers to quantitative measurement standards.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'events',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '事件绑定',
|
||||
'en-US': 'Event binding'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'extend',
|
||||
typeAnchorName: 'chart#IChartProps',
|
||||
type: 'IChartProps',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'echarts 的配置项',
|
||||
'en-US': 'Configuration items of echarts'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'height',
|
||||
type: 'string',
|
||||
defaultValue: "'400px'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的高度。',
|
||||
'en-US': 'Set the height of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'init-options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'init 附加参数',
|
||||
'en-US': 'Init Additional Parameters'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'judge-width',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否处理生成图表时的宽度问题',
|
||||
'en-US': 'Do you want to process the width issue when generating charts?'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'legend-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示图例',
|
||||
'en-US': 'Display legend'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'not-set-unchange',
|
||||
type: 'array',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '未发生变化时不参加 setOption 的属性',
|
||||
'en-US': 'The setOption attribute does not change.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
name: 'resize-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'200'",
|
||||
desc: {
|
||||
'zh-CN': '窗口 resize 事件回调的延迟',
|
||||
'en-US': 'Delay of the window resize event callback'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'resizeable',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否处理窗口 resize 事件',
|
||||
'en-US': 'Whether to process the window resize event'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'set-option-opts',
|
||||
type: 'boolean | object',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': 'echarts setOption 的第二个参数',
|
||||
'en-US': 'Echarts setOption second parameter'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
mode: []
|
||||
},
|
||||
{
|
||||
name: 'theme',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称。;自定义主题对象。',
|
||||
'en-US': 'User-defined theme name. ;User-defined theme object.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'theme-name',
|
||||
type: 'string',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称,如果设置了 theme-name, 则 theme 无效',
|
||||
'en-US': 'User-defined theme name. If theme-name is set, the theme is invalid.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'tooltip-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示提示框',
|
||||
'en-US': 'Display dialog box'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width',
|
||||
type: 'string',
|
||||
defaultValue: "'auto'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的宽度。',
|
||||
'en-US': 'Set the width of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width-change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'300'",
|
||||
desc: {
|
||||
'zh-CN': '容器宽度变化的延迟',
|
||||
'en-US': 'Container width change delay'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '图表配置项(无法与settings混用)',
|
||||
'en-US': 'Chart Configuration item (cannot be used together with settings)'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
}
|
||||
],
|
||||
|
||||
events: [],
|
||||
methods: [],
|
||||
slots: []
|
||||
}
|
||||
],
|
||||
types: [
|
||||
{
|
||||
name: 'IChartProps',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartProps {
|
||||
afterConfig: () => void
|
||||
afterSetOption: () => void
|
||||
afterSetOptionOnce: () => void
|
||||
animation: object
|
||||
axisPointer: object | array
|
||||
backgroundColor: object | string
|
||||
beforeConfig: () => void
|
||||
brush: object | array
|
||||
cancelResizeCheck: boolean
|
||||
changeDelay: number // 默认值 0
|
||||
colorMode: string
|
||||
colors: array
|
||||
data: object | array
|
||||
dataEmpty: boolean
|
||||
dataZoom: object | array
|
||||
events: object
|
||||
extend: object
|
||||
geo: object | array
|
||||
graphic: object | array
|
||||
grid: object | array
|
||||
height: string // 默认值 '400px'
|
||||
initOptions: object
|
||||
judgeWidth: boolean // 默认值 false
|
||||
legend: object | array
|
||||
legendPosition: string
|
||||
legendVisible: boolean // 默认值 true
|
||||
loading: boolean
|
||||
markArea: object
|
||||
markLine: object
|
||||
markPoint: object
|
||||
notSetUnchange: array
|
||||
radar: object
|
||||
resizeDelay: number // 默认值 200
|
||||
resizeable: boolean // 默认值 true
|
||||
series: object | array
|
||||
setOptionOpts: boolean | object // 默认值 true
|
||||
settings: object
|
||||
textStyle: object | array
|
||||
theme: object
|
||||
themeName: object | string
|
||||
timeline: object | array
|
||||
title: object | array
|
||||
toolbox: object | array
|
||||
tooltip: object
|
||||
tooltipFormatter: () => void
|
||||
tooltipVisible: boolean // 默认值 true
|
||||
visualMap: object | array
|
||||
width: string // 默认值 'auto'
|
||||
widthChangeDelay: number // 默认值 300
|
||||
xAxis: object | array
|
||||
yAxis: object | array
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'IChartSettings',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartSettings {
|
||||
type: string // 图表类型,可选值' bar ',' histogram ',' line ',' pie ',' ring ',' funnel ',' radar ',' waterfall '
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'Options',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface Options {
|
||||
theme: string // 主题, 默认值: cloud-light
|
||||
color: array | string // 颜色
|
||||
title: object // 中心文本配置
|
||||
legend: object // 图例配置, 默认显示
|
||||
tipHtml: function // 悬浮提示框内容配置, 默认显示
|
||||
tipHtmlStyle: object // 悬浮提示框样式配置, 默认值: { padding: [14,16] }
|
||||
event: object // 图表事件, 默认不触发
|
||||
data: array // 图表数据(必填)
|
||||
type: string // 圆盘图类型, 默认值: circle
|
||||
position: object // 图标位置及大小, 默认值: { center: ['50%','45%'], radius: ['44%', '50%'] }
|
||||
minAngle: number // 最小扇区角度
|
||||
silent: boolean // 是否关闭hover动效, 默认值: false
|
||||
label: object // 外侧文本配置, 默认显示
|
||||
itemStyle: object // 图表数据点文本样式, 默认值: { borderColor: '#ffffff', borderWidth: 3, borderRadius: 0 }
|
||||
stillShowZeroSum: boolean // 是否在数据和为0的时候仍显示扇区, 默认值: true
|
||||
selectedMode: boolean // 扇区选中模式配置, 默认值: false
|
||||
roseType: boolean // 是否展示成南丁格尔图, 默认值: false
|
||||
}`
|
||||
}
|
||||
]
|
||||
}
|
|
@ -0,0 +1,322 @@
|
|||
export default {
|
||||
mode: ['pc'],
|
||||
apis: [
|
||||
{
|
||||
name: 'chart',
|
||||
type: 'component',
|
||||
props: [
|
||||
{
|
||||
name: 'cancel-resize-check',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否禁用 resize 时的容器检测',
|
||||
'en-US': 'Whether to disable container detection during resize'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'0'",
|
||||
desc: {
|
||||
'zh-CN': '属性修改触发图表重绘回调的延迟',
|
||||
'en-US': 'Delay for triggering chart redrawing callback after attribute modification'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'data',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '数据由指标和维度组成,“维度” 指的是数据的属性,“指标” 是量化衡量标准',
|
||||
'en-US':
|
||||
'Data consists of indicators and dimensions. Dimension refers to data attributes, and indicator refers to quantitative measurement standards.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'events',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '事件绑定',
|
||||
'en-US': 'Event binding'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'extend',
|
||||
typeAnchorName: 'chart#IChartProps',
|
||||
type: 'IChartProps',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'echarts 的配置项',
|
||||
'en-US': 'Configuration items of echarts'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'height',
|
||||
type: 'string',
|
||||
defaultValue: "'400px'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的高度。',
|
||||
'en-US': 'Set the height of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'init-options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'init 附加参数',
|
||||
'en-US': 'Init Additional Parameters'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'judge-width',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否处理生成图表时的宽度问题',
|
||||
'en-US': 'Do you want to process the width issue when generating charts?'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'legend-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示图例',
|
||||
'en-US': 'Display legend'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'not-set-unchange',
|
||||
type: 'array',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '未发生变化时不参加 setOption 的属性',
|
||||
'en-US': 'The setOption attribute does not change.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
name: 'resize-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'200'",
|
||||
desc: {
|
||||
'zh-CN': '窗口 resize 事件回调的延迟',
|
||||
'en-US': 'Delay of the window resize event callback'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'resizeable',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否处理窗口 resize 事件',
|
||||
'en-US': 'Whether to process the window resize event'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'set-option-opts',
|
||||
type: 'boolean | object',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': 'echarts setOption 的第二个参数',
|
||||
'en-US': 'Echarts setOption second parameter'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
mode: []
|
||||
},
|
||||
{
|
||||
name: 'theme',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称。;自定义主题对象。',
|
||||
'en-US': 'User-defined theme name. ;User-defined theme object.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'theme-name',
|
||||
type: 'string',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称,如果设置了 theme-name, 则 theme 无效',
|
||||
'en-US': 'User-defined theme name. If theme-name is set, the theme is invalid.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'tooltip-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示提示框',
|
||||
'en-US': 'Display dialog box'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width',
|
||||
type: 'string',
|
||||
defaultValue: "'auto'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的宽度。',
|
||||
'en-US': 'Set the width of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width-change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'300'",
|
||||
desc: {
|
||||
'zh-CN': '容器宽度变化的延迟',
|
||||
'en-US': 'Container width change delay'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '图表配置项(无法与settings混用)',
|
||||
'en-US': 'Chart Configuration item (cannot be used together with settings)'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
}
|
||||
],
|
||||
|
||||
events: [],
|
||||
methods: [],
|
||||
slots: []
|
||||
}
|
||||
],
|
||||
types: [
|
||||
{
|
||||
name: 'IChartProps',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartProps {
|
||||
afterConfig: () => void
|
||||
afterSetOption: () => void
|
||||
afterSetOptionOnce: () => void
|
||||
animation: object
|
||||
axisPointer: object | array
|
||||
backgroundColor: object | string
|
||||
beforeConfig: () => void
|
||||
brush: object | array
|
||||
cancelResizeCheck: boolean
|
||||
changeDelay: number // 默认值 0
|
||||
colorMode: string
|
||||
colors: array
|
||||
data: object | array
|
||||
dataEmpty: boolean
|
||||
dataZoom: object | array
|
||||
events: object
|
||||
extend: object
|
||||
geo: object | array
|
||||
graphic: object | array
|
||||
grid: object | array
|
||||
height: string // 默认值 '400px'
|
||||
initOptions: object
|
||||
judgeWidth: boolean // 默认值 false
|
||||
legend: object | array
|
||||
legendPosition: string
|
||||
legendVisible: boolean // 默认值 true
|
||||
loading: boolean
|
||||
markArea: object
|
||||
markLine: object
|
||||
markPoint: object
|
||||
notSetUnchange: array
|
||||
radar: object
|
||||
resizeDelay: number // 默认值 200
|
||||
resizeable: boolean // 默认值 true
|
||||
series: object | array
|
||||
setOptionOpts: boolean | object // 默认值 true
|
||||
settings: object
|
||||
textStyle: object | array
|
||||
theme: object
|
||||
themeName: object | string
|
||||
timeline: object | array
|
||||
title: object | array
|
||||
toolbox: object | array
|
||||
tooltip: object
|
||||
tooltipFormatter: () => void
|
||||
tooltipVisible: boolean // 默认值 true
|
||||
visualMap: object | array
|
||||
width: string // 默认值 'auto'
|
||||
widthChangeDelay: number // 默认值 300
|
||||
xAxis: object | array
|
||||
yAxis: object | array
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'IChartSettings',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartSettings {
|
||||
type: string // 图表类型,可选值' bar ',' histogram ',' line ',' pie ',' ring ',' funnel ',' radar ',' waterfall '
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'Options',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface Options {
|
||||
theme: string // 主题, 默认值: cloud-light
|
||||
color: array | string // 颜色
|
||||
padding: array // 图表内边距值, 默认值: [50,20,50,20]
|
||||
tipHtml: function // 悬浮提示框内容配置, 默认显示
|
||||
data: array // 图表数据(必填)
|
||||
dragggble: boolean // 页面节点是否可拖动, 默认值: true
|
||||
widthSpace: array // 节点矩形样式配置, 默认值: [10,30]
|
||||
nodeAlign: string // 桑基图中节点的对齐方式, 默认值: justify
|
||||
label: object // 节点矩形中文本标签的样式
|
||||
itemStyle: object // 节点矩形连接带的样式
|
||||
sortType: string // 空节点的展示状态, 默认值: node
|
||||
emptyStatus: string // 空节点的展示状态, 默认值: node
|
||||
series: array // echarts原生属性
|
||||
grid: object // echarts原生属性
|
||||
xAxis: array // echarts原生属性
|
||||
yAxis: object // echarts原生属性
|
||||
tooltip: object // echarts原生属性
|
||||
title: object // echarts原生属性
|
||||
}`
|
||||
}
|
||||
]
|
||||
}
|
|
@ -0,0 +1,327 @@
|
|||
export default {
|
||||
mode: ['pc'],
|
||||
apis: [
|
||||
{
|
||||
name: 'chart',
|
||||
type: 'component',
|
||||
props: [
|
||||
{
|
||||
name: 'cancel-resize-check',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否禁用 resize 时的容器检测',
|
||||
'en-US': 'Whether to disable container detection during resize'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'0'",
|
||||
desc: {
|
||||
'zh-CN': '属性修改触发图表重绘回调的延迟',
|
||||
'en-US': 'Delay for triggering chart redrawing callback after attribute modification'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'data',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '数据由指标和维度组成,“维度” 指的是数据的属性,“指标” 是量化衡量标准',
|
||||
'en-US':
|
||||
'Data consists of indicators and dimensions. Dimension refers to data attributes, and indicator refers to quantitative measurement standards.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'events',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '事件绑定',
|
||||
'en-US': 'Event binding'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'extend',
|
||||
typeAnchorName: 'chart#IChartProps',
|
||||
type: 'IChartProps',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'echarts 的配置项',
|
||||
'en-US': 'Configuration items of echarts'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'height',
|
||||
type: 'string',
|
||||
defaultValue: "'400px'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的高度。',
|
||||
'en-US': 'Set the height of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'init-options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'init 附加参数',
|
||||
'en-US': 'Init Additional Parameters'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'judge-width',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否处理生成图表时的宽度问题',
|
||||
'en-US': 'Do you want to process the width issue when generating charts?'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'legend-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示图例',
|
||||
'en-US': 'Display legend'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'not-set-unchange',
|
||||
type: 'array',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '未发生变化时不参加 setOption 的属性',
|
||||
'en-US': 'The setOption attribute does not change.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
name: 'resize-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'200'",
|
||||
desc: {
|
||||
'zh-CN': '窗口 resize 事件回调的延迟',
|
||||
'en-US': 'Delay of the window resize event callback'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'resizeable',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否处理窗口 resize 事件',
|
||||
'en-US': 'Whether to process the window resize event'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'set-option-opts',
|
||||
type: 'boolean | object',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': 'echarts setOption 的第二个参数',
|
||||
'en-US': 'Echarts setOption second parameter'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
mode: []
|
||||
},
|
||||
{
|
||||
name: 'theme',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称。;自定义主题对象。',
|
||||
'en-US': 'User-defined theme name. ;User-defined theme object.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'theme-name',
|
||||
type: 'string',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称,如果设置了 theme-name, 则 theme 无效',
|
||||
'en-US': 'User-defined theme name. If theme-name is set, the theme is invalid.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'tooltip-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示提示框',
|
||||
'en-US': 'Display dialog box'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width',
|
||||
type: 'string',
|
||||
defaultValue: "'auto'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的宽度。',
|
||||
'en-US': 'Set the width of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width-change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'300'",
|
||||
desc: {
|
||||
'zh-CN': '容器宽度变化的延迟',
|
||||
'en-US': 'Container width change delay'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '图表配置项(无法与settings混用)',
|
||||
'en-US': 'Chart Configuration item (cannot be used together with settings)'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
}
|
||||
],
|
||||
|
||||
events: [],
|
||||
methods: [],
|
||||
slots: []
|
||||
}
|
||||
],
|
||||
types: [
|
||||
{
|
||||
name: 'IChartProps',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartProps {
|
||||
afterConfig: () => void
|
||||
afterSetOption: () => void
|
||||
afterSetOptionOnce: () => void
|
||||
animation: object
|
||||
axisPointer: object | array
|
||||
backgroundColor: object | string
|
||||
beforeConfig: () => void
|
||||
brush: object | array
|
||||
cancelResizeCheck: boolean
|
||||
changeDelay: number // 默认值 0
|
||||
colorMode: string
|
||||
colors: array
|
||||
data: object | array
|
||||
dataEmpty: boolean
|
||||
dataZoom: object | array
|
||||
events: object
|
||||
extend: object
|
||||
geo: object | array
|
||||
graphic: object | array
|
||||
grid: object | array
|
||||
height: string // 默认值 '400px'
|
||||
initOptions: object
|
||||
judgeWidth: boolean // 默认值 false
|
||||
legend: object | array
|
||||
legendPosition: string
|
||||
legendVisible: boolean // 默认值 true
|
||||
loading: boolean
|
||||
markArea: object
|
||||
markLine: object
|
||||
markPoint: object
|
||||
notSetUnchange: array
|
||||
radar: object
|
||||
resizeDelay: number // 默认值 200
|
||||
resizeable: boolean // 默认值 true
|
||||
series: object | array
|
||||
setOptionOpts: boolean | object // 默认值 true
|
||||
settings: object
|
||||
textStyle: object | array
|
||||
theme: object
|
||||
themeName: object | string
|
||||
timeline: object | array
|
||||
title: object | array
|
||||
toolbox: object | array
|
||||
tooltip: object
|
||||
tooltipFormatter: () => void
|
||||
tooltipVisible: boolean // 默认值 true
|
||||
visualMap: object | array
|
||||
width: string // 默认值 'auto'
|
||||
widthChangeDelay: number // 默认值 300
|
||||
xAxis: object | array
|
||||
yAxis: object | array
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'IChartSettings',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartSettings {
|
||||
type: string // 图表类型,可选值' bar ',' histogram ',' line ',' pie ',' ring ',' funnel ',' radar ',' waterfall '
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'Options',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface Options {
|
||||
theme: string // 主题, 默认值: cloud-light
|
||||
color: array | string // 颜色
|
||||
padding: array // 图表内边距值, 默认值: [50,20,50,20]
|
||||
tipHtml: function // 悬浮提示框内容配置, 默认显示
|
||||
event: object // 图表事件, 默认不触发
|
||||
data: array // 图表数据(必填)
|
||||
bubbleSize: array // 气泡大小范围, 默认值: [10,70]
|
||||
trendLineConfig: object // 配置趋势线
|
||||
xAxis: object // 配置x轴坐标数据, 默认显示
|
||||
xAxisLine: object // 设置x轴样式(建议使用xAxis.line), 默认显示
|
||||
xAxisLabelRotate: number // x轴label旋转角度(建议使用xAxis.labelRotate)
|
||||
xAixsInterval: number | function // 配置x轴label间距(建议使用xAxis.interval), 默认值: 0
|
||||
xAxisFullGrid: boolean // x轴坐标是否顶格(建议使用xAxis.fullGrid), 默认值: false
|
||||
xAxisName: string // 配置x轴文本(建议使用xAxis.name)
|
||||
yAxisName: string // 配置y轴文本
|
||||
xAxisType: string // x轴类型
|
||||
symbol: string // 节点图形类型, 默认值: circle
|
||||
symbolRotate: number // 节点图形旋转角度, 默认值: 0
|
||||
symbolOffset: array // 节点图形偏移
|
||||
cursor: string // 鼠标悬浮在节点图形的样式, 默认值: pointer
|
||||
label: object // 节点图形的文本样式, 此属性配置和echarts一致
|
||||
itemStyle: object // 节点图形的样式, 此属性配置和echarts一致
|
||||
emphasis: object // 高亮的图形和标签样式, 此属性配置和echarts一致
|
||||
}`
|
||||
}
|
||||
]
|
||||
}
|
|
@ -0,0 +1,311 @@
|
|||
export default {
|
||||
mode: ['pc'],
|
||||
apis: [
|
||||
{
|
||||
name: 'chart',
|
||||
type: 'component',
|
||||
props: [
|
||||
{
|
||||
name: 'cancel-resize-check',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否禁用 resize 时的容器检测',
|
||||
'en-US': 'Whether to disable container detection during resize'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'0'",
|
||||
desc: {
|
||||
'zh-CN': '属性修改触发图表重绘回调的延迟',
|
||||
'en-US': 'Delay for triggering chart redrawing callback after attribute modification'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'data',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '数据由指标和维度组成,“维度” 指的是数据的属性,“指标” 是量化衡量标准',
|
||||
'en-US':
|
||||
'Data consists of indicators and dimensions. Dimension refers to data attributes, and indicator refers to quantitative measurement standards.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'events',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '事件绑定',
|
||||
'en-US': 'Event binding'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'extend',
|
||||
typeAnchorName: 'chart#IChartProps',
|
||||
type: 'IChartProps',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'echarts 的配置项',
|
||||
'en-US': 'Configuration items of echarts'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'height',
|
||||
type: 'string',
|
||||
defaultValue: "'400px'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的高度。',
|
||||
'en-US': 'Set the height of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'init-options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'init 附加参数',
|
||||
'en-US': 'Init Additional Parameters'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'judge-width',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否处理生成图表时的宽度问题',
|
||||
'en-US': 'Do you want to process the width issue when generating charts?'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'legend-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示图例',
|
||||
'en-US': 'Display legend'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'not-set-unchange',
|
||||
type: 'array',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '未发生变化时不参加 setOption 的属性',
|
||||
'en-US': 'The setOption attribute does not change.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
name: 'resize-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'200'",
|
||||
desc: {
|
||||
'zh-CN': '窗口 resize 事件回调的延迟',
|
||||
'en-US': 'Delay of the window resize event callback'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'resizeable',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否处理窗口 resize 事件',
|
||||
'en-US': 'Whether to process the window resize event'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'set-option-opts',
|
||||
type: 'boolean | object',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': 'echarts setOption 的第二个参数',
|
||||
'en-US': 'Echarts setOption second parameter'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
mode: []
|
||||
},
|
||||
{
|
||||
name: 'theme',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称。;自定义主题对象。',
|
||||
'en-US': 'User-defined theme name. ;User-defined theme object.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'theme-name',
|
||||
type: 'string',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称,如果设置了 theme-name, 则 theme 无效',
|
||||
'en-US': 'User-defined theme name. If theme-name is set, the theme is invalid.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'tooltip-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示提示框',
|
||||
'en-US': 'Display dialog box'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width',
|
||||
type: 'string',
|
||||
defaultValue: "'auto'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的宽度。',
|
||||
'en-US': 'Set the width of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width-change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'300'",
|
||||
desc: {
|
||||
'zh-CN': '容器宽度变化的延迟',
|
||||
'en-US': 'Container width change delay'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '图表配置项(无法与settings混用)',
|
||||
'en-US': 'Chart Configuration item (cannot be used together with settings)'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
}
|
||||
],
|
||||
|
||||
events: [],
|
||||
methods: [],
|
||||
slots: []
|
||||
}
|
||||
],
|
||||
types: [
|
||||
{
|
||||
name: 'IChartProps',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartProps {
|
||||
afterConfig: () => void
|
||||
afterSetOption: () => void
|
||||
afterSetOptionOnce: () => void
|
||||
animation: object
|
||||
axisPointer: object | array
|
||||
backgroundColor: object | string
|
||||
beforeConfig: () => void
|
||||
brush: object | array
|
||||
cancelResizeCheck: boolean
|
||||
changeDelay: number // 默认值 0
|
||||
colorMode: string
|
||||
colors: array
|
||||
data: object | array
|
||||
dataEmpty: boolean
|
||||
dataZoom: object | array
|
||||
events: object
|
||||
extend: object
|
||||
geo: object | array
|
||||
graphic: object | array
|
||||
grid: object | array
|
||||
height: string // 默认值 '400px'
|
||||
initOptions: object
|
||||
judgeWidth: boolean // 默认值 false
|
||||
legend: object | array
|
||||
legendPosition: string
|
||||
legendVisible: boolean // 默认值 true
|
||||
loading: boolean
|
||||
markArea: object
|
||||
markLine: object
|
||||
markPoint: object
|
||||
notSetUnchange: array
|
||||
radar: object
|
||||
resizeDelay: number // 默认值 200
|
||||
resizeable: boolean // 默认值 true
|
||||
series: object | array
|
||||
setOptionOpts: boolean | object // 默认值 true
|
||||
settings: object
|
||||
textStyle: object | array
|
||||
theme: object
|
||||
themeName: object | string
|
||||
timeline: object | array
|
||||
title: object | array
|
||||
toolbox: object | array
|
||||
tooltip: object
|
||||
tooltipFormatter: () => void
|
||||
tooltipVisible: boolean // 默认值 true
|
||||
visualMap: object | array
|
||||
width: string // 默认值 'auto'
|
||||
widthChangeDelay: number // 默认值 300
|
||||
xAxis: object | array
|
||||
yAxis: object | array
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'IChartSettings',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartSettings {
|
||||
type: string // 图表类型,可选值' bar ',' histogram ',' line ',' pie ',' ring ',' funnel ',' radar ',' waterfall '
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'Options',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface Options {
|
||||
theme: string // 主题, 默认值: cloud-light
|
||||
color: array | string // 颜色
|
||||
tipHtml: function // 悬浮提示框内容配置, 默认显示
|
||||
tipHtmlStyle: object // 悬浮提示框样式配置, 默认值: { padding: [14,16] }
|
||||
event: object // 图表事件, 默认不触发
|
||||
data: array // 图表数据(必填)
|
||||
series: object // 图表series
|
||||
}`
|
||||
}
|
||||
]
|
||||
}
|
|
@ -0,0 +1,313 @@
|
|||
export default {
|
||||
mode: ['pc'],
|
||||
apis: [
|
||||
{
|
||||
name: 'chart',
|
||||
type: 'component',
|
||||
props: [
|
||||
{
|
||||
name: 'cancel-resize-check',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否禁用 resize 时的容器检测',
|
||||
'en-US': 'Whether to disable container detection during resize'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'0'",
|
||||
desc: {
|
||||
'zh-CN': '属性修改触发图表重绘回调的延迟',
|
||||
'en-US': 'Delay for triggering chart redrawing callback after attribute modification'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'data',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '数据由指标和维度组成,“维度” 指的是数据的属性,“指标” 是量化衡量标准',
|
||||
'en-US':
|
||||
'Data consists of indicators and dimensions. Dimension refers to data attributes, and indicator refers to quantitative measurement standards.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'events',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '事件绑定',
|
||||
'en-US': 'Event binding'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'extend',
|
||||
typeAnchorName: 'chart#IChartProps',
|
||||
type: 'IChartProps',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'echarts 的配置项',
|
||||
'en-US': 'Configuration items of echarts'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'height',
|
||||
type: 'string',
|
||||
defaultValue: "'400px'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的高度。',
|
||||
'en-US': 'Set the height of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'init-options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'init 附加参数',
|
||||
'en-US': 'Init Additional Parameters'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'judge-width',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否处理生成图表时的宽度问题',
|
||||
'en-US': 'Do you want to process the width issue when generating charts?'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'legend-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示图例',
|
||||
'en-US': 'Display legend'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'not-set-unchange',
|
||||
type: 'array',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '未发生变化时不参加 setOption 的属性',
|
||||
'en-US': 'The setOption attribute does not change.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
name: 'resize-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'200'",
|
||||
desc: {
|
||||
'zh-CN': '窗口 resize 事件回调的延迟',
|
||||
'en-US': 'Delay of the window resize event callback'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'resizeable',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否处理窗口 resize 事件',
|
||||
'en-US': 'Whether to process the window resize event'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'set-option-opts',
|
||||
type: 'boolean | object',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': 'echarts setOption 的第二个参数',
|
||||
'en-US': 'Echarts setOption second parameter'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
mode: []
|
||||
},
|
||||
{
|
||||
name: 'theme',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称。;自定义主题对象。',
|
||||
'en-US': 'User-defined theme name. ;User-defined theme object.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'theme-name',
|
||||
type: 'string',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称,如果设置了 theme-name, 则 theme 无效',
|
||||
'en-US': 'User-defined theme name. If theme-name is set, the theme is invalid.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'tooltip-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示提示框',
|
||||
'en-US': 'Display dialog box'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width',
|
||||
type: 'string',
|
||||
defaultValue: "'auto'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的宽度。',
|
||||
'en-US': 'Set the width of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width-change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'300'",
|
||||
desc: {
|
||||
'zh-CN': '容器宽度变化的延迟',
|
||||
'en-US': 'Container width change delay'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '图表配置项(无法与settings混用)',
|
||||
'en-US': 'Chart Configuration item (cannot be used together with settings)'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
}
|
||||
],
|
||||
|
||||
events: [],
|
||||
methods: [],
|
||||
slots: []
|
||||
}
|
||||
],
|
||||
types: [
|
||||
{
|
||||
name: 'IChartProps',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartProps {
|
||||
afterConfig: () => void
|
||||
afterSetOption: () => void
|
||||
afterSetOptionOnce: () => void
|
||||
animation: object
|
||||
axisPointer: object | array
|
||||
backgroundColor: object | string
|
||||
beforeConfig: () => void
|
||||
brush: object | array
|
||||
cancelResizeCheck: boolean
|
||||
changeDelay: number // 默认值 0
|
||||
colorMode: string
|
||||
colors: array
|
||||
data: object | array
|
||||
dataEmpty: boolean
|
||||
dataZoom: object | array
|
||||
events: object
|
||||
extend: object
|
||||
geo: object | array
|
||||
graphic: object | array
|
||||
grid: object | array
|
||||
height: string // 默认值 '400px'
|
||||
initOptions: object
|
||||
judgeWidth: boolean // 默认值 false
|
||||
legend: object | array
|
||||
legendPosition: string
|
||||
legendVisible: boolean // 默认值 true
|
||||
loading: boolean
|
||||
markArea: object
|
||||
markLine: object
|
||||
markPoint: object
|
||||
notSetUnchange: array
|
||||
radar: object
|
||||
resizeDelay: number // 默认值 200
|
||||
resizeable: boolean // 默认值 true
|
||||
series: object | array
|
||||
setOptionOpts: boolean | object // 默认值 true
|
||||
settings: object
|
||||
textStyle: object | array
|
||||
theme: object
|
||||
themeName: object | string
|
||||
timeline: object | array
|
||||
title: object | array
|
||||
toolbox: object | array
|
||||
tooltip: object
|
||||
tooltipFormatter: () => void
|
||||
tooltipVisible: boolean // 默认值 true
|
||||
visualMap: object | array
|
||||
width: string // 默认值 'auto'
|
||||
widthChangeDelay: number // 默认值 300
|
||||
xAxis: object | array
|
||||
yAxis: object | array
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'IChartSettings',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartSettings {
|
||||
type: string // 图表类型,可选值' bar ',' histogram ',' line ',' pie ',' ring ',' funnel ',' radar ',' waterfall '
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'Options',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface Options {
|
||||
theme: string // 主题, 默认值: cloud-light
|
||||
padding: array // 图表内边距值, 默认值: [50,20,50,20]
|
||||
tipHtml: function // 悬浮提示框内容配置, 默认显示
|
||||
data: array // 图表数据(必填)
|
||||
type: string // 树图类型
|
||||
direction: string // 线性树图起点方向, 默认值: left
|
||||
symbolSize: number // 树图树元大小, 默认值: 10
|
||||
lineType: string // 线性树图连线形状, 默认值: curve
|
||||
initialTreeDepth: number // 树图初始展开层级, 默认值: 1
|
||||
}`
|
||||
}
|
||||
]
|
||||
}
|
|
@ -0,0 +1,326 @@
|
|||
export default {
|
||||
mode: ['pc'],
|
||||
apis: [
|
||||
{
|
||||
name: 'chart',
|
||||
type: 'component',
|
||||
props: [
|
||||
{
|
||||
name: 'cancel-resize-check',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否禁用 resize 时的容器检测',
|
||||
'en-US': 'Whether to disable container detection during resize'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'0'",
|
||||
desc: {
|
||||
'zh-CN': '属性修改触发图表重绘回调的延迟',
|
||||
'en-US': 'Delay for triggering chart redrawing callback after attribute modification'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'data',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '数据由指标和维度组成,“维度” 指的是数据的属性,“指标” 是量化衡量标准',
|
||||
'en-US':
|
||||
'Data consists of indicators and dimensions. Dimension refers to data attributes, and indicator refers to quantitative measurement standards.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'events',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '事件绑定',
|
||||
'en-US': 'Event binding'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'extend',
|
||||
typeAnchorName: 'chart#IChartProps',
|
||||
type: 'IChartProps',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'echarts 的配置项',
|
||||
'en-US': 'Configuration items of echarts'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'height',
|
||||
type: 'string',
|
||||
defaultValue: "'400px'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的高度。',
|
||||
'en-US': 'Set the height of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'init-options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'init 附加参数',
|
||||
'en-US': 'Init Additional Parameters'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'judge-width',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否处理生成图表时的宽度问题',
|
||||
'en-US': 'Do you want to process the width issue when generating charts?'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'legend-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示图例',
|
||||
'en-US': 'Display legend'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'not-set-unchange',
|
||||
type: 'array',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '未发生变化时不参加 setOption 的属性',
|
||||
'en-US': 'The setOption attribute does not change.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
name: 'resize-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'200'",
|
||||
desc: {
|
||||
'zh-CN': '窗口 resize 事件回调的延迟',
|
||||
'en-US': 'Delay of the window resize event callback'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'resizeable',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否处理窗口 resize 事件',
|
||||
'en-US': 'Whether to process the window resize event'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'set-option-opts',
|
||||
type: 'boolean | object',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': 'echarts setOption 的第二个参数',
|
||||
'en-US': 'Echarts setOption second parameter'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
mode: []
|
||||
},
|
||||
{
|
||||
name: 'theme',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称。;自定义主题对象。',
|
||||
'en-US': 'User-defined theme name. ;User-defined theme object.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'theme-name',
|
||||
type: 'string',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称,如果设置了 theme-name, 则 theme 无效',
|
||||
'en-US': 'User-defined theme name. If theme-name is set, the theme is invalid.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'tooltip-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示提示框',
|
||||
'en-US': 'Display dialog box'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width',
|
||||
type: 'string',
|
||||
defaultValue: "'auto'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的宽度。',
|
||||
'en-US': 'Set the width of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width-change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'300'",
|
||||
desc: {
|
||||
'zh-CN': '容器宽度变化的延迟',
|
||||
'en-US': 'Container width change delay'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '图表配置项(无法与settings混用)',
|
||||
'en-US': 'Chart Configuration item (cannot be used together with settings)'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
}
|
||||
],
|
||||
|
||||
events: [],
|
||||
methods: [],
|
||||
slots: []
|
||||
}
|
||||
],
|
||||
types: [
|
||||
{
|
||||
name: 'IChartProps',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartProps {
|
||||
afterConfig: () => void
|
||||
afterSetOption: () => void
|
||||
afterSetOptionOnce: () => void
|
||||
animation: object
|
||||
axisPointer: object | array
|
||||
backgroundColor: object | string
|
||||
beforeConfig: () => void
|
||||
brush: object | array
|
||||
cancelResizeCheck: boolean
|
||||
changeDelay: number // 默认值 0
|
||||
colorMode: string
|
||||
colors: array
|
||||
data: object | array
|
||||
dataEmpty: boolean
|
||||
dataZoom: object | array
|
||||
events: object
|
||||
extend: object
|
||||
geo: object | array
|
||||
graphic: object | array
|
||||
grid: object | array
|
||||
height: string // 默认值 '400px'
|
||||
initOptions: object
|
||||
judgeWidth: boolean // 默认值 false
|
||||
legend: object | array
|
||||
legendPosition: string
|
||||
legendVisible: boolean // 默认值 true
|
||||
loading: boolean
|
||||
markArea: object
|
||||
markLine: object
|
||||
markPoint: object
|
||||
notSetUnchange: array
|
||||
radar: object
|
||||
resizeDelay: number // 默认值 200
|
||||
resizeable: boolean // 默认值 true
|
||||
series: object | array
|
||||
setOptionOpts: boolean | object // 默认值 true
|
||||
settings: object
|
||||
textStyle: object | array
|
||||
theme: object
|
||||
themeName: object | string
|
||||
timeline: object | array
|
||||
title: object | array
|
||||
toolbox: object | array
|
||||
tooltip: object
|
||||
tooltipFormatter: () => void
|
||||
tooltipVisible: boolean // 默认值 true
|
||||
visualMap: object | array
|
||||
width: string // 默认值 'auto'
|
||||
widthChangeDelay: number // 默认值 300
|
||||
xAxis: object | array
|
||||
yAxis: object | array
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'IChartSettings',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartSettings {
|
||||
type: string // 图表类型,可选值' bar ',' histogram ',' line ',' pie ',' ring ',' funnel ',' radar ',' waterfall '
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'Options',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface Options {
|
||||
theme: string // 主题, 默认值: cloud-light
|
||||
legend: object // 图例配置, 默认显示
|
||||
xAxis: string | object // 配置x轴, 默认值: 图表数据data数据中data[0]对象的第一个key值
|
||||
yAxis: array | object // 配置y轴, 默认值: [50,20,50,20]
|
||||
padding: array // 图表内边距值, 默认值: [50,20,50,20]
|
||||
color: array | string // 颜色
|
||||
tipHtml: function // 悬浮提示框内容配置, 默认显示
|
||||
tipHtmlStyle: object // 悬浮提示框样式配置, 默认值: { padding: [14,16] }
|
||||
dataZoom: object // 区域缩放轴配置, 默认不显示
|
||||
linearGradient: object // 线性渐变
|
||||
event: object // 图表事件, 默认不触发
|
||||
data: array // 图表数据(必填)
|
||||
type: string // 配置柱状图类型, 默认值: bar
|
||||
stepGradient: array // 柱体分段渐变
|
||||
axisPointer: object // 坐标指示器(数据背景区域样式),(支持 rgb 颜色、英文单词颜色、十六进制颜色), 默认值: rgba(25,25,25,0.08)
|
||||
topTipHtml: function // 顶部位置悬浮提示框, 默认不显示
|
||||
itemStyle: object // 图表数据点文本样式, 默认值: {barWidth: 8, barGap: '60%'}
|
||||
direction: string // 柱体方向, 默认值: vertical
|
||||
label: object | array // 柱体文本, 默认不显示
|
||||
lineDataName: array // 柱状图更改为折线图的数据名
|
||||
markline: object // 阈值线配置, 默认不显示
|
||||
|
||||
}`
|
||||
}
|
||||
]
|
||||
}
|
|
@ -0,0 +1,317 @@
|
|||
export default {
|
||||
mode: ['pc'],
|
||||
apis: [
|
||||
{
|
||||
name: 'chart',
|
||||
type: 'component',
|
||||
props: [
|
||||
{
|
||||
name: 'cancel-resize-check',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否禁用 resize 时的容器检测',
|
||||
'en-US': 'Whether to disable container detection during resize'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'0'",
|
||||
desc: {
|
||||
'zh-CN': '属性修改触发图表重绘回调的延迟',
|
||||
'en-US': 'Delay for triggering chart redrawing callback after attribute modification'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'data',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '数据由指标和维度组成,“维度” 指的是数据的属性,“指标” 是量化衡量标准',
|
||||
'en-US':
|
||||
'Data consists of indicators and dimensions. Dimension refers to data attributes, and indicator refers to quantitative measurement standards.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'events',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '事件绑定',
|
||||
'en-US': 'Event binding'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'extend',
|
||||
typeAnchorName: 'chart#IChartProps',
|
||||
type: 'IChartProps',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'echarts 的配置项',
|
||||
'en-US': 'Configuration items of echarts'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart'
|
||||
},
|
||||
{
|
||||
name: 'height',
|
||||
type: 'string',
|
||||
defaultValue: "'400px'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的高度。',
|
||||
'en-US': 'Set the height of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'init-options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'init 附加参数',
|
||||
'en-US': 'Init Additional Parameters'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'judge-width',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否处理生成图表时的宽度问题',
|
||||
'en-US': 'Do you want to process the width issue when generating charts?'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart-events'
|
||||
},
|
||||
{
|
||||
name: 'legend-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示图例',
|
||||
'en-US': 'Display legend'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'not-set-unchange',
|
||||
type: 'array',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '未发生变化时不参加 setOption 的属性',
|
||||
'en-US': 'The setOption attribute does not change.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
name: 'resize-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'200'",
|
||||
desc: {
|
||||
'zh-CN': '窗口 resize 事件回调的延迟',
|
||||
'en-US': 'Delay of the window resize event callback'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'resizeable',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否处理窗口 resize 事件',
|
||||
'en-US': 'Whether to process the window resize event'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'set-option-opts',
|
||||
type: 'boolean | object',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': 'echarts setOption 的第二个参数',
|
||||
'en-US': 'Echarts setOption second parameter'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
},
|
||||
{
|
||||
mode: []
|
||||
},
|
||||
{
|
||||
name: 'theme',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称。;自定义主题对象。',
|
||||
'en-US': 'User-defined theme name. ;User-defined theme object.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'theme-name',
|
||||
type: 'string',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义主题名称,如果设置了 theme-name, 则 theme 无效',
|
||||
'en-US': 'User-defined theme name. If theme-name is set, the theme is invalid.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart#base'
|
||||
},
|
||||
{
|
||||
name: 'tooltip-visible',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '是否显示提示框',
|
||||
'en-US': 'Display dialog box'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width',
|
||||
type: 'string',
|
||||
defaultValue: "'auto'",
|
||||
desc: {
|
||||
'zh-CN': '设置图表容器的宽度。',
|
||||
'en-US': 'Set the width of the chart container.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/attributes-demo#props-demo10'
|
||||
},
|
||||
{
|
||||
name: 'width-change-delay',
|
||||
type: 'number',
|
||||
defaultValue: "'300'",
|
||||
desc: {
|
||||
'zh-CN': '容器宽度变化的延迟',
|
||||
'en-US': 'Container width change delay'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
},
|
||||
{
|
||||
name: 'options',
|
||||
type: 'object',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '图表配置项(无法与settings混用)',
|
||||
'en-US': 'Chart Configuration item (cannot be used together with settings)'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
}
|
||||
],
|
||||
|
||||
events: [],
|
||||
methods: [],
|
||||
slots: []
|
||||
}
|
||||
],
|
||||
types: [
|
||||
{
|
||||
name: 'IChartProps',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartProps {
|
||||
afterConfig: () => void
|
||||
afterSetOption: () => void
|
||||
afterSetOptionOnce: () => void
|
||||
animation: object
|
||||
axisPointer: object | array
|
||||
backgroundColor: object | string
|
||||
beforeConfig: () => void
|
||||
brush: object | array
|
||||
cancelResizeCheck: boolean
|
||||
changeDelay: number // 默认值 0
|
||||
colorMode: string
|
||||
colors: array
|
||||
data: object | array
|
||||
dataEmpty: boolean
|
||||
dataZoom: object | array
|
||||
events: object
|
||||
extend: object
|
||||
geo: object | array
|
||||
graphic: object | array
|
||||
grid: object | array
|
||||
height: string // 默认值 '400px'
|
||||
initOptions: object
|
||||
judgeWidth: boolean // 默认值 false
|
||||
legend: object | array
|
||||
legendPosition: string
|
||||
legendVisible: boolean // 默认值 true
|
||||
loading: boolean
|
||||
markArea: object
|
||||
markLine: object
|
||||
markPoint: object
|
||||
notSetUnchange: array
|
||||
radar: object
|
||||
resizeDelay: number // 默认值 200
|
||||
resizeable: boolean // 默认值 true
|
||||
series: object | array
|
||||
setOptionOpts: boolean | object // 默认值 true
|
||||
settings: object
|
||||
textStyle: object | array
|
||||
theme: object
|
||||
themeName: object | string
|
||||
timeline: object | array
|
||||
title: object | array
|
||||
toolbox: object | array
|
||||
tooltip: object
|
||||
tooltipFormatter: () => void
|
||||
tooltipVisible: boolean // 默认值 true
|
||||
visualMap: object | array
|
||||
width: string // 默认值 'auto'
|
||||
widthChangeDelay: number // 默认值 300
|
||||
xAxis: object | array
|
||||
yAxis: object | array
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'IChartSettings',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IChartSettings {
|
||||
type: string // 图表类型,可选值' bar ',' histogram ',' line ',' pie ',' ring ',' funnel ',' radar ',' waterfall '
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'Options',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface Options {
|
||||
theme: string // 主题, 默认值: cloud-light
|
||||
color: array | string // 颜色
|
||||
tipHtml: function // 悬浮提示框内容配置, 默认显示
|
||||
data: array // 图表数据(必填)
|
||||
gridSize: number // 词云图文本间距, 默认值: 16
|
||||
sizeRange: array // 字体范围, 默认值: [14,60]
|
||||
rotationRange: array // 文字旋转范围, 默认值: [0,0]
|
||||
rotationStep: number // 文字旋转步值, 默认值: 0
|
||||
shape: string // 词云图形状, 默认值: circle
|
||||
width: string // 词云图宽度, 默认值: 75%
|
||||
height: string // 词云图高度, 默认值: 80%
|
||||
maskImage: string // 词云图形状图片配置
|
||||
textColor: function // 词云图文本颜色
|
||||
}`
|
||||
}
|
||||
]
|
||||
}
|
|
@ -161,10 +161,10 @@ export default {
|
|||
{
|
||||
name: 'resize',
|
||||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '实现窗口最大化',
|
||||
'en-US': 'Maximize windows'
|
||||
'zh-CN': '弹窗是否能切换全屏',
|
||||
'en-US': 'Whether the pop-up window can be switched to full screen'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'form-in-dialog'
|
||||
|
@ -245,6 +245,17 @@ export default {
|
|||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'dialog-width'
|
||||
},
|
||||
{
|
||||
name: 'dialog-transition',
|
||||
type: 'string',
|
||||
defaultValue: ``,
|
||||
desc: {
|
||||
'zh-CN': '启动弹出动效由小变大',
|
||||
'en-US': 'Startup pop-up effect from small to large'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'transition-effect'
|
||||
}
|
||||
],
|
||||
events: [
|
||||
|
@ -335,6 +346,18 @@ export default {
|
|||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'open-close-events'
|
||||
},
|
||||
{
|
||||
name: 'resize',
|
||||
typeAnchorName: 'IResizeEvent',
|
||||
type: '(ev: IResizeEvent) => void',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '弹窗大小变化时的事件,比如切换全屏状态时',
|
||||
'en-US': 'Event when the pop-up window size changes, for example, when the full-screen mode is switched.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'fullscreen'
|
||||
}
|
||||
],
|
||||
methods: [],
|
||||
|
@ -343,7 +366,7 @@ export default {
|
|||
name: 'default',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'Dialog 的内容',
|
||||
'zh-CN': 'Dialog 的内容插槽',
|
||||
'en-US': 'Dialog content'
|
||||
},
|
||||
mode: ['pc'],
|
||||
|
@ -353,7 +376,7 @@ export default {
|
|||
name: 'footer',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'Dialog 按钮操作区的内容',
|
||||
'zh-CN': 'Dialog 按钮操作区的内容插槽',
|
||||
'en-US': 'Dialog button operation area content'
|
||||
},
|
||||
mode: ['pc'],
|
||||
|
@ -363,7 +386,7 @@ export default {
|
|||
name: 'title',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': 'Dialog 标题区的内容',
|
||||
'zh-CN': 'Dialog 标题区的内容插槽',
|
||||
'en-US': 'Dialog content in the title area'
|
||||
},
|
||||
mode: ['pc'],
|
||||
|
@ -371,5 +394,19 @@ export default {
|
|||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
types: [
|
||||
{
|
||||
name: 'IResizeEvent',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IResizeEvent {
|
||||
// 当前的全屏状态
|
||||
fullscreen: boolean
|
||||
// 弹窗的元素
|
||||
dialog: HTMLElement
|
||||
}
|
||||
`
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
|
@ -362,6 +362,18 @@ export default {
|
|||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'nest-grid-multi'
|
||||
},
|
||||
{
|
||||
name: 'resize',
|
||||
typeAnchorName: 'IResizeEvent',
|
||||
type: '(ev: IResizeEvent) => void',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '弹窗大小变化时的事件,比如切换全屏状态时',
|
||||
'en-US': 'Event when the pop-up window size changes, for example, when the full-screen mode is switched.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: ''
|
||||
}
|
||||
],
|
||||
methods: [
|
||||
|
@ -637,6 +649,18 @@ newPageSize: number // 变更后分页大小
|
|||
currentPage: number // 当前所在页
|
||||
currentPageSize: number // 当前分页大小
|
||||
}`
|
||||
},
|
||||
{
|
||||
name: 'IResizeEvent',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface IResizeEvent {
|
||||
// 当前的全屏状态
|
||||
fullscreen: boolean
|
||||
// 弹窗的元素
|
||||
dialog: HTMLElement
|
||||
}
|
||||
`
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
|
@ -1,145 +0,0 @@
|
|||
export default {
|
||||
mode: ['mobile'],
|
||||
apis: [
|
||||
{
|
||||
name: 'Dialogbox',
|
||||
type: 'component',
|
||||
props: [
|
||||
{
|
||||
mode: []
|
||||
},
|
||||
{
|
||||
name: 'close-on-click-modal',
|
||||
type: 'Boolean',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN':
|
||||
'<p>是否可以通过点击遮罩层关闭弹窗,默认为 true ,可以在标签上设置:close-on-click-modal="false"不能通过点击遮罩层关闭弹窗。</p>',
|
||||
'en-US': 'Is show left arrow'
|
||||
},
|
||||
mode: ['mobile'],
|
||||
mobileDemo: 'close-on-click-modal'
|
||||
},
|
||||
{
|
||||
name: 'lock-scroll',
|
||||
type: 'Boolean',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '<p>Dialog弹出时是否禁用滚动条,该属性默认为true</p>',
|
||||
'en-US': 'Is show right arrow'
|
||||
},
|
||||
mode: ['mobile'],
|
||||
mobileDemo: 'lock-scroll'
|
||||
},
|
||||
{
|
||||
name: 'modal-append-to-body',
|
||||
type: 'Boolean',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN':
|
||||
'<p>遮罩层是否应用到 body 上,为 false 时遮罩层会应用到 DialogBox 的父元素上,该属性默认为true</p>',
|
||||
'en-US': 'Is show right text'
|
||||
},
|
||||
mode: ['mobile'],
|
||||
mobileDemo: 'slot-title'
|
||||
},
|
||||
{
|
||||
name: 'show-header',
|
||||
type: 'Boolean',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '<p>是否显示弹窗头部 header,默认值为 true 。</p>',
|
||||
'en-US': 'Is show left text'
|
||||
},
|
||||
mode: ['mobile'],
|
||||
mobileDemo: 'show-header'
|
||||
},
|
||||
{
|
||||
mode: []
|
||||
},
|
||||
{
|
||||
name: 'visible',
|
||||
type: 'String',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '<p>控制弹出框显示与关闭</p>',
|
||||
'en-US': 'set main-title'
|
||||
},
|
||||
mode: ['mobile'],
|
||||
mobileDemo: 'with-input'
|
||||
}
|
||||
],
|
||||
events: [
|
||||
{
|
||||
mode: []
|
||||
},
|
||||
{
|
||||
name: 'close',
|
||||
type: 'Function()',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '<p>Dialog 关闭的回调</p>',
|
||||
'en-US': 'Click'
|
||||
},
|
||||
mode: ['mobile'],
|
||||
mobileDemo: 'events-open-close'
|
||||
},
|
||||
{
|
||||
name: 'confirm',
|
||||
type: 'Function()',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '<p>Dialog 确定按钮的的回调</p>',
|
||||
'en-US': 'Click'
|
||||
},
|
||||
mode: ['mobile'],
|
||||
mobileDemo: 'cancel-confirm'
|
||||
},
|
||||
{
|
||||
name: 'open',
|
||||
type: 'Function()',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '<p>Dialog 打开的回调</p>',
|
||||
'en-US': 'Click'
|
||||
},
|
||||
mode: ['mobile'],
|
||||
mobileDemo: 'events-open-close'
|
||||
}
|
||||
],
|
||||
methods: [],
|
||||
slots: [
|
||||
{
|
||||
name: 'default',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '<p>Dialog 的内容</p>',
|
||||
'en-US': 'Click'
|
||||
},
|
||||
mode: ['mobile'],
|
||||
mobileDemo: 'slot-title'
|
||||
},
|
||||
{
|
||||
name: 'footer',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '<p>Dialog 按钮操作区的内容</p>',
|
||||
'en-US': 'Click'
|
||||
},
|
||||
mode: ['mobile'],
|
||||
mobileDemo: 'slot-footer'
|
||||
},
|
||||
{
|
||||
name: 'title',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '<p>Dialog 标题区的内容</p>',
|
||||
'en-US': 'Click'
|
||||
},
|
||||
mode: ['mobile'],
|
||||
mobileDemo: 'slot-title'
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
|
@ -11,7 +11,7 @@ export default {
|
|||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '弹窗关闭前的回调,返回 false 会阻止弹窗关闭',
|
||||
'en-US': 'hook before close the drawer, and block close when return false'
|
||||
'en-US': 'Hook before close the drawer, and block close when return false'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'before-close'
|
||||
|
@ -22,7 +22,7 @@ export default {
|
|||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '自定义 class 样式',
|
||||
'en-US': ''
|
||||
'en-US': 'Custom class style'
|
||||
},
|
||||
mode: ['mobile-first'],
|
||||
mfDemo: ''
|
||||
|
@ -32,8 +32,8 @@ export default {
|
|||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '控制抽屉开启或关闭宽度拖拽功能',
|
||||
'en-US': ''
|
||||
'zh-CN': '是否开启抽屉的宽度拖拽功能',
|
||||
'en-US': 'Whether to enable the drawer width drag function'
|
||||
},
|
||||
mode: ['pc', 'mobile-first'],
|
||||
pcDemo: 'dragable',
|
||||
|
@ -45,7 +45,8 @@ export default {
|
|||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '是否开启 flex 盒子布局,开启后内容区域元素自适应撑开高度,默认值为 false',
|
||||
'en-US': ''
|
||||
'en-US':
|
||||
'Whether to enable the flex box layout. The content area element adaptively expands its height when enabled. The default value is false'
|
||||
},
|
||||
mode: ['mobile-first'],
|
||||
mfDemo: ''
|
||||
|
@ -56,7 +57,7 @@ export default {
|
|||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '弹出面板是否锁定浏览器滚动条,默认值为 true',
|
||||
'en-US': ''
|
||||
'en-US': 'Whether the pop-up panel locks the browser scroll bar. The default value is true'
|
||||
},
|
||||
mode: ['mobile-first'],
|
||||
mfDemo: ''
|
||||
|
@ -66,8 +67,8 @@ export default {
|
|||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '控制遮罩层显示隐藏 ',
|
||||
'en-US': ''
|
||||
'zh-CN': '是否显示遮罩层',
|
||||
'en-US': 'Whether the mask layer is displayed'
|
||||
},
|
||||
mode: ['pc', 'mobile-first'],
|
||||
pcDemo: 'mask',
|
||||
|
@ -78,8 +79,9 @@ export default {
|
|||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '默认弹窗打开后,可以单击遮罩层关闭弹窗,设置 mask-closable 为 false 后将禁用该功能',
|
||||
'en-US': ''
|
||||
'zh-CN': '默认情况下,弹窗打开后,可以单击遮罩层关闭弹窗,设置 mask-closable 为 false 后将禁用该功能',
|
||||
'en-US':
|
||||
'By default, when the popup is open, you can close the popup by clicking the mask layer. Setting mask-closable to false disables this feature'
|
||||
},
|
||||
mode: ['pc', 'mobile-first'],
|
||||
pcDemo: 'mask-closable',
|
||||
|
@ -90,8 +92,8 @@ export default {
|
|||
type: "'left' | 'right' | 'top' | 'bottom' ",
|
||||
defaultValue: "'right'",
|
||||
desc: {
|
||||
'zh-CN': '添加 placement 属性设置抽屉的方向',
|
||||
'en-US': ''
|
||||
'zh-CN': '设置抽屉的方向',
|
||||
'en-US': 'Set the drawer orientation'
|
||||
},
|
||||
mode: ['pc', 'mobile-first'],
|
||||
pcDemo: 'placement',
|
||||
|
@ -102,8 +104,8 @@ export default {
|
|||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '控制关闭图标显示',
|
||||
'en-US': ''
|
||||
'zh-CN': '是否显示关闭图标',
|
||||
'en-US': 'Whether to display the close icon'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'show-close'
|
||||
|
@ -113,11 +115,11 @@ export default {
|
|||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '控制底部显示',
|
||||
'zh-CN': '是否显示底部',
|
||||
'en-US': ''
|
||||
},
|
||||
mode: ['pc', 'mobile-first'],
|
||||
pcDemo: 'show-footer',
|
||||
pcDemo: 'Show bottom or not',
|
||||
mfDemo: ''
|
||||
},
|
||||
{
|
||||
|
@ -125,8 +127,8 @@ export default {
|
|||
type: 'boolean',
|
||||
defaultValue: 'true',
|
||||
desc: {
|
||||
'zh-CN': '控制头部显示',
|
||||
'en-US': ''
|
||||
'zh-CN': '是否显示头部',
|
||||
'en-US': 'Show headers or not'
|
||||
},
|
||||
mode: ['pc', 'mobile-first'],
|
||||
pcDemo: 'show-header',
|
||||
|
@ -138,7 +140,7 @@ export default {
|
|||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '面板标题',
|
||||
'en-US': ''
|
||||
'en-US': 'Panel title'
|
||||
},
|
||||
mode: ['mobile-first'],
|
||||
mfDemo: ''
|
||||
|
@ -148,8 +150,8 @@ export default {
|
|||
type: 'boolean',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '控制抽屉显示与关闭',
|
||||
'en-US': ''
|
||||
'zh-CN': '控制抽屉的显示与关闭',
|
||||
'en-US': 'Control drawer display and close'
|
||||
},
|
||||
mode: ['pc', 'mobile-first'],
|
||||
pcDemo: 'basic-usage',
|
||||
|
@ -161,7 +163,7 @@ export default {
|
|||
defaultValue: "'500px'",
|
||||
desc: {
|
||||
'zh-CN': '设置抽屉的宽度',
|
||||
'en-US': ''
|
||||
'en-US': 'Set the width of the drawer'
|
||||
},
|
||||
mode: ['pc', 'mobile-first'],
|
||||
pcDemo: 'width',
|
||||
|
@ -173,7 +175,7 @@ export default {
|
|||
defaultValue: '2000',
|
||||
desc: {
|
||||
'zh-CN': '自定义堆叠顺序(对于某些特殊场景,比如被遮挡时可能会用到)',
|
||||
'en-US': ''
|
||||
'en-US': 'Custom stacking order (may be used in special scenarios, such as when occluded)'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'z-index'
|
||||
|
@ -186,7 +188,7 @@ export default {
|
|||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '关闭抽屉事件',
|
||||
'en-US': ''
|
||||
'en-US': 'Close drawer event'
|
||||
},
|
||||
mode: ['pc', 'mobile-first'],
|
||||
pcDemo: 'close-event',
|
||||
|
@ -198,7 +200,7 @@ export default {
|
|||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '确认事件,设置 :show-footer="true" 时有效',
|
||||
'en-US': ''
|
||||
'en-US': 'Confirm event. This event is emit only when show-footer="true" is set'
|
||||
},
|
||||
mode: ['pc', 'mobile-first'],
|
||||
pcDemo: 'confirm-event',
|
||||
|
@ -209,8 +211,8 @@ export default {
|
|||
type: '',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '面板显隐时触发',
|
||||
'en-US': ''
|
||||
'zh-CN': '抽屉显隐时触发',
|
||||
'en-US': 'Triggered when the drawer is displayed and hidden'
|
||||
},
|
||||
mode: ['mobile-first'],
|
||||
mfDemo: ''
|
||||
|
@ -222,8 +224,8 @@ export default {
|
|||
type: '',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '关闭面板',
|
||||
'en-US': ''
|
||||
'zh-CN': '关闭抽屉',
|
||||
'en-US': 'Close Drawer'
|
||||
},
|
||||
mode: ['mobile-first'],
|
||||
mfDemo: ''
|
||||
|
@ -233,8 +235,8 @@ export default {
|
|||
type: '',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '确认并关闭面板',
|
||||
'en-US': ''
|
||||
'zh-CN': '确认并关闭抽屉',
|
||||
'en-US': 'Confirm and close the drawer'
|
||||
},
|
||||
mode: ['mobile-first'],
|
||||
mfDemo: ''
|
||||
|
@ -243,11 +245,9 @@ export default {
|
|||
slots: [
|
||||
{
|
||||
name: 'default',
|
||||
type: '--',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '默认插槽',
|
||||
'en-US': ''
|
||||
'en-US': 'Default slot'
|
||||
},
|
||||
mode: ['pc', 'mobile-first'],
|
||||
pcDemo: 'default-slot',
|
||||
|
@ -255,11 +255,9 @@ export default {
|
|||
},
|
||||
{
|
||||
name: 'footer',
|
||||
type: '--',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '底部插槽',
|
||||
'en-US': ''
|
||||
'en-US': 'Footer slot'
|
||||
},
|
||||
mode: ['pc', 'mobile-first'],
|
||||
pcDemo: 'footer-slot',
|
||||
|
@ -267,11 +265,9 @@ export default {
|
|||
},
|
||||
{
|
||||
name: 'header',
|
||||
type: '--',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '头部插槽',
|
||||
'en-US': ''
|
||||
'en-US': 'header Slot'
|
||||
},
|
||||
mode: ['pc', 'mobile-first'],
|
||||
pcDemo: 'header-slot',
|
||||
|
@ -279,11 +275,9 @@ export default {
|
|||
},
|
||||
{
|
||||
name: 'header-right',
|
||||
type: '--',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '头部右侧插槽',
|
||||
'en-US': ''
|
||||
'en-US': 'header-right slot'
|
||||
},
|
||||
mode: ['pc', 'mobile-first'],
|
||||
pcDemo: 'header-right-slot',
|
||||
|
|
|
@ -327,6 +327,18 @@ export default {
|
|||
mode: ['mobile-first'],
|
||||
mfDemo: ''
|
||||
},
|
||||
{
|
||||
name: 'image-bg-color',
|
||||
type: 'string',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '配置 `list-type` 等于 `picture-single` 或 `picture-card` 模式下图片的背景色。',
|
||||
'en-US':
|
||||
'Configure the background color of the image when `list-type` is set to `picture-single` or `picture-card`.'
|
||||
},
|
||||
mode: ['mobile-first'],
|
||||
mfDemo: ''
|
||||
},
|
||||
{
|
||||
name: 'is-folder-title',
|
||||
type: 'Boolean',
|
||||
|
@ -1067,7 +1079,7 @@ interface IHeaders {
|
|||
name: 'IListType',
|
||||
type: 'type',
|
||||
code: `
|
||||
type IListType = 'text' | 'picture' | 'picture-card' | 'thumb' | 'saas'
|
||||
type IListType = 'text' | 'picture' | 'picture-card' | 'thumb' | 'saas' // saas为3.14.0版本新增
|
||||
`
|
||||
},
|
||||
{
|
||||
|
|
|
@ -602,6 +602,16 @@ export default {
|
|||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'error-label'
|
||||
},
|
||||
{
|
||||
name: 'prompt',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '强提示插槽',
|
||||
'en-US': 'Prompt slot'
|
||||
},
|
||||
mode: ['mobile-first'],
|
||||
mfDemo: 'prompt-slot'
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
|
@ -1,49 +0,0 @@
|
|||
export default {
|
||||
mode: ['pc'],
|
||||
apis: [
|
||||
{
|
||||
name: 'chart',
|
||||
type: 'component',
|
||||
props: [
|
||||
{
|
||||
name: 'options',
|
||||
type: 'object',
|
||||
defaultValue: '--',
|
||||
desc: {
|
||||
'zh-CN': '图表参数',
|
||||
'en-US': 'Whether to disable container detection during resize'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'chart/question#question-base'
|
||||
}
|
||||
],
|
||||
events: [],
|
||||
methods: [],
|
||||
slots: []
|
||||
}
|
||||
],
|
||||
types: [
|
||||
{
|
||||
name: 'options',
|
||||
type: 'interface',
|
||||
code: `
|
||||
interface options {
|
||||
theme: string // 主题
|
||||
color: array | string // 颜色
|
||||
padding: array // 图表内边距值
|
||||
tipHtml: function // 悬浮提示框内容配置
|
||||
event: object // 图表事件
|
||||
data: array // 图表数据
|
||||
name: string // 图表名称(必填)
|
||||
unit: string // 进度图右侧文本单位
|
||||
barWidth: number // 进度图柱形宽度
|
||||
minWidth: string // 进度图单项数据的最小宽度
|
||||
calibrationValue: number // 进度图标定值
|
||||
label: object // 堆叠进度图图表图元文本样式
|
||||
state: object // 根据状态设置颜色
|
||||
title: object // 进度图图表标题样式
|
||||
text: object // 进度图图表右侧文本样式
|
||||
}`
|
||||
}
|
||||
]
|
||||
}
|
|
@ -443,8 +443,9 @@ export default {
|
|||
type: 'number | string',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '窗口的宽度',
|
||||
'en-US': 'window width'
|
||||
'zh-CN': '窗口的宽度(设置宽度像素或者百分比,浏览器窗口大小改变可居中显示)',
|
||||
'en-US':
|
||||
'The width of the window(Set the width in pixels or percentages, and the browser window size can be changed to display in the center)'
|
||||
},
|
||||
mode: ['pc', 'mobile', 'mobile-first'],
|
||||
pcDemo: 'resize',
|
||||
|
|
|
@ -374,6 +374,8 @@ interface IPopperOption {
|
|||
bubbling: boolean // 是否监听元素所有上级有滚动元素的scroll事件,监听到则更新popper的位置。用于解决某些弹出层位置在页面滚动时,位置不正确的场景,默认false
|
||||
followReferenceHide: boolean // 当触发源隐藏时,自动隐藏弹出层,默认true
|
||||
removeOnDestroy: boolean // 弹出层消失后,是否移除弹出层的DOM元素,布尔false
|
||||
updateHiddenPopperOnScroll: boolean // 滚动过程中是否更新隐藏的弹出层位置
|
||||
boundariesElement: 'viewport' | 'body' | HTMLElement // 滚动过程中,弹出层的碰撞边界。 默认值为: 'viewport'
|
||||
}
|
||||
`
|
||||
},
|
||||
|
|
|
@ -5,6 +5,19 @@ export default {
|
|||
name: 'select',
|
||||
type: 'component',
|
||||
props: [
|
||||
{
|
||||
name: 'all-text',
|
||||
type: 'string',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '当下拉中显示全部时,自定义全部的显示文本。不指定时,则默认显示"全部"',
|
||||
'en-US':
|
||||
'When all is displayed in the drop-down list, you can customize the display text of all. If this parameter is not specified, All is displayed by default.'
|
||||
},
|
||||
mode: ['pc', 'mobile-first'],
|
||||
pcDemo: 'all-text',
|
||||
mfDemo: 'all-text'
|
||||
},
|
||||
{
|
||||
name: 'allow-copy',
|
||||
type: 'boolean',
|
||||
|
@ -598,13 +611,26 @@ export default {
|
|||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '是否展示多选框选中条数和总条数的占比',
|
||||
'zh-CN': '是否展示多选框选中条数和总条数的占比的文字提示',
|
||||
'en-US':
|
||||
'Display the proportion of the number of selected items and the total number of items in the multiple-choice box'
|
||||
},
|
||||
mode: ['pc', 'mobile-first'],
|
||||
pcDemo: 'collapse-tags',
|
||||
mfDemo: 'collapse-tags'
|
||||
},
|
||||
{
|
||||
name: 'show-limit-text',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN':
|
||||
'是否展示多选框开启多选限制选择数量时,选中条数和限制总条数的占比的文字提示。 该属性的优先级大于<code>show-proportion</code> 属性,同时设置只',
|
||||
'en-US':
|
||||
'Display the proportion of the number of selected items and the total number of items in the multiple-choice box'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'multiple'
|
||||
}
|
||||
],
|
||||
events: [
|
||||
|
|
|
@ -15,7 +15,7 @@ export default {
|
|||
'Customized interface. A Promise object is returned. This parameter is mandatory when the framework service is not used.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'fine-grained-mode'
|
||||
pcDemo: 'animation'
|
||||
},
|
||||
{
|
||||
name: 'avatar',
|
||||
|
@ -39,7 +39,7 @@ export default {
|
|||
'Customized interface. A Promise object is returned. This parameter is mandatory when the framework service is not used.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'custom-layout'
|
||||
pcDemo: 'loading-completed'
|
||||
},
|
||||
{
|
||||
name: 'rows',
|
||||
|
@ -77,7 +77,7 @@ export default {
|
|||
'en-US': 'Content displayed after the loading is complete'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'custom-layout'
|
||||
pcDemo: 'loading-completed'
|
||||
},
|
||||
{
|
||||
name: 'placeholder',
|
||||
|
@ -106,7 +106,7 @@ export default {
|
|||
'Customized interface. A Promise object is returned. This parameter is mandatory when the framework service is not used.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'fine-grained-mode'
|
||||
pcDemo: 'size'
|
||||
},
|
||||
{
|
||||
name: 'variant',
|
||||
|
|
|
@ -31,7 +31,8 @@ export default {
|
|||
},
|
||||
{
|
||||
name: 'title',
|
||||
type: 'string | array',
|
||||
type: 'string | ITitleType',
|
||||
typeAnchorName: 'ITitleType',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '设置数字内容标题',
|
||||
|
@ -41,18 +42,6 @@ export default {
|
|||
pcDemo: 'basic-usage',
|
||||
mfDemo: ''
|
||||
},
|
||||
{
|
||||
name: 'group-separator',
|
||||
type: 'string',
|
||||
defaultValue: ',',
|
||||
desc: {
|
||||
'zh-CN': '设置千分位标志符',
|
||||
'en-US': 'Set Millennial Flag'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'basic-usage',
|
||||
mfDemo: ''
|
||||
},
|
||||
{
|
||||
name: 'prefix',
|
||||
type: 'string',
|
||||
|
@ -77,28 +66,16 @@ export default {
|
|||
pcDemo: 'basic-usage',
|
||||
mfDemo: ''
|
||||
},
|
||||
{
|
||||
name: 'formatter',
|
||||
type: '(value) => {}',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '设置自定义数字格式化',
|
||||
'en-US': 'Set custom number formatting'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'basic-usage',
|
||||
mfDemo: ''
|
||||
},
|
||||
{
|
||||
name: 'value-style',
|
||||
type: 'string | object | array',
|
||||
type: 'object | array',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '设置数字样式',
|
||||
'en-US': 'Set Number Style'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'basic-usage',
|
||||
pcDemo: 'prefix-suffix-slot',
|
||||
mfDemo: ''
|
||||
}
|
||||
],
|
||||
|
@ -114,6 +91,7 @@ export default {
|
|||
'en-US': 'Digital content front slot'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'prefix-suffix-slot',
|
||||
mfDemo: ''
|
||||
},
|
||||
{
|
||||
|
@ -125,6 +103,7 @@ export default {
|
|||
'en-US': 'Digital content rear slot'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'prefix-suffix-slot',
|
||||
mfDemo: ''
|
||||
},
|
||||
{
|
||||
|
@ -136,9 +115,22 @@ export default {
|
|||
'en-US': 'Digital content title slot'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'statistic-slot',
|
||||
mfDemo: ''
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
types: [
|
||||
{
|
||||
name: 'ITitleType',
|
||||
type: '',
|
||||
code: `
|
||||
interface ITitleType {
|
||||
value?: string // 标题文本
|
||||
position?: string // 标题位置,取值:top | bottom
|
||||
}
|
||||
`
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
|
@ -7,7 +7,7 @@ export default {
|
|||
props: [
|
||||
{
|
||||
name: 'active-color',
|
||||
type: 'String',
|
||||
type: 'string',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '当前页签的字体颜色',
|
||||
|
@ -237,7 +237,7 @@ export default {
|
|||
},
|
||||
{
|
||||
name: 'v-model',
|
||||
type: 'String',
|
||||
type: 'string',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '绑定值,选中选项卡的 name',
|
||||
|
@ -248,7 +248,7 @@ export default {
|
|||
},
|
||||
{
|
||||
name: 'v-model / modelValue',
|
||||
type: 'String',
|
||||
type: 'string',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '选中选项卡的 name',
|
||||
|
@ -284,8 +284,8 @@ export default {
|
|||
mfDemo: ''
|
||||
},
|
||||
{
|
||||
name: 'beforeClose',
|
||||
type: 'Function',
|
||||
name: 'before-close',
|
||||
type: '(name: string)=> boolean | Promise<boolean>',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': '关闭页签前的回调函数,入参为页签名。如果函数返回false 或 拒绝的Promise,则不关闭页签',
|
||||
|
@ -296,22 +296,57 @@ export default {
|
|||
pcDemo: 'tabs-events-close',
|
||||
mfDemo: ''
|
||||
},
|
||||
{
|
||||
name: 'more-show-all',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': `'更多'按钮触发的下拉面板是否展示全部页签项,适用于超大数据量的情况`,
|
||||
'en-US':
|
||||
'Indicates whether to display all tab items in the drop-down panel triggered by the More button. This parameter applies to the scenario where the data volume is large.'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'more-show-all'
|
||||
},
|
||||
{
|
||||
name: 'overflow-title',
|
||||
type: 'boolean',
|
||||
defaultValue: 'false',
|
||||
desc: {
|
||||
'zh-CN': '页签是否在超过 title-width 省略显示',
|
||||
'zh-CN': '页签是否在超过 title-width 省略显示,优先级低于 tooltip-config',
|
||||
'en-US':
|
||||
'Callback function before closing a tab. The input parameter is the tab name. If the function returns false or a rejected Promise, the tab is not closed.'
|
||||
'Indicates whether to display the tab when the title width is exceeded. The priority is lower than tooltip-config.'
|
||||
},
|
||||
mode: ['pc', 'mobile-first'],
|
||||
pcDemo: 'overflow-title',
|
||||
mfDemo: ''
|
||||
},
|
||||
{
|
||||
name: 'panel-max-height',
|
||||
type: 'string',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': `'更多'按钮触发的下拉面板最大高度,超出则显示滚动条,适用于超大数据量的情况`,
|
||||
'en-US':
|
||||
'Maximum height of the drop-down panel triggered by the More button. If the height is exceeded, a scroll bar is displayed. This applies to the scenario where the data volume is large'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'more-show-all'
|
||||
},
|
||||
{
|
||||
name: 'panel-width',
|
||||
type: 'string',
|
||||
defaultValue: '',
|
||||
desc: {
|
||||
'zh-CN': `'更多'按钮触发的下拉面板的宽度`,
|
||||
'en-US': 'Width of the drop-down panel triggered by the More button'
|
||||
},
|
||||
mode: ['pc'],
|
||||
pcDemo: 'more-show-all'
|
||||
},
|
||||
{
|
||||
name: 'title-width',
|
||||
type: 'String',
|
||||
type: 'string',
|
||||
defaultValue: '256px',
|
||||
desc: {
|
||||
'zh-CN': '当 overflow-title 为 true 时,指定页签标题的最大宽度',
|
||||
|
|
|
@ -319,6 +319,8 @@ interface IPopperOption {
|
|||
bubbling: boolean // 是否监听元素所有上级有滚动元素的scroll事件,监听到则更新popper的位置。用于解决某些弹出层位置在页面滚动时,位置不正确的场景,默认false
|
||||
followReferenceHide: boolean // 当触发源隐藏时,自动隐藏弹出层,默认true
|
||||
removeOnDestroy: boolean // 弹出层消失后,是否移除弹出层的DOM元素,布尔false
|
||||
updateHiddenPopperOnScroll: boolean // 滚动过程中是否更新隐藏的弹出层位置
|
||||
boundariesElement: 'viewport' | 'body' | HTMLElement // 滚动过程中,弹出层的碰撞边界。 默认值为: 'viewport'
|
||||
}
|
||||
`
|
||||
},
|
||||
|
|
|
@ -1,6 +1,12 @@
|
|||
<template>
|
||||
<div>
|
||||
<tiny-file-upload :action="action" list-type="picture-single" :file-list="fileList1" @preview="handlePreview">
|
||||
<tiny-file-upload
|
||||
:action="action"
|
||||
list-type="picture-single"
|
||||
:file-list="fileList1"
|
||||
@preview="handlePreview"
|
||||
image-bg-color="red"
|
||||
>
|
||||
</tiny-file-upload>
|
||||
<br />
|
||||
<br />
|
||||
|
@ -10,12 +16,11 @@
|
|||
</template>
|
||||
|
||||
<script>
|
||||
import { FileUpload, Button } from '@opentiny/vue'
|
||||
import { FileUpload } from '@opentiny/vue'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
TinyFileUpload: FileUpload,
|
||||
TinyButton: Button
|
||||
TinyFileUpload: FileUpload
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
@ -23,7 +28,7 @@ export default {
|
|||
fileList1: [
|
||||
{
|
||||
name: 'Snipaste_2022-12-02_18-05-51.png',
|
||||
url: `${import.meta.env.VITE_APP_BUILD_BASE_URL}static/images/ld.png`
|
||||
url: `${import.meta.env.VITE_APP_BUILD_BASE_URL}static/images/hae-logo.png`
|
||||
}
|
||||
],
|
||||
fileList2: [
|
||||
|
@ -46,8 +51,8 @@ export default {
|
|||
}
|
||||
},
|
||||
methods: {
|
||||
handlePreview() {
|
||||
console.log(...arguments)
|
||||
handlePreview(...args) {
|
||||
console.log(...args)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -0,0 +1,90 @@
|
|||
<template>
|
||||
<tiny-file-upload
|
||||
ref="upload"
|
||||
:action="action"
|
||||
:file-list="fileList"
|
||||
list-type="saas"
|
||||
@download-file="handleDownloadFile"
|
||||
></tiny-file-upload>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { FileUpload, Modal } from '@opentiny/vue'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
TinyFileUpload: FileUpload
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
action: 'http://localhost:3000/api/upload',
|
||||
fileList: [
|
||||
{
|
||||
docId: 'M1T2A1N548572512085860351',
|
||||
path: 'edm/one/',
|
||||
docVersion: 'V1',
|
||||
name: 'test1.png',
|
||||
docSize: 100 * 1024,
|
||||
size: 100 * 1024,
|
||||
serverName: 'ShenZhen'
|
||||
},
|
||||
{
|
||||
docId: 'M1T2A1N548572512085860352',
|
||||
path: 'edm/one/',
|
||||
docVersion: 'V1',
|
||||
name: 'test1.png',
|
||||
docSize: 100 * 1024,
|
||||
size: 100 * 1024,
|
||||
serverName: 'ShenZhen'
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleDownloadFile(file) {
|
||||
// 模拟下载成功场景
|
||||
if (file.docId === 'M1T2A1N548572512085860351') {
|
||||
file.showDownloadBar = true
|
||||
|
||||
// 更新downloadPercentage,vue2下写法
|
||||
this.$set(file, 'downloadPercentage', 0)
|
||||
// 更新downloadPercentage,vue3下写法
|
||||
// file.downloadPercentage = 0
|
||||
|
||||
const timer = setInterval(() => {
|
||||
if (file.downloadPercentage >= 100) {
|
||||
clearInterval(timer)
|
||||
// 下载完成后可以隐藏进度条,因为进度条有过渡动画,所以可以延迟1s再隐藏
|
||||
setTimeout(() => {
|
||||
file.showDownloadBar = false
|
||||
}, 1000)
|
||||
|
||||
Modal.message({ message: '下载成功', status: 'success' })
|
||||
return
|
||||
}
|
||||
file.downloadPercentage += 10
|
||||
}, 300)
|
||||
} else {
|
||||
// 模拟下载失败场景
|
||||
file.showDownloadBar = true
|
||||
|
||||
// 更新downloadPercentage,vue2下写法
|
||||
this.$set(file, 'downloadPercentage', 0)
|
||||
// 更新downloadPercentage,vue3下写法
|
||||
// file.downloadPercentage = 0
|
||||
|
||||
const timer = setInterval(() => {
|
||||
if (file.downloadPercentage >= 50) {
|
||||
clearInterval(timer)
|
||||
// file.showDownloadBar = false
|
||||
file.downloadStatus = 'exception'
|
||||
Modal.message({ message: '下载失败', status: 'error' })
|
||||
return
|
||||
}
|
||||
file.downloadPercentage += 10
|
||||
}, 300)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
|
@ -96,7 +96,7 @@ export default {
|
|||
},
|
||||
desc: {
|
||||
'zh-CN':
|
||||
'<p>文件上传模式,配置 `download-all` 事件,会显示下载全部按钮,点击下载全部按钮会触发 `download-all` 事件<p>',
|
||||
'<p>文件上传模式,配置 `download-all` 事件,会显示下载全部按钮,点击下载全部按钮会触发 `download-all` 事件。<p>',
|
||||
'en-US': '<p>button click</p>'
|
||||
},
|
||||
codeFiles: ['download-all.vue']
|
||||
|
@ -109,11 +109,25 @@ export default {
|
|||
},
|
||||
desc: {
|
||||
'zh-CN':
|
||||
'<p>文件上传模式,配置 `download-file` 事件,已上传的文件会显示下载按钮,点击下载按钮会触发 `download-file` 事件<p>',
|
||||
'<p>文件上传模式,配置 `download-file` 事件,已上传的文件会显示下载按钮,点击下载按钮会触发 `download-file` 事件。<p>',
|
||||
'en-US': '<p>button click</p>'
|
||||
},
|
||||
codeFiles: ['download.vue']
|
||||
},
|
||||
{
|
||||
demoId: 'show-download-bar',
|
||||
name: {
|
||||
'zh-CN': '下载进度条',
|
||||
'en-US': 'Download progress bar'
|
||||
},
|
||||
desc: {
|
||||
'zh-CN':
|
||||
'<p>通过给 file 对象设置 `showDownloadBar:true` 可以显示下载进度条,`downloadPercentage` 属性传入下载进度,`downloadStatus` 设置下载状态。<p>',
|
||||
'en-US':
|
||||
'<p>You can set the `showDownloadBar:true` attribute of the file object to display the download progress bar, set the`downloadPercentage` attribute to transfer the download progress, and set the`downloadStatus` to set the download status.</p>'
|
||||
},
|
||||
codeFiles: ['show-download-bar.vue']
|
||||
},
|
||||
{
|
||||
demoId: 'download-picture',
|
||||
name: {
|
||||
|
@ -122,7 +136,7 @@ export default {
|
|||
},
|
||||
desc: {
|
||||
'zh-CN':
|
||||
'<p>图片上传模式,配置 `download-file` 事件,已上传的文件会显示下载图标,点击下载按钮会触发 `download-file` 事件<p>',
|
||||
'<p>图片上传模式,配置 `download-file` 事件,已上传的文件会显示下载图标,点击下载按钮会触发 `download-file` 事件。<p>',
|
||||
'en-US': '<p>button click</p>'
|
||||
},
|
||||
codeFiles: ['download-picture.vue']
|
||||
|
@ -135,7 +149,7 @@ export default {
|
|||
},
|
||||
desc: {
|
||||
'zh-CN':
|
||||
'<p>文件上传模式,配置 `re-upload` 事件,上传失败的文件会显示重新上传按钮,点击重新上传按钮会触发 `re-upload` 事件<p>',
|
||||
'<p>文件上传模式,配置 `re-upload` 事件,上传失败的文件会显示重新上传按钮,点击重新上传按钮会触发 `re-upload` 事件。<p>',
|
||||
'en-US': '<p>button click</p>'
|
||||
},
|
||||
codeFiles: ['re-upload.vue']
|
||||
|
@ -148,7 +162,7 @@ export default {
|
|||
},
|
||||
desc: {
|
||||
'zh-CN':
|
||||
'<p>图片上传模式,配置 `re-upload` 事件,上传失败的文件会显示重新上传图标,点击重新上传按钮会触发 `re-upload` 事件<p>',
|
||||
'<p>图片上传模式,配置 `re-upload` 事件,上传失败的文件会显示重新上传图标,点击重新上传按钮会触发 `re-upload` 事件。<p>',
|
||||
'en-US': '<p>button click</p>'
|
||||
},
|
||||
codeFiles: ['re-upload-picture.vue']
|
||||
|
@ -308,7 +322,7 @@ export default {
|
|||
'en-US': 'events'
|
||||
},
|
||||
desc: {
|
||||
'zh-CN': '<p>可配置 `file-list` 属性展示对应的文件<p>',
|
||||
'zh-CN': '<p>可配置 `file-list` 属性展示对应的文件。<p>',
|
||||
'en-US': '<p>button click</p>'
|
||||
},
|
||||
codeFiles: ['drag-file-list.vue']
|
||||
|
@ -321,7 +335,7 @@ export default {
|
|||
},
|
||||
desc: {
|
||||
'zh-CN':
|
||||
'<p>`trigger-click` 点击文件上传时触发的事件<br>`preview` 点击预览时触发的事件<br> `download-file` 点击下载时触发的事件<br>`download-all` 点击全部下载时触发的事件<br>`re-upload` 点击重新上传时触发的事件<br>`click-file-list` 点击上传的文件列表时触发的事件<p>',
|
||||
'<p>`trigger-click` 点击文件上传时触发的事件<br>`preview` 点击预览时触发的事件<br> `download-file` 点击下载时触发的事件<br>`download-all` 点击全部下载时触发的事件<br>`re-upload` 点击重新上传时触发的事件<br>`click-file-list` 点击上传的文件列表时触发的事件。<p>',
|
||||
'en-US': '<p>button click</p>'
|
||||
},
|
||||
codeFiles: ['event-trigger-click.vue']
|
||||
|
|
|
@ -0,0 +1,55 @@
|
|||
<template>
|
||||
<div class="w-96">
|
||||
<tiny-form ref="ruleForm" :model="createData" :rules="rules" label-width="96px" show-message>
|
||||
<tiny-form-item label="必填项" prop="users" required>
|
||||
<template #prompt>
|
||||
<div class="relative sm:absolute text-xs leading-normal text-color-alert" title="强提示插槽">强提示插槽</div>
|
||||
</template>
|
||||
<tiny-input v-model="createData.users"></tiny-input>
|
||||
</tiny-form-item>
|
||||
<tiny-form-item label="URL" prop="url">
|
||||
<tiny-input v-model="createData.url"></tiny-input>
|
||||
</tiny-form-item>
|
||||
<tiny-form-item>
|
||||
<tiny-button type="primary" @click="handleSubmit('ruleForm')" class="ml-24"> 提交 </tiny-button>
|
||||
</tiny-form-item>
|
||||
</tiny-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { Form, FormItem, Input, Button, Modal } from '@opentiny/vue'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
TinyForm: Form,
|
||||
TinyFormItem: FormItem,
|
||||
TinyInput: Input,
|
||||
TinyButton: Button
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
createData: {
|
||||
users: '',
|
||||
url: ''
|
||||
},
|
||||
rules: {
|
||||
users: [
|
||||
{ required: true, message: '必填', trigger: 'blur' },
|
||||
{ min: 2, max: 11, message: '长度必须不小于2', trigger: 'change' }
|
||||
],
|
||||
url: { type: 'url' }
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleSubmit(formName) {
|
||||
this.$refs[formName].validate((valid) => {
|
||||
if (valid) {
|
||||
Modal.alert('提交成功')
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
|
@ -215,6 +215,18 @@ export default {
|
|||
'<p>Set the `validate-debounce` attribute of FormItem to `true` to enable the verification anti-jitter function. In the case of continuous input, the verification starts when the last input ends. The default value is `false`.</p>'
|
||||
},
|
||||
codeFiles: ['validate-debounce.vue']
|
||||
},
|
||||
{
|
||||
demoId: 'prompt-slot',
|
||||
name: {
|
||||
'zh-CN': '强提示插槽',
|
||||
'en-US': 'Prompt slot'
|
||||
},
|
||||
desc: {
|
||||
'zh-CN': '<p>通过 `prompt` 插槽,自定义强提示插槽的内容。</p>',
|
||||
'en-US': '<p>Customize the content of the strong prompt slot in the `prompt` slot. </p>'
|
||||
},
|
||||
codeFiles: ['prompt-slot.vue']
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<tiny-tabs v-model="activeName" tab-style="card" :with-close="true" @close="close">
|
||||
<tiny-tabs v-model="activeName" tab-style="card" :with-close="true" :before-close="beforeClose" @close="close">
|
||||
<tiny-tab-item :key="item.name" v-for="item in Tabs" :title="item.title" :name="item.name">
|
||||
{{ item.content }}
|
||||
</tiny-tab-item>
|
||||
|
@ -47,6 +47,10 @@ export default {
|
|||
}
|
||||
},
|
||||
methods: {
|
||||
beforeClose(name) {
|
||||
// 只能关闭标签页“其他组件”
|
||||
return name === 'fifth'
|
||||
},
|
||||
close(name) {
|
||||
this.$message({
|
||||
title: 'close 事件',
|
||||
|
|
|
@ -0,0 +1,35 @@
|
|||
import { test, expect } from '@playwright/test'
|
||||
|
||||
test('基本用法', async ({ page }) => {
|
||||
page.on('pageerror', (exception) => expect(exception).toBeNull())
|
||||
await page.goto('button#base')
|
||||
|
||||
const buttons = page.locator('.button-wrap .tiny-mobile-button')
|
||||
|
||||
// 主要按钮
|
||||
await expect(buttons.first()).toHaveClass(/tiny-mobile-button--primary/)
|
||||
await expect(buttons.first()).toHaveCSS('background-color', 'rgb(25, 25, 25)')
|
||||
await expect(buttons.first()).toHaveCSS('color', 'rgb(255, 255, 255)')
|
||||
|
||||
// 次要按钮
|
||||
await expect(buttons.nth(1)).toHaveClass(/tiny-mobile-button--secondary/)
|
||||
await expect(buttons.nth(1)).toHaveCSS('background-color', 'rgb(255, 255, 255)')
|
||||
await expect(buttons.nth(1)).toHaveCSS('color', 'rgb(25, 25, 25)')
|
||||
|
||||
// 危险按钮
|
||||
await expect(buttons.nth(2)).toHaveClass(/tiny-mobile-button--danger/)
|
||||
await expect(buttons.nth(2)).toHaveCSS('border-color', 'rgb(242, 48, 48)')
|
||||
await expect(buttons.nth(2)).toHaveCSS('color', 'rgb(242, 48, 48)')
|
||||
|
||||
// 文字按钮
|
||||
await expect(buttons.nth(3)).toHaveClass(/tiny-mobile-button--text/)
|
||||
await expect(buttons.nth(3)).toHaveCSS('border-style', 'none')
|
||||
|
||||
// 纯图标按钮
|
||||
await expect(buttons.nth(4)).toHaveClass(/tiny-mobile-button--icon/)
|
||||
await expect(buttons.nth(4).locator('span')).toBeEmpty()
|
||||
|
||||
// 图标按钮
|
||||
await expect(buttons.nth(5)).toHaveClass(/tiny-mobile-button--icon/)
|
||||
await expect(buttons.nth(5)).toContainText('图标按钮')
|
||||
})
|
|
@ -0,0 +1,13 @@
|
|||
import { test, expect } from '@playwright/test'
|
||||
|
||||
test('禁用', async ({ page }) => {
|
||||
page.on('pageerror', (exception) => expect(exception).toBeNull())
|
||||
await page.goto('button#disabled')
|
||||
|
||||
const button = page.locator('#disabled .tiny-mobile-button').first()
|
||||
|
||||
await expect(button).toHaveClass(/is-disabled/)
|
||||
await expect(button).toHaveCSS('background-color', 'rgb(240, 240, 240)')
|
||||
await expect(button).toHaveCSS('color', 'rgb(194, 194, 194)')
|
||||
await expect(button).toHaveCSS('cursor', 'not-allowed')
|
||||
})
|
|
@ -0,0 +1,13 @@
|
|||
import { test, expect } from '@playwright/test'
|
||||
|
||||
test('事件', async ({ page }) => {
|
||||
page.on('pageerror', (exception) => expect(exception).toBeNull())
|
||||
await page.goto('button#event')
|
||||
|
||||
const button = page.locator('#event .tiny-mobile-button')
|
||||
|
||||
await button.click()
|
||||
await expect(button).toHaveClass(/is-loading/)
|
||||
await page.waitForTimeout(2000)
|
||||
await expect(button).not.toHaveClass(/is-loading/)
|
||||
})
|
|
@ -0,0 +1,15 @@
|
|||
import { test, expect } from '@playwright/test'
|
||||
|
||||
test('自定义图标', async ({ page }) => {
|
||||
page.on('pageerror', (exception) => expect(exception).toBeNull())
|
||||
await page.goto('button#icon')
|
||||
|
||||
const buttons = page.locator('#icon .tiny-mobile-button')
|
||||
|
||||
await expect(buttons.first()).toHaveClass(/tiny-mobile-button--icon/)
|
||||
await expect(buttons.first().locator('.is-icon')).toBeVisible()
|
||||
|
||||
await expect(buttons.nth(1)).toHaveClass(/tiny-mobile-button--icon/)
|
||||
await expect(buttons.nth(1).locator('.is-icon')).toBeVisible()
|
||||
await expect(buttons.nth(1).locator('span')).toBeVisible()
|
||||
})
|
|
@ -0,0 +1,11 @@
|
|||
import { test, expect } from '@playwright/test'
|
||||
|
||||
test('加载中状态', async ({ page }) => {
|
||||
page.on('pageerror', (exception) => expect(exception).toBeNull())
|
||||
await page.goto('button#loading')
|
||||
|
||||
const buttons = page.locator('.button-wrap .tiny-mobile-button')
|
||||
|
||||
await expect(buttons.first()).toHaveClass(/is-loading/)
|
||||
await expect(buttons.first().locator('.tiny-mobile-button-loading-white')).toBeVisible()
|
||||
})
|
|
@ -0,0 +1,13 @@
|
|||
import { test, expect } from '@playwright/test'
|
||||
|
||||
test('重置时间', async ({ page }) => {
|
||||
page.on('pageerror', (exception) => expect(exception).toBeNull())
|
||||
await page.goto('button#reset-time')
|
||||
|
||||
const button = page.locator('.button-wrap .tiny-mobile-button')
|
||||
await button.click()
|
||||
|
||||
await expect(button).toHaveClass(/is-disabled/)
|
||||
await page.waitForTimeout(500)
|
||||
await expect(button).not.toHaveClass(/is-disabled/)
|
||||
})
|
|
@ -0,0 +1,25 @@
|
|||
import { test, expect } from '@playwright/test'
|
||||
|
||||
test('尺寸', async ({ page }) => {
|
||||
page.on('pageerror', (exception) => expect(exception).toBeNull())
|
||||
await page.goto('button#size')
|
||||
|
||||
const buttons = page.locator('.button-wrap .tiny-mobile-button')
|
||||
|
||||
// 主要按钮
|
||||
const smallPrimaryBtn = buttons.first()
|
||||
const size = await smallPrimaryBtn.boundingBox()
|
||||
await expect(smallPrimaryBtn).toHaveClass(/tiny-mobile-button--small/)
|
||||
expect(size?.height).toBeCloseTo(28, 1)
|
||||
expect(smallPrimaryBtn).toHaveCSS('font-size', '12px')
|
||||
|
||||
// 文字按钮
|
||||
const smallTextBtn = buttons.nth(3)
|
||||
await expect(smallTextBtn).toHaveClass(/tiny-mobile-button--small/)
|
||||
expect(smallTextBtn).toHaveCSS('font-size', '12px')
|
||||
|
||||
// 图标按钮
|
||||
const smallIconBtn = buttons.nth(4)
|
||||
const iconSize = await smallIconBtn.locator('.tiny-icon').boundingBox()
|
||||
expect(iconSize?.width).toBeCloseTo(16, 1)
|
||||
})
|
|
@ -19,7 +19,7 @@ test.describe('文本域可缩放', () => {
|
|||
|
||||
const textarea = page.locator('.demo-input .tiny-mobile-textarea textarea')
|
||||
|
||||
await expect(textarea.nth(4)).toHaveClass(/is-autosize/)
|
||||
await expect(textarea.nth(5)).toHaveClass(/is-autosize/)
|
||||
await expect(textarea.nth(6)).toHaveClass(/is-autosize/)
|
||||
})
|
||||
})
|
||||
|
|
|
@ -0,0 +1,9 @@
|
|||
import { test, expect } from '@playwright/test'
|
||||
|
||||
test('自定义遮罩背景色', async ({ page }) => {
|
||||
page.on('pageerror', (exception) => expect(exception).toBeNull())
|
||||
await page.goto('loading#background')
|
||||
|
||||
const loading = page.locator('#background .tiny-mobile-loading')
|
||||
await expect(loading).toHaveCSS('background-color', 'rgba(25, 25, 25, 0.376)')
|
||||
})
|
|
@ -0,0 +1,19 @@
|
|||
import { test, expect } from '@playwright/test'
|
||||
|
||||
test('基本用法', async ({ page }) => {
|
||||
page.on('pageerror', (exception) => expect(exception).toBeNull())
|
||||
await page.goto('loading#base')
|
||||
|
||||
const loading = page.locator('#base .tiny-mobile-loading')
|
||||
const loadingIcon = loading.locator('.tiny-mobile-loading__icon')
|
||||
|
||||
await expect(loading).toBeVisible()
|
||||
await expect(loading).toHaveCSS('background-color', 'rgba(0, 0, 0, 0.294)')
|
||||
await expect(loadingIcon).toBeVisible()
|
||||
await expect(loadingIcon).toHaveCSS('width', '24px')
|
||||
await expect(loadingIcon).toHaveCSS('height', '24px')
|
||||
|
||||
// 可关闭
|
||||
await page.getByRole('button', { name: '关闭 Loading' }).click()
|
||||
await expect(loading).not.toBeVisible()
|
||||
})
|
|
@ -0,0 +1,13 @@
|
|||
import { test, expect } from '@playwright/test'
|
||||
|
||||
test('自定义样式', async ({ page }) => {
|
||||
page.on('pageerror', (exception) => expect(exception).toBeNull())
|
||||
await page.goto('loading#custom-class')
|
||||
|
||||
const loading = page.locator('#custom-class .tiny-mobile-loading')
|
||||
const loadingText = loading.locator('.tiny-mobile-loading__text')
|
||||
|
||||
await expect(loading).toHaveCSS('background-color', 'rgba(0, 0, 0, 0.5)')
|
||||
await expect(loadingText).toBeVisible()
|
||||
await expect(loadingText).toHaveCSS('color', 'rgb(255, 255, 255)')
|
||||
})
|
|
@ -0,0 +1,28 @@
|
|||
import { test, expect } from '@playwright/test'
|
||||
|
||||
test.describe('全局加载', () => {
|
||||
test('指令方式加载', async ({ page }) => {
|
||||
page.on('pageerror', (exception) => expect(exception).toBeNull())
|
||||
await page.goto('loading#global-registry')
|
||||
|
||||
const loading = page.locator('.tiny-mobile-loading')
|
||||
|
||||
await page.getByRole('button', { name: '指令方式加载全屏Loading' }).click()
|
||||
await expect(loading).toBeVisible()
|
||||
await expect(loading).toHaveClass(/is-fullscreen/)
|
||||
await page.waitForTimeout(3000)
|
||||
await expect(loading).not.toBeVisible()
|
||||
})
|
||||
|
||||
test('静态方法加载', async ({ page }) => {
|
||||
page.on('pageerror', (exception) => expect(exception).toBeNull())
|
||||
await page.goto('loading#global-registry')
|
||||
|
||||
const loading = page.locator('.tiny-mobile-loading')
|
||||
|
||||
await page.getByRole('button', { name: '静态方法加载全屏Loading' }).click()
|
||||
await expect(loading).toBeVisible()
|
||||
await page.waitForTimeout(3000)
|
||||
await expect(loading).not.toBeVisible()
|
||||
})
|
||||
})
|
|
@ -0,0 +1,36 @@
|
|||
import { test, expect } from '@playwright/test'
|
||||
|
||||
test('尺寸', async ({ page }) => {
|
||||
page.on('pageerror', (exception) => expect(exception).toBeNull())
|
||||
await page.goto('loading#size')
|
||||
|
||||
const loadings = page.locator('#size .tiny-mobile-loading')
|
||||
|
||||
// mini
|
||||
const miniLoading = loadings.first()
|
||||
await expect(miniLoading.locator('.tiny-mobile-loading__body')).toHaveClass(/tiny-mobile-loading-mini/)
|
||||
await expect(miniLoading.locator('.tiny-mobile-loading__body')).toHaveCSS('flex-direction', 'row')
|
||||
await expect(miniLoading.locator('.tiny-mobile-loading__icon')).toHaveCSS('width', '14px')
|
||||
await expect(miniLoading.locator('.tiny-mobile-loading__icon')).toHaveCSS('height', '14px')
|
||||
|
||||
// small
|
||||
const smallLoading = loadings.nth(1)
|
||||
await expect(smallLoading.locator('.tiny-mobile-loading__body')).toHaveClass(/tiny-mobile-loading-small/)
|
||||
await expect(smallLoading.locator('.tiny-mobile-loading__body')).toHaveCSS('flex-direction', 'column')
|
||||
await expect(smallLoading.locator('.tiny-mobile-loading__icon')).toHaveCSS('width', '24px')
|
||||
await expect(smallLoading.locator('.tiny-mobile-loading__icon')).toHaveCSS('height', '24px')
|
||||
|
||||
// medium
|
||||
const mediumLoading = loadings.nth(2)
|
||||
await expect(mediumLoading.locator('.tiny-mobile-loading__body')).toHaveClass(/.tiny-mobile-loading-medium/)
|
||||
await expect(mediumLoading.locator('.tiny-mobile-loading__body')).toHaveCSS('flex-direction', 'column')
|
||||
await expect(mediumLoading.locator('.tiny-mobile-loading__icon')).toHaveCSS('width', '40px')
|
||||
await expect(mediumLoading.locator('.tiny-mobile-loading__icon')).toHaveCSS('height', '40px')
|
||||
|
||||
// large
|
||||
const largeLoading = loadings.nth(3)
|
||||
await expect(largeLoading.locator('.tiny-mobile-loading__body')).toHaveClass(/tiny-mobile-loading-large/)
|
||||
await expect(largeLoading.locator('.tiny-mobile-loading__body')).toHaveCSS('flex-direction', 'column')
|
||||
await expect(largeLoading.locator('.tiny-mobile-loading__icon')).toHaveCSS('width', '96px')
|
||||
await expect(largeLoading.locator('.tiny-mobile-loading__icon')).toHaveCSS('height', '96px')
|
||||
})
|
|
@ -0,0 +1,13 @@
|
|||
import { test, expect } from '@playwright/test'
|
||||
|
||||
test('自定义加载图标', async ({ page }) => {
|
||||
page.on('pageerror', (exception) => expect(exception).toBeNull())
|
||||
await page.goto('loading#spinner')
|
||||
|
||||
const loading = page.locator('#spinner .tiny-mobile-loading')
|
||||
const loadingText = loading.locator('.tiny-mobile-loading__text')
|
||||
const svg = loading.locator('.tiny-mobile-loading__spinner')
|
||||
|
||||
await expect(loadingText).toContainText('自定义 loading 图标')
|
||||
await expect(svg).toBeVisible()
|
||||
})
|
|
@ -10,7 +10,7 @@ export default {
|
|||
mounted() {
|
||||
Loading.service({
|
||||
spinner: iconLoading(),
|
||||
text: '自定义loading图标',
|
||||
text: '自定义 loading 图标',
|
||||
target: document.getElementById('demo-loading'),
|
||||
background: '#fff',
|
||||
tiny_mode: 'mobile'
|
||||
|
|
|
@ -0,0 +1,10 @@
|
|||
import { test, expect } from '@playwright/test'
|
||||
|
||||
test('自定义加载提示文本', async ({ page }) => {
|
||||
page.on('pageerror', (exception) => expect(exception).toBeNull())
|
||||
await page.goto('loading#tip-text')
|
||||
|
||||
const loading = page.locator('#tip-text .tiny-mobile-loading')
|
||||
const loadingText = loading.locator('.tiny-mobile-loading__text')
|
||||
await expect(loadingText).toContainText('加载中...')
|
||||
})
|
|
@ -78,7 +78,7 @@ export default {
|
|||
codeFiles: ['size.vue']
|
||||
},
|
||||
{
|
||||
demoId: 'global-registry.',
|
||||
demoId: 'global-registry',
|
||||
name: {
|
||||
'zh-CN': '全局加载',
|
||||
'en-US': 'Global Registry'
|
||||
|
|
|
@ -2,7 +2,7 @@
|
|||
<div class="wrap">
|
||||
<div class="demo-top mb10">
|
||||
<tiny-switch v-model="isAffix"></tiny-switch>
|
||||
<span>{{ isAffix ? '打开固定模式' : '关闭固定模式' }}</span>
|
||||
<span>{{ isAffix ? '固定模式' : '非固定模式' }}</span>
|
||||
</div>
|
||||
<tiny-anchor :links="links" :is-affix="isAffix"></tiny-anchor>
|
||||
</div>
|
||||
|
|
|
@ -2,7 +2,7 @@
|
|||
<div class="wrap">
|
||||
<div class="demo-top mb10">
|
||||
<tiny-switch v-model="isAffix"></tiny-switch>
|
||||
<span>{{ isAffix ? '打开固定模式' : '关闭固定模式' }}</span>
|
||||
<span>{{ isAffix ? '固定模式' : '非固定模式' }}</span>
|
||||
</div>
|
||||
<tiny-anchor :links="links" :is-affix="isAffix"></tiny-anchor>
|
||||
</div>
|
||||
|
|
|
@ -6,11 +6,20 @@
|
|||
</tiny-carousel>
|
||||
</template>
|
||||
|
||||
<script setup lang="jsx">
|
||||
<script setup>
|
||||
import { Carousel as TinyCarousel, CarouselItem as TinyCarouselItem } from '@opentiny/vue'
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.tiny-carousel__item h3 {
|
||||
color: #475669;
|
||||
opacity: 0.75;
|
||||
line-height: 150px;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
.carousel-item-demo:nth-child(2n) {
|
||||
background-color: #fafafa;
|
||||
}
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
</tiny-carousel>
|
||||
</template>
|
||||
|
||||
<script lang="jsx">
|
||||
<script>
|
||||
import { Carousel, CarouselItem } from '@opentiny/vue'
|
||||
|
||||
export default {
|
||||
|
@ -18,6 +18,15 @@ export default {
|
|||
</script>
|
||||
|
||||
<style scoped>
|
||||
.tiny-carousel__item h3 {
|
||||
color: #475669;
|
||||
opacity: 0.75;
|
||||
line-height: 150px;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
.carousel-item-demo:nth-child(2n) {
|
||||
background-color: #fafafa;
|
||||
}
|
||||
|
|
|
@ -6,11 +6,20 @@
|
|||
</tiny-carousel>
|
||||
</template>
|
||||
|
||||
<script setup lang="jsx">
|
||||
<script setup>
|
||||
import { Carousel as TinyCarousel, CarouselItem as TinyCarouselItem } from '@opentiny/vue'
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.tiny-carousel__item h3 {
|
||||
color: #475669;
|
||||
opacity: 0.75;
|
||||
line-height: 150px;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
.carousel-item-demo:nth-child(2n) {
|
||||
background-color: #fafafa;
|
||||
}
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
</tiny-carousel>
|
||||
</template>
|
||||
|
||||
<script lang="jsx">
|
||||
<script>
|
||||
import { Carousel, CarouselItem } from '@opentiny/vue'
|
||||
|
||||
export default {
|
||||
|
@ -18,6 +18,15 @@ export default {
|
|||
</script>
|
||||
|
||||
<style scoped>
|
||||
.tiny-carousel__item h3 {
|
||||
color: #475669;
|
||||
opacity: 0.75;
|
||||
line-height: 150px;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
.carousel-item-demo:nth-child(2n) {
|
||||
background-color: #fafafa;
|
||||
}
|
||||
|
|
|
@ -6,11 +6,20 @@
|
|||
</tiny-carousel>
|
||||
</template>
|
||||
|
||||
<script setup lang="jsx">
|
||||
<script setup>
|
||||
import { Carousel as TinyCarousel, CarouselItem as TinyCarouselItem } from '@opentiny/vue'
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.tiny-carousel__item h3 {
|
||||
color: #475669;
|
||||
opacity: 0.75;
|
||||
line-height: 150px;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
.carousel-item-demo:nth-child(2n) {
|
||||
background-color: #fafafa;
|
||||
}
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
</tiny-carousel>
|
||||
</template>
|
||||
|
||||
<script lang="jsx">
|
||||
<script>
|
||||
import { Carousel, CarouselItem } from '@opentiny/vue'
|
||||
|
||||
export default {
|
||||
|
@ -18,6 +18,15 @@ export default {
|
|||
</script>
|
||||
|
||||
<style scoped>
|
||||
.tiny-carousel__item h3 {
|
||||
color: #475669;
|
||||
opacity: 0.75;
|
||||
line-height: 150px;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
.carousel-item-demo:nth-child(2n) {
|
||||
background-color: #fafafa;
|
||||
}
|
||||
|
|
|
@ -6,11 +6,20 @@
|
|||
</tiny-carousel>
|
||||
</template>
|
||||
|
||||
<script setup lang="jsx">
|
||||
<script setup>
|
||||
import { Carousel as TinyCarousel, CarouselItem as TinyCarouselItem } from '@opentiny/vue'
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.tiny-carousel__item h3 {
|
||||
color: #475669;
|
||||
opacity: 0.75;
|
||||
line-height: 150px;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
.carousel-item-demo:nth-child(2n) {
|
||||
background-color: #fafafa;
|
||||
}
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
</tiny-carousel>
|
||||
</template>
|
||||
|
||||
<script lang="jsx">
|
||||
<script>
|
||||
import { Carousel, CarouselItem } from '@opentiny/vue'
|
||||
|
||||
export default {
|
||||
|
@ -18,6 +18,15 @@ export default {
|
|||
</script>
|
||||
|
||||
<style scoped>
|
||||
.tiny-carousel__item h3 {
|
||||
color: #475669;
|
||||
opacity: 0.75;
|
||||
line-height: 150px;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
.carousel-item-demo:nth-child(2n) {
|
||||
background-color: #fafafa;
|
||||
}
|
||||
|
|
|
@ -6,11 +6,20 @@
|
|||
</tiny-carousel>
|
||||
</template>
|
||||
|
||||
<script setup lang="jsx">
|
||||
<script setup>
|
||||
import { Carousel as TinyCarousel, CarouselItem as TinyCarouselItem } from '@opentiny/vue'
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.tiny-carousel__item h3 {
|
||||
color: #475669;
|
||||
opacity: 0.75;
|
||||
line-height: 150px;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
.carousel-item-demo:nth-child(2n) {
|
||||
background-color: #fafafa;
|
||||
}
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
</tiny-carousel>
|
||||
</template>
|
||||
|
||||
<script lang="jsx">
|
||||
<script>
|
||||
import { Carousel, CarouselItem } from '@opentiny/vue'
|
||||
|
||||
export default {
|
||||
|
@ -18,6 +18,15 @@ export default {
|
|||
</script>
|
||||
|
||||
<style scoped>
|
||||
.tiny-carousel__item h3 {
|
||||
color: #475669;
|
||||
opacity: 0.75;
|
||||
line-height: 150px;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
.carousel-item-demo:nth-child(2n) {
|
||||
background-color: #fafafa;
|
||||
}
|
||||
|
|
|
@ -6,11 +6,20 @@
|
|||
</tiny-carousel>
|
||||
</template>
|
||||
|
||||
<script setup lang="jsx">
|
||||
<script setup>
|
||||
import { Carousel as TinyCarousel, CarouselItem as TinyCarouselItem } from '@opentiny/vue'
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.tiny-carousel__item h3 {
|
||||
color: #475669;
|
||||
opacity: 0.75;
|
||||
line-height: 150px;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
.carousel-item-demo:nth-child(2n) {
|
||||
background-color: #fafafa;
|
||||
}
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
</tiny-carousel>
|
||||
</template>
|
||||
|
||||
<script lang="jsx">
|
||||
<script>
|
||||
import { Carousel, CarouselItem } from '@opentiny/vue'
|
||||
|
||||
export default {
|
||||
|
@ -18,6 +18,15 @@ export default {
|
|||
</script>
|
||||
|
||||
<style scoped>
|
||||
.tiny-carousel__item h3 {
|
||||
color: #475669;
|
||||
opacity: 0.75;
|
||||
line-height: 150px;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
.carousel-item-demo:nth-child(2n) {
|
||||
background-color: #fafafa;
|
||||
}
|
||||
|
|
|
@ -24,6 +24,15 @@ function handleChange(value, oldValue) {
|
|||
</script>
|
||||
|
||||
<style scoped>
|
||||
.tiny-carousel__item h3 {
|
||||
color: #475669;
|
||||
opacity: 0.75;
|
||||
line-height: 150px;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
.carousel-item-demo:nth-child(2n) {
|
||||
background-color: #fafafa;
|
||||
}
|
||||
|
|
|
@ -34,6 +34,15 @@ export default {
|
|||
</script>
|
||||
|
||||
<style scoped>
|
||||
.tiny-carousel__item h3 {
|
||||
color: #475669;
|
||||
opacity: 0.75;
|
||||
line-height: 150px;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
.carousel-item-demo:nth-child(2n) {
|
||||
background-color: #fafafa;
|
||||
}
|
||||
|
|
|
@ -6,11 +6,20 @@
|
|||
</tiny-carousel>
|
||||
</template>
|
||||
|
||||
<script setup lang="jsx">
|
||||
<script setup>
|
||||
import { Carousel as TinyCarousel, CarouselItem as TinyCarouselItem } from '@opentiny/vue'
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.tiny-carousel__item h3 {
|
||||
color: #475669;
|
||||
opacity: 0.75;
|
||||
line-height: 150px;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
.carousel-item-demo:nth-child(2n) {
|
||||
background-color: #fafafa;
|
||||
}
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
</tiny-carousel>
|
||||
</template>
|
||||
|
||||
<script lang="jsx">
|
||||
<script>
|
||||
import { Carousel, CarouselItem } from '@opentiny/vue'
|
||||
|
||||
export default {
|
||||
|
@ -18,6 +18,15 @@ export default {
|
|||
</script>
|
||||
|
||||
<style scoped>
|
||||
.tiny-carousel__item h3 {
|
||||
color: #475669;
|
||||
opacity: 0.75;
|
||||
line-height: 150px;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
.carousel-item-demo:nth-child(2n) {
|
||||
background-color: #fafafa;
|
||||
}
|
||||
|
|
|
@ -14,11 +14,20 @@
|
|||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="jsx">
|
||||
<script setup>
|
||||
import { Carousel as TinyCarousel, CarouselItem as TinyCarouselItem } from '@opentiny/vue'
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.tiny-carousel__item h3 {
|
||||
color: #475669;
|
||||
opacity: 0.75;
|
||||
line-height: 150px;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
.block {
|
||||
margin: 20px 0;
|
||||
}
|
||||
|
|
|
@ -14,7 +14,7 @@
|
|||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="jsx">
|
||||
<script>
|
||||
import { Carousel, CarouselItem } from '@opentiny/vue'
|
||||
|
||||
export default {
|
||||
|
@ -26,6 +26,15 @@ export default {
|
|||
</script>
|
||||
|
||||
<style scoped>
|
||||
.tiny-carousel__item h3 {
|
||||
color: #475669;
|
||||
opacity: 0.75;
|
||||
line-height: 150px;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
.block {
|
||||
margin: 20px 0;
|
||||
}
|
||||
|
|
|
@ -6,11 +6,20 @@
|
|||
</tiny-carousel>
|
||||
</template>
|
||||
|
||||
<script setup lang="jsx">
|
||||
<script setup>
|
||||
import { Carousel as TinyCarousel, CarouselItem as TinyCarouselItem } from '@opentiny/vue'
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.tiny-carousel__item h3 {
|
||||
color: #475669;
|
||||
opacity: 0.75;
|
||||
line-height: 150px;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
.carousel-item-demo:nth-child(2n) {
|
||||
background-color: #fafafa;
|
||||
}
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
</tiny-carousel>
|
||||
</template>
|
||||
|
||||
<script lang="jsx">
|
||||
<script>
|
||||
import { Carousel, CarouselItem } from '@opentiny/vue'
|
||||
|
||||
export default {
|
||||
|
@ -18,6 +18,15 @@ export default {
|
|||
</script>
|
||||
|
||||
<style scoped>
|
||||
.tiny-carousel__item h3 {
|
||||
color: #475669;
|
||||
opacity: 0.75;
|
||||
line-height: 150px;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
.carousel-item-demo:nth-child(2n) {
|
||||
background-color: #fafafa;
|
||||
}
|
||||
|
|
|
@ -6,11 +6,20 @@
|
|||
</tiny-carousel>
|
||||
</template>
|
||||
|
||||
<script setup lang="jsx">
|
||||
<script setup>
|
||||
import { Carousel as TinyCarousel, CarouselItem as TinyCarouselItem } from '@opentiny/vue'
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.tiny-carousel__item h3 {
|
||||
color: #475669;
|
||||
opacity: 0.75;
|
||||
line-height: 150px;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
.carousel-item-demo:nth-child(2n) {
|
||||
background-color: #fafafa;
|
||||
}
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
</tiny-carousel>
|
||||
</template>
|
||||
|
||||
<script lang="jsx">
|
||||
<script>
|
||||
import { Carousel, CarouselItem } from '@opentiny/vue'
|
||||
|
||||
export default {
|
||||
|
|
|
@ -19,7 +19,7 @@
|
|||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="jsx">
|
||||
<script setup>
|
||||
import { ref } from 'vue'
|
||||
import {
|
||||
Carousel as TinyCarousel,
|
||||
|
@ -50,6 +50,15 @@ function prev() {
|
|||
</script>
|
||||
|
||||
<style scoped>
|
||||
.tiny-carousel__item h3 {
|
||||
color: #475669;
|
||||
opacity: 0.75;
|
||||
line-height: 150px;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
.carousel-item-demo:nth-child(2n) {
|
||||
background-color: #fafafa;
|
||||
}
|
||||
|
|
|
@ -19,7 +19,7 @@
|
|||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="jsx">
|
||||
<script>
|
||||
import { Carousel, CarouselItem, Numeric, Button, ButtonGroup } from '@opentiny/vue'
|
||||
|
||||
export default {
|
||||
|
@ -54,6 +54,15 @@ export default {
|
|||
</script>
|
||||
|
||||
<style scoped>
|
||||
.tiny-carousel__item h3 {
|
||||
color: #475669;
|
||||
opacity: 0.75;
|
||||
line-height: 150px;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
.carousel-item-demo:nth-child(2n) {
|
||||
background-color: #fafafa;
|
||||
}
|
||||
|
|
|
@ -6,11 +6,20 @@
|
|||
</tiny-carousel>
|
||||
</template>
|
||||
|
||||
<script setup lang="jsx">
|
||||
<script setup>
|
||||
import { Carousel as TinyCarousel, CarouselItem as TinyCarouselItem } from '@opentiny/vue'
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.tiny-carousel__item h3 {
|
||||
color: #475669;
|
||||
opacity: 0.75;
|
||||
line-height: 150px;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
.carousel-item-demo:nth-child(2n) {
|
||||
background-color: #fafafa;
|
||||
}
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
</tiny-carousel>
|
||||
</template>
|
||||
|
||||
<script lang="jsx">
|
||||
<script>
|
||||
import { Carousel, CarouselItem } from '@opentiny/vue'
|
||||
|
||||
export default {
|
||||
|
@ -18,6 +18,15 @@ export default {
|
|||
</script>
|
||||
|
||||
<style scoped>
|
||||
.tiny-carousel__item h3 {
|
||||
color: #475669;
|
||||
opacity: 0.75;
|
||||
line-height: 150px;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
.carousel-item-demo:nth-child(2n) {
|
||||
background-color: #fafafa;
|
||||
}
|
||||
|
|
|
@ -6,11 +6,20 @@
|
|||
</tiny-carousel>
|
||||
</template>
|
||||
|
||||
<script setup lang="jsx">
|
||||
<script setup>
|
||||
import { Carousel as TinyCarousel, CarouselItem as TinyCarouselItem } from '@opentiny/vue'
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.tiny-carousel__item h3 {
|
||||
color: #475669;
|
||||
opacity: 0.75;
|
||||
line-height: 150px;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
.carousel-item-demo:nth-child(2n) {
|
||||
background-color: #fafafa;
|
||||
}
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
</tiny-carousel>
|
||||
</template>
|
||||
|
||||
<script lang="jsx">
|
||||
<script>
|
||||
import { Carousel, CarouselItem } from '@opentiny/vue'
|
||||
|
||||
export default {
|
||||
|
@ -18,6 +18,15 @@ export default {
|
|||
</script>
|
||||
|
||||
<style scoped>
|
||||
.tiny-carousel__item h3 {
|
||||
color: #475669;
|
||||
opacity: 0.75;
|
||||
line-height: 150px;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
.carousel-item-demo:nth-child(2n) {
|
||||
background-color: #fafafa;
|
||||
}
|
||||
|
|
|
@ -6,11 +6,20 @@
|
|||
</tiny-carousel>
|
||||
</template>
|
||||
|
||||
<script setup lang="jsx">
|
||||
<script setup>
|
||||
import { Carousel as TinyCarousel, CarouselItem as TinyCarouselItem } from '@opentiny/vue'
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.tiny-carousel__item h3 {
|
||||
color: #475669;
|
||||
opacity: 0.75;
|
||||
line-height: 150px;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
.carousel-item-demo:nth-child(2n) {
|
||||
background-color: #fafafa;
|
||||
}
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
</tiny-carousel>
|
||||
</template>
|
||||
|
||||
<script lang="jsx">
|
||||
<script>
|
||||
import { Carousel, CarouselItem } from '@opentiny/vue'
|
||||
|
||||
export default {
|
||||
|
@ -18,6 +18,15 @@ export default {
|
|||
</script>
|
||||
|
||||
<style scoped>
|
||||
.tiny-carousel__item h3 {
|
||||
color: #475669;
|
||||
opacity: 0.75;
|
||||
line-height: 150px;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
.carousel-item-demo:nth-child(2n) {
|
||||
background-color: #fafafa;
|
||||
}
|
||||
|
|
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue