diff --git a/src/components/Pages/VChartItemSetting/Label.vue b/src/components/Pages/VChartItemSetting/Label.vue index f1df09da..7a7ef742 100644 --- a/src/components/Pages/VChartItemSetting/Label.vue +++ b/src/components/Pages/VChartItemSetting/Label.vue @@ -7,7 +7,11 @@ - + @@ -33,6 +37,10 @@ defineProps({ optionData: { type: Object as PropType, required: true + }, + positionOptions: { + type: Array, + required: false } }) diff --git a/src/components/Pages/VChartItemSetting/Line.vue b/src/components/Pages/VChartItemSetting/Line.vue new file mode 100644 index 00000000..f405c3c8 --- /dev/null +++ b/src/components/Pages/VChartItemSetting/Line.vue @@ -0,0 +1,33 @@ + + + diff --git a/src/components/Pages/VChartItemSetting/Point.vue b/src/components/Pages/VChartItemSetting/Point.vue new file mode 100644 index 00000000..f2a90318 --- /dev/null +++ b/src/components/Pages/VChartItemSetting/Point.vue @@ -0,0 +1,56 @@ + + + diff --git a/src/components/Pages/VChartItemSetting/index.ts b/src/components/Pages/VChartItemSetting/index.ts index 76dcaa44..8a679abf 100644 --- a/src/components/Pages/VChartItemSetting/index.ts +++ b/src/components/Pages/VChartItemSetting/index.ts @@ -2,5 +2,7 @@ import VChartGlobalSetting from './VChartGlobalSetting.vue' import Axis from './Axis.vue' import Label from './Label.vue' import Bar from './Bar.vue' +import Line from './Line.vue' +import Point from './Point.vue' -export { VChartGlobalSetting, Axis, Label, Bar } +export { VChartGlobalSetting, Axis, Label, Bar, Line, Point } diff --git a/src/packages/chartConfiguration/vcharts/label.ts b/src/packages/chartConfiguration/vcharts/label.ts index f7d9ca7f..20db1987 100644 --- a/src/packages/chartConfiguration/vcharts/label.ts +++ b/src/packages/chartConfiguration/vcharts/label.ts @@ -78,5 +78,43 @@ export const labelConfig = { label: '底部-左', value: 'bottom-left' } + ], + linePosition: [ + { + label: '顶部', + value: 'top' + }, + { + label: '底部', + value: 'bottom' + }, + { + label: '左侧', + value: 'left' + }, + { + label: '右侧', + value: 'right' + }, + { + label: '顶部-右', + value: 'top-right' + }, + { + label: '顶部-左', + value: 'top-left' + }, + { + label: '底部-右', + value: 'bottom-right' + }, + { + label: '底部-左', + value: 'bottom-left' + }, + { + label: '居中', + value: 'center' + } ] } diff --git a/src/packages/chartConfiguration/vcharts/style.ts b/src/packages/chartConfiguration/vcharts/style.ts index 3524c960..4dce3bc1 100644 --- a/src/packages/chartConfiguration/vcharts/style.ts +++ b/src/packages/chartConfiguration/vcharts/style.ts @@ -36,5 +36,115 @@ export const styleConfig = { label: '格子', value: 'grid' } + ], + curveType: [ + { + label: '线性', + value: 'linear' + }, + { + label: '平滑', + value: 'monotone' + }, + { + label: '平滑趋近X', + value: 'monotoneX' + }, + { + label: '台阶', + value: 'step' + }, + { + label: '连线闭合', + value: 'catmullRom' + }, + { + label: '顺滑闭合', + value: 'catmullRomClosed' + } + ], + lineCap: [ + { + label: '默认', + value: 'butt' + }, + { + label: '圆形', + value: 'round' + }, + { + label: '方形', + value: 'square' + } + ], + symbolType: [ + { + label: '圆形', + value: 'circle' + }, + { + label: '方形', + value: 'rect' + }, + { + label: '菱形', + value: 'diamond' + }, + { + label: '三角形', + value: 'square' + }, + { + label: '指向向上', + value: 'arrow' + }, + { + label: '指向向左', + value: 'arrow2Left' + }, + { + label: '箭头向右', + value: 'arrow2Right' + }, + { + label: '瘦箭头向上', + value: 'wedge' + }, + { + label: '箭头向上', + value: 'triangle' + }, + { + label: '箭头向下', + value: 'triangleDown' + }, + { + label: '箭头向右', + value: 'triangleRight' + }, + { + label: '箭头向左', + value: 'triangleLeft' + }, + { + label: '星星', + value: 'star' + }, + { + label: 'y字形物', + value: 'wye' + }, + { + label: '矩形', + value: 'rect' + }, + { + label: '圆角矩形', + value: 'rectRound' + }, + { + label: '扁平矩形', + value: 'roundLine' + } ] } diff --git a/src/packages/components/VChart/Bars/VChartBarStack/config.vue b/src/packages/components/VChart/Bars/VChartBarStack/config.vue index 0fa023a4..53477eb5 100644 --- a/src/packages/components/VChart/Bars/VChartBarStack/config.vue +++ b/src/packages/components/VChart/Bars/VChartBarStack/config.vue @@ -22,7 +22,7 @@ import { PropType } from 'vue' import { VChartGlobalSetting, Axis, Label, Bar } from '@/components/Pages/VChartItemSetting' import { vChartGlobalThemeJsonType } from '@/settings/vchartThemes/index' -import { CollapseItem, SettingItemBox, SettingItem } from '@/components/Pages/ChartItemSetting' +import { CollapseItem, SettingItemBox } from '@/components/Pages/ChartItemSetting' defineProps({ optionData: { diff --git a/src/packages/components/VChart/Lines/VChartLine/config.ts b/src/packages/components/VChart/Lines/VChartLine/config.ts index 12ce684f..ad2c15a9 100644 --- a/src/packages/components/VChart/Lines/VChartLine/config.ts +++ b/src/packages/components/VChart/Lines/VChartLine/config.ts @@ -5,9 +5,9 @@ import { vChartOptionPrefixHandle } from '@/packages/public/vChart' import data from './data.json' import cloneDeep from 'lodash/cloneDeep' import axisThemeJson from '@/settings/vchartThemes/axis.theme.json' -import { ILineOption } from '../../index.d' +import { ChatCategoryEnum, ILineOption } from '../../index.d' -export const includes = ['legends', 'tooltip'] +export const includes = ['legends', 'tooltip', 'label', 'line', 'point'] export const option: ILineOption & { dataset?: any } = { // 图表配置 type: 'line', @@ -16,8 +16,10 @@ export const option: ILineOption & { dataset?: any } = { yField: 'value', seriesField: 'country', stack: true, + // 开启百分比 + percent: false, // 业务配置(后续会被转换为图表spec) - category: VChartLineConfig.category, + category: VChartLineConfig.category as ChatCategoryEnum.LINE, xAxis: { name: 'x轴', ...axisThemeJson, @@ -25,7 +27,7 @@ export const option: ILineOption & { dataset?: any } = { ...axisThemeJson.grid, visible: false } - }, + } as any, yAxis: { name: 'y轴', ...axisThemeJson, @@ -36,7 +38,7 @@ export const option: ILineOption & { dataset?: any } = { lineDash: [3, 3] } } - } + } as any } export default class Config extends PublicConfigClass implements CreateComponentType { diff --git a/src/packages/components/VChart/Lines/VChartLine/config.vue b/src/packages/components/VChart/Lines/VChartLine/config.vue index 9f15a51a..c6803bda 100644 --- a/src/packages/components/VChart/Lines/VChartLine/config.vue +++ b/src/packages/components/VChart/Lines/VChartLine/config.vue @@ -3,12 +3,26 @@ + + + + + 开启百分比堆叠 + + + + + + +