Commit 4676eea6fdbffd2e6e299f16ff5593d54d5e1317

Authored by fengwotao
1 parent cae34e76

perf(src/packages): 信息里更多新增自定义echarts组件

... ... @@ -5,8 +5,124 @@ import { CustomEchartsConfig } from './index'
5 5 import cloneDeep from 'lodash/cloneDeep'
6 6
7 7 export const option = {
8   - //数据源设置
9   - dataset: "{}"
  8 + //数据源设置 默认设置一个
  9 + dataset: `
  10 + {
  11 + backgroundColor: 'transparent',
  12 + tooltip: {
  13 + trigger: 'none'
  14 + },
  15 + xAxis: {
  16 + data: ["百分比"],
  17 + axisTick: {
  18 + show: false
  19 + },
  20 + axisLine: {
  21 + show: false
  22 + },
  23 + axisLabel: {
  24 + show: false,
  25 + textStyle: {
  26 + color: '#e54035'
  27 + }
  28 + }
  29 + },
  30 + yAxis: {
  31 + splitLine: {
  32 + show: false
  33 + },
  34 + axisTick: {
  35 + show: false
  36 + },
  37 + axisLine: {
  38 + show: false
  39 + },
  40 + axisLabel: {
  41 + show: false
  42 + }
  43 + },
  44 + series: [{
  45 + name: '最上层立体圆',
  46 + type: 'pictorialBar',
  47 + symbolSize: [300, 45],
  48 + symbolOffset: [0, -20],
  49 + z: 12,
  50 + itemStyle: {
  51 + normal: {
  52 + color: '#363F5E'
  53 + }
  54 + },
  55 + data: [{
  56 + value: 100,
  57 + symbolPosition: 'end'
  58 + }]
  59 + }, {
  60 + name: '中间立体圆',
  61 + type: 'pictorialBar',
  62 + symbolSize: [300, 45],
  63 + symbolOffset: [0, -20],
  64 + z: 12,
  65 + itemStyle: {
  66 + normal: {
  67 + color: '#2B5B4D'
  68 + }
  69 + },
  70 + data: [{
  71 + value: 30,
  72 + symbolPosition: 'end'
  73 + }]
  74 + }, {
  75 + name: '最底部立体圆',
  76 + type: 'pictorialBar',
  77 + symbolSize: [300, 45],
  78 + symbolOffset: [0, 20],
  79 + z: 12,
  80 + itemStyle: {
  81 + normal: {
  82 + color: '#01CC04'
  83 + }
  84 + },
  85 + data: [101 - 40]
  86 + }, {
  87 + //底部立体柱
  88 + stack: '1',
  89 + type: 'bar',
  90 + itemStyle: {
  91 + normal: {
  92 + color: '#01CC04',
  93 + opacity: .7
  94 + }
  95 + },
  96 + label: {
  97 + show: true,
  98 + position: "top",
  99 + distance: 15,
  100 + color: "#FFFE00",
  101 + fontSize:50,
  102 + formatter:'{c}'+'%'
  103 + },
  104 +
  105 + silent: true,
  106 + barWidth: 300,
  107 + barGap: '-100%', // Make series be overlap
  108 + data: [30]
  109 + }, {
  110 + //上部立体柱
  111 + stack: '1',
  112 + type: 'bar',
  113 + itemStyle: {
  114 + normal: {
  115 + color: '#36405E',
  116 + opacity: .7
  117 + }
  118 + },
  119 + silent: true,
  120 + barWidth: 300,
  121 + barGap: '-100%', // Make series be overlap
  122 + data: [100 - 30]
  123 + }]
  124 +}
  125 + `
10 126 }
11 127
12 128 export default class Config extends PublicConfigClass implements CreateComponentType {
... ...
1 1 <template>
2 2 <collapse-item name="数据源" :expanded="true">
3   - <monaco-editor v-model:modelValue="optionData.dataset" width="460px" height="380px" language="json" />
  3 + <monaco-editor v-model:modelValue="optionData.dataset" width="400px" height="480px" language="json" />
4 4 </collapse-item>
5 5 </template>
6 6
... ...
... ... @@ -53,7 +53,7 @@ const option = computed(() => {
53 53
54 54 const { vChartRef } = useChartDataFetch(props.chartConfig, useChartEditStore)
55 55
56   -const updateVChart = (dataset: any) => {
  56 +const updateVChart = (dataset: object) => {
57 57 new Promise(resolve => {
58 58 setTimeout(() => {
59 59 resolve(
... ...