fix：fix datazoom drag to change label show

components/DashboardProgress/DashboardProgress.vue

@@ -36,7 +36,6 @@
 			inited(canvas, width, height, canvasDpr) {
 				var scale = 1.0
 				const { windowWidth } = uni.getSystemInfoSync()
-				console.log('window width is : ', windowWidth)
 				if (windowWidth < 400) {
 					scale = 1.25
 				}

components/HorizontalBar/HorizontalBar.vue

@@ -8,6 +8,7 @@
 	import echartElementData from '@/mixins/echartElementData.js'
     import { DATAZOOM_DEFAULT } from '@/mixins/zoomConfig.js'
 	let chart = null
+	let lastCount = 0  // 记录datazoom最后一次滑动的数值数量
 
 	export default {
 		name: "HorizontalBar",
@@ -99,6 +100,7 @@
 						if(count > this.elementInfo.option.dataset.maxCount) {
 							this.elementInfo.option.dataset.show = false
 						}
+						lastCount = count
 					}
 					
 					const dealSeries = this.dealSeriesData(series)
@@ -166,23 +168,38 @@
 			},
 			/**
 			 * 处理图表的数值是否显示
-			 * 超过10个时隐藏点的数值
+			 * 超过maxCount个时隐藏点的数值
 			 * event： 包含dataZoom的start和end
 			*/
 			dealLabelShowStatus(event) {
 				// 当前图表初始设置了labelShow=true时，才判断超过10个隐藏
 				if(this.labelShow) {
+					var flag = false
 					const count = this.elementData.dataList.categories.length * (event.end - event.start) / 100
-					const option = chart.getOption()
+					const maxCount = this.elementInfo.option.dataset.maxCount
+					if(lastCount < count && lastCount <= maxCount  && count > maxCount ) {
+						// 放大的情况
+						flag = true
+					}
+					if(lastCount > count && lastCount >= maxCount && count < maxCount) {
+						// 缩小的情况
+						flag = true
+					}
+					lastCount = count
+					if(flag) {
+						var option = chart.getOption()
 						// TODO：切换全屏后返回，chart实例不存在了
 						if(!option) {
+							// 这样处理没有效果
+							option = this.ec.option
 							return
 						}
 						const series = option.series
 						series.map(item => {
 							item.label.show = count <= this.elementInfo.option.dataset.maxCount
 						})
-					chart.setOption(option)
+						chart.setOption({series: series})						
+					}
 				}	
 			}
 		}

components/LineMixBar/LineMixBar.vue

@@ -14,6 +14,7 @@
     import { DATAZOOM_DEFAULT } from '@/mixins/zoomConfig.js'
     import { svg } from '@/mixins/svg.js'
 	let chart = null
+	let lastCount = 0  // 记录datazoom最后一次滑动的数值数量
 
 	export default {
 		name: "LineMixBar",
@@ -107,6 +108,7 @@
 						if(count > this.elementInfo.option.dataset.maxCount) {
 							this.elementInfo.option.dataset.show = false
 						}
+						lastCount = count
 					}
 					const dealSeries = this.dealSeriesData(series)
 					this.$set(this.ec.option, 'xAxis.data', categories)
@@ -156,26 +158,40 @@
 			},
 			/**
 			 * 处理图表的数值是否显示
-			 * 超过10个时隐藏点的数值
+			 * 超过maxCount个时隐藏点的数值
 			 * event： 包含dataZoom的start和end
 			*/
 			dealLabelShowStatus(event) {
 				// 当前图表初始设置了labelShow=true时，才判断超过10个隐藏
 				if(this.labelShow) {
+					var flag = false
 					const count = this.elementData.dataList.categories.length * (event.end - event.start) / 100
-					const option = chart.getOption()
+					const maxCount = this.elementInfo.option.dataset.maxCount
+					if(lastCount < count && lastCount <= maxCount  && count > maxCount ) {
+						// 放大的情况
+						flag = true
+					}
+					if(lastCount > count && lastCount >= maxCount && count < maxCount) {
+						// 缩小的情况
+						flag = true
+					}
+					lastCount = count
+					if(flag) {
+						var option = chart.getOption()
 						// TODO：切换全屏后返回，chart实例不存在了
 						if(!option) {
+							// 这样处理没有效果
+							option = this.ec.option
 							return
 						}
 						const series = option.series
 						series.map(item => {
 							item.label.show = count <= this.elementInfo.option.dataset.maxCount
 						})
-					chart.setOption(option)
+						chart.setOption({series: series})						
+					}
 				}	
 			}
-			
 		}
 	}
 </script>

components/NormalBar/NormalBar.vue

@@ -9,6 +9,7 @@
     import { DATAZOOM_DEFAULT } from '@/mixins/zoomConfig.js'
     import { svg } from '@/mixins/svg.js'
 	let chart = null
+	let lastCount = 0  // 记录datazoom最后一次滑动的数值数量
 
 	export default {
 		name: "Normalbar",
@@ -93,6 +94,7 @@
 						if(count > this.elementInfo.option.dataset.maxCount) {
 							this.elementInfo.option.dataset.show = false
 						}
+						lastCount = count
 					}
 					const dealSeries = this.dealSeriesData(series)
 					this.$set(this.ec.option, 'xAxis.data', categories)
