[issues/603]图表组件数据问题

pull/620/head
zhangdaiscott 2023-06-27 10:37:17 +08:00
parent 5c277f9748
commit 72a0e7dbe3
9 changed files with 18 additions and 16 deletions

View File

@ -4,7 +4,7 @@
<script lang="ts"> <script lang="ts">
import { defineComponent, PropType, ref, Ref, reactive, watchEffect } from 'vue'; import { defineComponent, PropType, ref, Ref, reactive, watchEffect } from 'vue';
import { useECharts } from '/@/hooks/web/useECharts'; import { useECharts } from '/@/hooks/web/useECharts';
import { cloneDeep } from 'lodash-es';
export default defineComponent({ export default defineComponent({
name: 'bar', name: 'bar',
props: { props: {
@ -61,7 +61,7 @@
function initCharts() { function initCharts() {
if (props.option) { if (props.option) {
Object.assign(option, props.option); Object.assign(option, cloneDeep(props.option));
} }
let seriesData = props.chartData.map((item) => { let seriesData = props.chartData.map((item) => {
return item.value; return item.value;

View File

@ -4,7 +4,7 @@
<script lang="ts"> <script lang="ts">
import { defineComponent, PropType, ref, Ref, reactive, watchEffect } from 'vue'; import { defineComponent, PropType, ref, Ref, reactive, watchEffect } from 'vue';
import { useECharts } from '/@/hooks/web/useECharts'; import { useECharts } from '/@/hooks/web/useECharts';
import { cloneDeep } from 'lodash-es';
export default defineComponent({ export default defineComponent({
name: 'barAndLine', name: 'barAndLine',
props: { props: {
@ -61,7 +61,7 @@
function initCharts() { function initCharts() {
if (props.option) { if (props.option) {
Object.assign(option, props.option); Object.assign(option, cloneDeep(props.option));
} }
// //
let typeArr = Array.from(new Set(props.chartData.map((item) => item.type))); let typeArr = Array.from(new Set(props.chartData.map((item) => item.type)));

View File

@ -4,7 +4,7 @@
<script lang="ts"> <script lang="ts">
import { defineComponent, PropType, ref, Ref, reactive, watchEffect } from 'vue'; import { defineComponent, PropType, ref, Ref, reactive, watchEffect } from 'vue';
import { useECharts } from '/@/hooks/web/useECharts'; import { useECharts } from '/@/hooks/web/useECharts';
import { cloneDeep } from 'lodash-es';
export default defineComponent({ export default defineComponent({
name: 'barMulti', name: 'barMulti',
props: { props: {
@ -67,7 +67,7 @@
function initCharts() { function initCharts() {
if (props.option) { if (props.option) {
Object.assign(option, props.option); Object.assign(option, cloneDeep(props.option));
} }
// //
let typeArr = Array.from(new Set(props.chartData.map((item) => item.type))); let typeArr = Array.from(new Set(props.chartData.map((item) => item.type)));

View File

@ -5,6 +5,7 @@
import { defineComponent, PropType, ref, Ref, reactive, watchEffect } from 'vue'; import { defineComponent, PropType, ref, Ref, reactive, watchEffect } from 'vue';
import { useECharts } from '/@/hooks/web/useECharts'; import { useECharts } from '/@/hooks/web/useECharts';
import { GaugeChart } from 'echarts/charts'; import { GaugeChart } from 'echarts/charts';
import { cloneDeep } from 'lodash-es';
export default defineComponent({ export default defineComponent({
name: 'Gauge', name: 'Gauge',
props: { props: {
@ -88,7 +89,7 @@
function initCharts() { function initCharts() {
echarts.use(GaugeChart); echarts.use(GaugeChart);
if (props.option) { if (props.option) {
Object.assign(option, props.option); Object.assign(option, cloneDeep(props.option));
} }
option.series[0].data[0].name = props.chartData.name; option.series[0].data[0].name = props.chartData.name;
option.series[0].data[0].value = props.chartData.value; option.series[0].data[0].value = props.chartData.value;

View File

@ -4,7 +4,7 @@
<script lang="ts"> <script lang="ts">
import { defineComponent, PropType, ref, Ref, reactive, watchEffect } from 'vue'; import { defineComponent, PropType, ref, Ref, reactive, watchEffect } from 'vue';
import { useECharts } from '/@/hooks/web/useECharts'; import { useECharts } from '/@/hooks/web/useECharts';
import { cloneDeep } from 'lodash-es';
export default defineComponent({ export default defineComponent({
name: 'line', name: 'line',
props: { props: {
@ -63,7 +63,7 @@
function initCharts() { function initCharts() {
if (props.option) { if (props.option) {
Object.assign(option, props.option); Object.assign(option, cloneDeep(props.option));
} }
let seriesData = props.chartData.map((item) => { let seriesData = props.chartData.map((item) => {
return item.value; return item.value;

View File

@ -4,6 +4,7 @@
<script lang="ts"> <script lang="ts">
import { defineComponent, PropType, ref, Ref, reactive, watchEffect } from 'vue'; import { defineComponent, PropType, ref, Ref, reactive, watchEffect } from 'vue';
import { useECharts } from '/@/hooks/web/useECharts'; import { useECharts } from '/@/hooks/web/useECharts';
import { cloneDeep } from 'lodash-es';
export default defineComponent({ export default defineComponent({
name: 'lineMulti', name: 'lineMulti',
@ -67,7 +68,7 @@
function initCharts() { function initCharts() {
if (props.option) { if (props.option) {
Object.assign(option, props.option); Object.assign(option, cloneDeep(props.option));
} }
// //
let typeArr = Array.from(new Set(props.chartData.map((item) => item.type))); let typeArr = Array.from(new Set(props.chartData.map((item) => item.type)));

View File

@ -4,7 +4,7 @@
<script lang="ts"> <script lang="ts">
import { defineComponent, PropType, ref, Ref, watchEffect, reactive, watch } from 'vue'; import { defineComponent, PropType, ref, Ref, watchEffect, reactive, watch } from 'vue';
import { useECharts } from '/@/hooks/web/useECharts'; import { useECharts } from '/@/hooks/web/useECharts';
import { cloneDeep } from 'lodash-es';
export default defineComponent({ export default defineComponent({
name: 'Pie', name: 'Pie',
props: { props: {
@ -70,7 +70,7 @@
); );
function initCharts() { function initCharts() {
if (props.option) { if (props.option) {
Object.assign(option, props.option); Object.assign(option, cloneDeep(props.option));
} }
option.series[0].data = props.chartData; option.series[0].data = props.chartData;
setOptions(option); setOptions(option);

View File

@ -4,7 +4,7 @@
<script lang="ts"> <script lang="ts">
import { defineComponent, PropType, ref, Ref, reactive, watchEffect } from 'vue'; import { defineComponent, PropType, ref, Ref, reactive, watchEffect } from 'vue';
import { useECharts } from '/@/hooks/web/useECharts'; import { useECharts } from '/@/hooks/web/useECharts';
import { cloneDeep } from 'lodash-es';
export default defineComponent({ export default defineComponent({
name: 'Radar', name: 'Radar',
props: { props: {
@ -64,7 +64,7 @@
function initCharts() { function initCharts() {
if (props.option) { if (props.option) {
Object.assign(option, props.option); Object.assign(option, cloneDeep(props.option));
} }
// //
let typeArr = Array.from(new Set(props.chartData.map((item) => item.type))); let typeArr = Array.from(new Set(props.chartData.map((item) => item.type)));

View File

@ -4,7 +4,7 @@
<script lang="ts"> <script lang="ts">
import { defineComponent, PropType, ref, Ref, reactive, watchEffect, watch } from 'vue'; import { defineComponent, PropType, ref, Ref, reactive, watchEffect, watch } from 'vue';
import { useECharts } from '/@/hooks/web/useECharts'; import { useECharts } from '/@/hooks/web/useECharts';
import { cloneDeep } from 'lodash-es';
export default defineComponent({ export default defineComponent({
name: 'StackBar', name: 'StackBar',
props: { props: {
@ -82,7 +82,7 @@
); );
function initCharts() { function initCharts() {
if (props.option) { if (props.option) {
Object.assign(option, props.option); Object.assign(option, cloneDeep(props.option));
} }
// //
let typeArr = Array.from(new Set(props.chartData.map((item) => item.type))); let typeArr = Array.from(new Set(props.chartData.map((item) => item.type)));