diff --git a/nezha-fronted/package-lock.json b/nezha-fronted/package-lock.json index 9766e358d..8f4454e48 100644 --- a/nezha-fronted/package-lock.json +++ b/nezha-fronted/package-lock.json @@ -17659,7 +17659,7 @@ }, "showdown": { "version": "2.1.0", - "resolved": "https://registry.npmjs.org/showdown/-/showdown-2.1.0.tgz", + "resolved": "https://registry.npmmirror.com/showdown/-/showdown-2.1.0.tgz", "integrity": "sha512-/6NVYu4U819R2pUIk79n67SYgJHWCce0a5xTP979WbNp0FL9MN1I1QK662IDU1b6JzKTvmhgI7T7JYIxBi3kMQ==", "requires": { "commander": "^9.0.0" @@ -17667,7 +17667,7 @@ "dependencies": { "commander": { "version": "9.5.0", - "resolved": "https://registry.npmjs.org/commander/-/commander-9.5.0.tgz", + "resolved": "https://registry.npmmirror.com/commander/-/commander-9.5.0.tgz", "integrity": "sha512-KRs7WVDKg86PWiuAqhDrAQnTXZKraVcCc6vFdL14qrZ/DcWwuRo7VoiYXalXO7S5GKpqYiVEwCbgFDfxNHKJBQ==" } } @@ -19368,7 +19368,7 @@ "tmp": { "version": "0.0.29", "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.29.tgz", - "integrity": "sha1-8lEl/w3Z2jzLDC3Tce4SiLuRKMA=", + "integrity": "sha512-89PTqMWGDva+GqClOqBV9s3SMh7MA3Mq0pJUdAoHuF65YoE7O0LermaZkVfT5/Ngfo18H4eYiyG7zKOtnEbxsw==", "dev": true, "requires": { "os-tmpdir": "~1.0.1" diff --git a/nezha-fronted/src/assets/css/components/chart/chart.scss b/nezha-fronted/src/assets/css/components/chart/chart.scss index 0a1564981..e3094f8fd 100644 --- a/nezha-fronted/src/assets/css/components/chart/chart.scss +++ b/nezha-fronted/src/assets/css/components/chart/chart.scss @@ -412,6 +412,9 @@ .nz-icon{ color: $--background-color-1 !important; } + .nz-icon-override{ + color: $--color-text-regular !important; + } } } .nz-icon-override{ @@ -419,6 +422,7 @@ font-size: 15px; margin-left: 5px; vertical-align: middle; + color: $--color-text-regular !important; } .legend-item:hover { background-color: $--background-color-1; diff --git a/nezha-fronted/src/components/chart/chart/chartTimeSeries.vue b/nezha-fronted/src/components/chart/chart/chartTimeSeries.vue index 62523f5ff..1bae9c340 100644 --- a/nezha-fronted/src/components/chart/chart/chartTimeSeries.vue +++ b/nezha-fronted/src/components/chart/chart/chartTimeSeries.vue @@ -256,9 +256,31 @@ export default { } myChart.on('mouseover', (params) => { + if (this.chartInfo.type !== 'point') { + if (this.tooltip.activeIndex != params.seriesIndex) { + const option = myChart.getOption() + option.series[params.seriesIndex].symbol = 'circle' + option.series[params.seriesIndex].emphasis.itemStyle = { + opacity: 1, + borderColor: this.hexToRgb(params.color, 0.4), + borderWidth: 6 + } + myChart.setOption(option, true) + } + } this.tooltip.activeIndex = params.seriesIndex }) - myChart.on('mouseout', () => { + myChart.on('mouseout', (params) => { + if (this.chartInfo.type !== 'point') { + const option = myChart.getOption() + option.series.forEach(item => { + item.symbol = 'emptyCircle' + item.emphasis.itemStyle = { + opacity: 1 + } + }) + myChart.setOption(option, true) + } this.tooltip.activeIndex = undefined }) @@ -450,7 +472,7 @@ export default { // 鼠标悬浮 series data symbol 时,tooltip 中相应的legend 高亮显示 str += ` -
+
${seriesName} diff --git a/nezha-fronted/src/components/chart/chart/legend.vue b/nezha-fronted/src/components/chart/chart/legend.vue index e7f6f7593..0c9ffcea4 100644 --- a/nezha-fronted/src/components/chart/chart/legend.vue +++ b/nezha-fronted/src/components/chart/chart/legend.vue @@ -272,10 +272,12 @@ export default { this.$emit('clickLegendD3', this.isGrey) }, hoverLegend (legendName, index, type) { + // legend 已经取消显示,鼠标悬浮,不开启 高亮效果 + if (this.isGrey[index]) { + return false + } if (this.chartInfo.type === 'pie' || this.chartInfo.type === 'doughnut' || this.chartInfo.type === 'rose') { - if (!this.isGrey[index]) { - this.$emit('hoverLegendD3', legendName, index, type) - } + this.$emit('hoverLegendD3', legendName, index, type) } else if (this.isTimeSeries) { getChart(this.chartId) && getChart(this.chartId).dispatchAction({ type: type, diff --git a/nezha-fronted/src/components/chart/chart/options/chartTimeSeries.js b/nezha-fronted/src/components/chart/chart/options/chartTimeSeries.js index 9145789d4..13eb34bbf 100644 --- a/nezha-fronted/src/components/chart/chart/options/chartTimeSeries.js +++ b/nezha-fronted/src/components/chart/chart/options/chartTimeSeries.js @@ -91,6 +91,9 @@ export const chartTimeSeriesLineOption = { }, axisTick: { show: false + }, + axisPointer: { + snap: true } }, yAxis: [ @@ -149,16 +152,27 @@ export const chartTimeSeriesLineOption = { type: 'line', symbol: 'emptyCircle', // 去掉点 connectNulls: true, - symbolSize: [2, 2], + symbolSize: [6, 6], smooth: 0.2, // 曲线变平滑 - showSymbol: false, + // showSymbol: false, + itemStyle: { + opacity: 0 + }, data: [], lineStyle: { width: 1, opacity: 0.9 }, emphasis: { - focus: 'series' + focus: 'series', + itemStyle: { + opacity: 1 + } + }, + blur: { + lineStyle: { + opacity: 0.3 + } } }], useUTC: false // 使用本地时间