diff --git a/src/packages/components/Charts/COMBINATIONS/BarLine/config.ts b/src/packages/components/Charts/COMBINATIONS/BarLine/config.ts new file mode 100644 index 00000000..b62c4bab --- /dev/null +++ b/src/packages/components/Charts/COMBINATIONS/BarLine/config.ts @@ -0,0 +1,76 @@ +import { echartOptionProfixHandle, PublicConfigClass } from '@/packages/public' +import { BarLineConfig } from './index' +import { CreateComponentType } from '@/packages/index.d' +import cloneDeep from 'lodash/cloneDeep' +import dataJson from './data.json' + + +export const includes = ['legend', 'xAxis', 'yAxis', 'grid'] +// 柱状折线组合图 分别定义series +// 写死name可以定义legend显示的名称 +export const barSeriesItem = { + type: 'bar', + barWidth: 15, + label: { + show: true, + position: 'top', + color: '#fff', + fontSize: 12 + }, + itemStyle: { + color: null, + borderRadius: 2 + } +} + +export const lineSeriesItem = { + type: 'line', + symbol: "circle", + label: { + show: true, + position: 'top', + color: '#fff', + fontSize: 12 + }, + symbolSize: 5, //设定实心点的大小 + itemStyle: { + color: '#FFE47A', + borderWidth: 1 + }, + lineStyle: { + type: 'solid', + width: 3, + color: null + } +} + +export const option = { + tooltip: { + show: true, + trigger: 'axis', + axisPointer: { + show: true, + type: 'shadow' + } + }, + legend: { + data:null + }, + xAxis: { + show: true, + type: 'category' + }, + yAxis: { + show: true, + type: 'value' + }, + dataset: { ...dataJson }, + series: [barSeriesItem, lineSeriesItem] +} + +export default class Config extends PublicConfigClass implements CreateComponentType { + public key = BarLineConfig.key + public chartConfig = cloneDeep(BarLineConfig) + // 图表配置项 + public option = echartOptionProfixHandle(option, includes) +} \ No newline at end of file diff --git a/src/packages/components/Charts/COMBINATIONS/BarLine/config.vue b/src/packages/components/Charts/COMBINATIONS/BarLine/config.vue new file mode 100644 index 00000000..b2f7c476 --- /dev/null +++ b/src/packages/components/Charts/COMBINATIONS/BarLine/config.vue @@ -0,0 +1,89 @@ + + + \ No newline at end of file diff --git a/src/packages/components/Charts/COMBINATIONS/BarLine/data.json b/src/packages/components/Charts/COMBINATIONS/BarLine/data.json new file mode 100644 index 00000000..0bd2f36e --- /dev/null +++ b/src/packages/components/Charts/COMBINATIONS/BarLine/data.json @@ -0,0 +1,40 @@ +{ + "dimensions": ["product", "data1", "data2"], + "source": [ + { + "product": "1月", + "data1": 104, + "data2": 30 + }, + { + "product": "2月", + "data1": 56, + "data2": 56 + }, + { + "product": "3月", + "data1": 136, + "data2": 36 + }, + { + "product": "4月", + "data1": 86, + "data2": 6 + }, + { + "product": "5月", + "data1": 98, + "data2": 10 + }, + { + "product": "6月", + "data1": 86, + "data2": 70 + }, + { + "product": "7月", + "data1": 77, + "data2": 57 + } + ] +} \ No newline at end of file diff --git a/src/packages/components/Charts/COMBINATIONS/BarLine/index.ts b/src/packages/components/Charts/COMBINATIONS/BarLine/index.ts new file mode 100644 index 00000000..1c236ed2 --- /dev/null +++ b/src/packages/components/Charts/COMBINATIONS/BarLine/index.ts @@ -0,0 +1,16 @@ +// 公共类型声明 +import { ConfigType, PackagesCategoryEnum, ChartFrameEnum } from '@/packages/index.d' +// 当前[信息模块]分类声明 +import { ChatCategoryEnum,ChatCategoryEnumName } from '../../index.d' + +export const BarLineConfig: ConfigType = { + key: 'BarLine', + chartKey: 'VBarLine', + conKey: 'VCBarLine', + title: '柱状加折线图', + category: ChatCategoryEnum.COMBINATIONS, + categoryName: ChatCategoryEnumName.COMBINATION, + package: PackagesCategoryEnum.CHARTS, + chartFrame: ChartFrameEnum.ECHARTS, + image: 'bar_x.png' +} \ No newline at end of file diff --git a/src/packages/components/Charts/COMBINATIONS/BarLine/index.vue b/src/packages/components/Charts/COMBINATIONS/BarLine/index.vue new file mode 100644 index 00000000..fb239a97 --- /dev/null +++ b/src/packages/components/Charts/COMBINATIONS/BarLine/index.vue @@ -0,0 +1,68 @@ + + + \ No newline at end of file diff --git a/src/packages/components/Charts/COMBINATIONS/index.ts b/src/packages/components/Charts/COMBINATIONS/index.ts new file mode 100644 index 00000000..3a131a97 --- /dev/null +++ b/src/packages/components/Charts/COMBINATIONS/index.ts @@ -0,0 +1,3 @@ +import { BarLineConfig } from './BarLine/index' + +export default [BarLineConfig] \ No newline at end of file diff --git a/src/packages/components/Charts/index.d.ts b/src/packages/components/Charts/index.d.ts index c033c296..2f88e1df 100644 --- a/src/packages/components/Charts/index.d.ts +++ b/src/packages/components/Charts/index.d.ts @@ -5,6 +5,7 @@ export enum ChatCategoryEnum { LINE = 'Lines', SCATTER = 'Scatters', MAP = 'Maps', + COMBINATIONS = 'COMBINATIONS', MORE = 'Mores' } @@ -14,5 +15,6 @@ export enum ChatCategoryEnumName { LINE = '折线图', SCATTER = '散点图', MAP = '地图', + COMBINATION = '组合图', MORE = '更多' } diff --git a/src/packages/components/Charts/index.ts b/src/packages/components/Charts/index.ts index 20ffcc66..63e5d657 100644 --- a/src/packages/components/Charts/index.ts +++ b/src/packages/components/Charts/index.ts @@ -3,6 +3,7 @@ import Pies from './Pies' import Lines from './Lines' import Scatters from './Scatters' import Mores from './Mores' +import COMBINATIONS from "./COMBINATIONS"; import Maps from './Maps' -export const ChartList = [...Bars, ...Lines, ...Pies, ...Scatters, ...Maps, ...Mores] +export const ChartList = [...Bars, ...Lines, ...Pies, ...Scatters, ...Maps,...COMBINATIONS, ...Mores]