@@ -133,23 +135,38 @@
 			},
 			/**
 			 * 处理图表的数值是否显示
-			 * 超过10个时隐藏点的数值
+			 * 超过maxCount个时隐藏点的数值
 			 * event： 包含dataZoom的start和end
 			*/
 			dealLabelShowStatus(event) {
 				// 当前图表初始设置了labelShow=true时，才判断超过10个隐藏
 				if(this.labelShow) {
+					var flag = false
 					const count = this.elementData.dataList.categories.length * (event.end - event.start) / 100
-					const option = chart.getOption()
+					const maxCount = this.elementInfo.option.dataset.maxCount
+					if(lastCount < count && lastCount <= maxCount  && count > maxCount ) {
+						// 放大的情况
+						flag = true
+					}
+					if(lastCount > count && lastCount >= maxCount && count < maxCount) {
+						// 缩小的情况
+						flag = true
+					}
+					lastCount = count
+					if(flag) {
+						var option = chart.getOption()
 						// TODO：切换全屏后返回，chart实例不存在了
 						if(!option) {
+							// 这样处理没有效果
+							option = this.ec.option
 							return
 						}
 						const series = option.series
 						series.map(item => {
 							item.label.show = count <= this.elementInfo.option.dataset.maxCount
 						})
-					chart.setOption(option)
+						chart.setOption({series: series})						
+					}
 				}	
 			}
 		}

components/NormalLine/NormalLine.vue

@@ -9,6 +9,7 @@
     import { DATAZOOM_DEFAULT } from '@/mixins/zoomConfig.js'
     import { svg } from '@/mixins/svg.js'
 	let chart = null
+	let lastCount = 0  // 记录datazoom最后一次滑动的数值数量
 
 	export default {
 		mixins: [echartElementData],
@@ -18,7 +19,7 @@
 					lazyLoad: true,
 					option: {}
 				},
-				labelShow: false  // 记录当前设置的label.show的值
+				labelShow: false  ,// 记录当前设置的label.show的值
 			}
 		},
 		components: {
@@ -88,23 +89,24 @@
 					const { categories, series } = this.elementData.dataList
 					if(this.labelShow) {
 					// 处理初始状态时，数值显示的数量是否超过了配置的最大值
-						let count = categories.length
+						var count = categories.length
 						if(this.elementInfo.dataZoom && this.elementInfo.dataZoom.show) {
 							count = count * (this.elementInfo.dataZoom.end - this.elementInfo.dataZoom.start) / 100
 						}
 						if(count > this.elementInfo.option.dataset.maxCount) {
 							this.elementInfo.option.dataset.show = false
 						}
+						lastCount = count
 					}
 					const dealSeries = this.dealSeriesData(series)
 					this.$set(this.ec.option, 'xAxis.data', categories)
 					this.$set(this.ec.option, 'series', dealSeries)
 					this.$set(this.ec.option, 'dataZoom', this.elementInfo.dataZoom && this.elementInfo.dataZoom.show ? [{...this.elementInfo.dataZoom,...DATAZOOM_DEFAULT}] : [{show: false}])
 					if(chart) {
-						const option = chart.getOption()
-						option.series = dealSeries
 						// 重新setOption，使得设置的formatter生效
-						chart.setOption(option)
+						chart.setOption({
+							series: dealSeries
+						})
 					}
 				})
 			},
@@ -135,23 +137,38 @@
 			},
 			/**
 			 * 处理图表的数值是否显示
-			 * 超过10个时隐藏点的数值
+			 * 超过maxCount个时隐藏点的数值
 			 * event： 包含dataZoom的start和end
 			*/
 			dealLabelShowStatus(event) {
 				// 当前图表初始设置了labelShow=true时，才判断超过10个隐藏
 				if(this.labelShow) {
+					var flag = false
 					const count = this.elementData.dataList.categories.length * (event.end - event.start) / 100
-					const option = chart.getOption()
+					const maxCount = this.elementInfo.option.dataset.maxCount
+					if(lastCount < count && lastCount <= maxCount  && count > maxCount ) {
+						// 放大的情况
+						flag = true
+					}
+					if(lastCount > count && lastCount >= maxCount && count < maxCount) {
+						// 缩小的情况
+						flag = true
+					}
+					lastCount = count
+					if(flag) {
+						var option = chart.getOption()
 						// TODO：切换全屏后返回，chart实例不存在了
 						if(!option) {
+							// 这样处理没有效果
+							option = this.ec.option
 							return
 						}
 						const series = option.series
 						series.map(item => {
 							item.label.show = count <= this.elementInfo.option.dataset.maxCount
 						})
-					chart.setOption(option)
+						chart.setOption({series: series})						
+					}
 				}	
 			}
 		}

pages/details/details.vue

@@ -119,14 +119,11 @@
 			uni.$on('handleDataZoomParams', ({index, paramName, value}) => {
 				if(index.length && paramName && value) {
 					that.reportInfo.list = that.reportInfo.list.map(item => {
-						console.log('begin item', item)
 						const flag = index.includes(item.id)
 						if(flag && item.dataZoom) {
-							console.log('set item', item)
 							that.$set(item.dataZoom, 'start', value.start)
 							that.$set(item.dataZoom, 'end', value.end)
 						}
-						console.log('after item', item)
 						return item
 					})
 				}