diff --git a/frontend/src/components/canvas/customComponent/UserView.vue b/frontend/src/components/canvas/customComponent/UserView.vue index 477e9f87ff..996d30c218 100644 --- a/frontend/src/components/canvas/customComponent/UserView.vue +++ b/frontend/src/components/canvas/customComponent/UserView.vue @@ -66,6 +66,7 @@ :terminal-type="scaleCoefficientType" :scale="scale" :theme-style="element.commonBackground" + :active="this.active" @onChartClick="chartClick" @onJumpClick="jumpClick" /> @@ -1272,6 +1273,7 @@ export default { width: 100%; height: 100%; overflow: hidden; + position: relative; } .chart-class { diff --git a/frontend/src/views/chart/chart/chart.js b/frontend/src/views/chart/chart/chart.js index afece4b1fe..1a2bb44af6 100644 --- a/frontend/src/views/chart/chart/chart.js +++ b/frontend/src/views/chart/chart/chart.js @@ -507,12 +507,14 @@ export const BASE_BAR = { }, { type: 'inside', + disabled: true, xAxisIndex: [0], start: 0, end: 100 }, { type: 'inside', + disabled: true, yAxisIndex: [0], start: 0, end: 100 @@ -563,12 +565,14 @@ export const HORIZONTAL_BAR = { }, { type: 'inside', + disabled: true, xAxisIndex: [0], start: 0, end: 100 }, { type: 'inside', + disabled: true, yAxisIndex: [0], start: 0, end: 100 @@ -621,12 +625,14 @@ export const BASE_LINE = { }, { type: 'inside', + disabled: true, xAxisIndex: [0], start: 0, end: 100 }, { type: 'inside', + disabled: true, yAxisIndex: [0], start: 0, end: 100 @@ -903,14 +909,10 @@ export const BASE_MAP = { }, geo: { map: 'MAP', - roam: true, - nameMap: { - - }, + roam: false, + nameMap: {}, itemStyle: { - normal: { - - }, + normal: {}, emphasis: { label: { show: false @@ -926,9 +928,7 @@ export const BASE_MAP = { roam: true, data: [], itemStyle: { - normal: { - - }, + normal: {}, emphasis: { label: { show: false @@ -984,12 +984,14 @@ export const BASE_SCATTER = { }, { type: 'inside', + disabled: true, xAxisIndex: [0], start: 0, end: 100 }, { type: 'inside', + disabled: true, yAxisIndex: [0], start: 0, end: 100 @@ -1079,12 +1081,14 @@ export const BASE_MIX = { }, { type: 'inside', + disabled: true, xAxisIndex: [0], start: 0, end: 100 }, { type: 'inside', + disabled: true, yAxisIndex: [0], start: 0, end: 100 diff --git a/frontend/src/views/chart/components/ChartComponent.vue b/frontend/src/views/chart/components/ChartComponent.vue index 46c9c1ec02..fbabbf5240 100644 --- a/frontend/src/views/chart/components/ChartComponent.vue +++ b/frontend/src/views/chart/components/ChartComponent.vue @@ -65,6 +65,11 @@ export default { MapController }, props: { + active: { + type: Boolean, + required: false, + default: false + }, chart: { type: Object, required: true @@ -121,7 +126,18 @@ export default { buttonTextColor: null, loading: true, showSuspension: true, - currentSeriesId: null + currentSeriesId: null, + haveScrollType: [ + 'map', + 'chart-mix', + 'bar', + 'bar-stack', + 'bar-horizontal', + 'bar-stack-horizontal', + 'line', + 'line-stack', + 'scatter' + ] } }, @@ -134,6 +150,11 @@ export default { ]) }, watch: { + active: { + handler(newVal, oldVla) { + this.scrollStatusChange(newVal) + } + }, currentSeriesId(value, old) { if (value !== old) { this.preDraw() @@ -173,6 +194,31 @@ export default { this.loadThemeStyle() }, methods: { + scrollStatusChange() { + if (this.haveScrollType.includes(this.chart.type)) { + const opt = this.myChart.getOption() + this.adaptorOpt(opt) + this.myChart.setOption(opt) + } + }, + adaptorOpt(opt) { + const disabledStatus = !this.active + if (opt.dataZoom) { + opt.dataZoom.forEach(function(s) { + if (s.type === 'inside') { + s.disabled = disabledStatus + } + }) + } + //地图 + if (opt.geo) { + if (opt.geo instanceof Array) { + opt.geo[0].roam = this.active + } else { + opt.geo.roam = this.active + } + } + }, changeSeriesId(param) { const { id, seriesId } = param if (id !== this.chart.id) { @@ -391,6 +437,7 @@ export default { } }, myEcharts(option) { + this.adaptorOpt(option) // 指定图表的配置项和数据 const chart = this.myChart this.setBackGroundBorder()