diff --git a/nezha-fronted/src/components/chart/chart/chartTimeSeries.vue b/nezha-fronted/src/components/chart/chart/chartTimeSeries.vue
index d2bbb0d3e..f8b296a50 100644
--- a/nezha-fronted/src/components/chart/chart/chartTimeSeries.vue
+++ b/nezha-fronted/src/components/chart/chart/chartTimeSeries.vue
@@ -158,9 +158,10 @@ export default {
// timeSeries类型图表设置group 用于多表联动
myChart.group = 'timeSeriesGroup'
myChart.getZr().on('mousemove', params => {
- if (this.$store.state.panel.isconnect !== 1) {
+ if (this.$store.state.panel.isConnect !== 'crosshair') {
return false
}
+ // crosshair 模式才会执行
if (this.$store.state.panel.currentMousemove !== this.chartId) {
this.$store.commit('setCurrentMousemove', this.chartId)
}
diff --git a/nezha-fronted/src/components/chart/chart/legend.vue b/nezha-fronted/src/components/chart/chart/legend.vue
index e53c55bf6..d9aade502 100644
--- a/nezha-fronted/src/components/chart/chart/legend.vue
+++ b/nezha-fronted/src/components/chart/chart/legend.vue
@@ -69,8 +69,8 @@ export default {
return !lodash.isEmpty(this.chartInfo.param.legend.values)
},
// timeSeries类型图表联动
- isconnect () {
- return this.$store.state.panel.isconnect
+ isConnect () {
+ return this.$store.state.panel.isConnect
}
},
methods: {
@@ -101,7 +101,7 @@ export default {
if (echarts) {
// 判断timeSeries类型图表 先取消多表联动
- if (isTimeSeries(this.chartInfo.type) && this.isconnect) {
+ if (isTimeSeries(this.chartInfo.type) && (this.isConnect && this.isConnect !== 'none')) {
chart.disconnect('timeSeriesGroup')
}
if (!hasGrey) { // 1.除当前legend外全置灰
@@ -127,7 +127,7 @@ export default {
this.$set(this.isGrey, index, !this.isGrey[index])
}
// 判断timeSeries类型图表 建立多表联动
- if (isTimeSeries(this.chartInfo.type) && this.isconnect) {
+ if (isTimeSeries(this.chartInfo.type) && (this.isConnect && this.isConnect !== 'none')) {
chart.connect('timeSeriesGroup')
}
if (this.chartInfo.type !== 'pie' && this.chartInfo.type !== 'bar' && this.chartInfo.type !== 'treemap') {
diff --git a/nezha-fronted/src/components/page/dashboard/panel.vue b/nezha-fronted/src/components/page/dashboard/panel.vue
index e02e54f5d..9146b33e1 100644
--- a/nezha-fronted/src/components/page/dashboard/panel.vue
+++ b/nezha-fronted/src/components/page/dashboard/panel.vue
@@ -40,19 +40,6 @@
-->
-
-
-
-
-
-
-
@@ -294,9 +281,7 @@ export default {
// 导出html 以及 pdf的弹窗
exportBoxShow: false,
// 查看模式
- mode: '',
- // 多表联动(timeSeries类型图表)
- isconnect: false
+ mode: ''
}
},
components: {
@@ -319,32 +304,6 @@ export default {
}
},
methods: {
- /**
- * @param {*} value // 1 表示不显示tooltip // 2 表示显示tooltip // false 表示不联动
- */
- connect (value) {
- // 每次切换联动模式 tooltip设置显示
- const option = {
- tooltip: {
- className: 'chart-time-series'
- }
- }
- for (const key in chartCache) {
- if (!chartCache[key] || chartCache[key].group !== 'timeSeriesGroup') {
- continue
- }
- chartCache[key].setOption(option)
- }
- this.$store.commit('setCurrentMousemove', 0)
- this.isconnect = value
- if (this.isconnect) {
- this.$store.commit('setConnect', this.isconnect)
- echarts.connect('timeSeriesGroup')
- } else {
- this.$store.commit('setConnect', this.isconnect)
- echarts.disconnect('timeSeriesGroup')
- }
- },
// 更新Weight
updateWeight (value) {
this.panelData = JSON.parse(JSON.stringify(value))
@@ -1022,8 +981,6 @@ export default {
time: this.searchTime,
nowTimeType: this.nowTimeType
})
- // 设置图表联动
- this.isconnect = this.$store.state.panel.isconnect
},
mounted () {
// 监听键盘ESC事件
@@ -1044,6 +1001,30 @@ export default {
}
},
watch: {
+ 'showPanel.params.chartShare': {
+ handler (value) {
+ // 每次切换联动模式 tooltip设置显示
+ const option = {
+ tooltip: {
+ className: 'chart-time-series'
+ }
+ }
+ for (const key in chartCache) {
+ if (!chartCache[key] || chartCache[key].group !== 'timeSeriesGroup') {
+ continue
+ }
+ chartCache[key].setOption(option)
+ }
+ this.$store.commit('setCurrentMousemove', 0)
+ if (value && value !== 'none') {
+ this.$store.commit('setConnect', value)
+ echarts.connect('timeSeriesGroup')
+ } else {
+ this.$store.commit('setConnect', value)
+ echarts.disconnect('timeSeriesGroup')
+ }
+ }
+ },
'filter.searchName': function (n, o) {
const temp = this
setTimeout(function () {
diff --git a/nezha-fronted/src/store/panel.js b/nezha-fronted/src/store/panel.js
index 8498f09aa..60fa81af4 100644
--- a/nezha-fronted/src/store/panel.js
+++ b/nezha-fronted/src/store/panel.js
@@ -21,7 +21,7 @@ const panel = {
// 查看模式
mode: '',
// timeSeries类型图表联动
- isconnect: false,
+ isConnect: false,
// 当前鼠标所在的图表id
currentMousemove: 0
},
@@ -80,7 +80,7 @@ const panel = {
},
// 设置timeSeries类型图表联动
setConnect (state, value) {
- state.isconnect = value
+ state.isConnect = value
},
// 设置当前鼠标所在的图表id (timeSeries类型图表联动)
setCurrentMousemove (state, value) {