Open FN-G opened 1 year ago
I'm sorry to close this issue for it lacks the necessary title. Please provide a descriptive and as concise as possible title to describe your problems or requests and then the maintainers or I will reopen this issue.
Every good bug report or feature request starts with a title. Your issue title is a critical element as it's the first thing maintainers see.
A good issue title makes it easier for maintainers to understand what the issue is, easily locate it, and know what steps they'll need to take to fix it.
Moreover, it's better to include keywords, as this makes it easier to find the issue self and similar issues in searches.
@FN-G It seems you are not using English, I've helped translate the content automatically. To make your issue understood by more people and get helped, we'd like to suggest using English next time. 🤗
Version
"echarts": "^5.0.0",
Link to Minimal Reproduction
使用dataZoom对横坐标时间轴进行缩放的时候,缩放到最小值不再缩放的时候会触发时间轴移动,图表不动的情况
Steps to Reproduce
import * as echarts from 'echarts' // import { max } from '_moment@2.29.1@moment' /**
@param data_2 第三根柱图数据 / var colors = ['red', 'green','#c23531']; //三种状态的颜色 var state = ['异常', '计划','停机']; //三种状态 export function drawOnlyBarChart(container, dataSource) { const doubleLine = echarts.init(document.getElementById(container), null, { renderer: 'svg' }) // 图表最大值和步进计算 let yMax = 0 let stepNum = 0 yMax = 100 stepNum = Math.floor(yMax / 5) const doubleLineOption = { color: colors, tooltip: {//提示框 formatter: function (params) { return params.name + ':' + params.value[1] + '~' + params.value[2]; }//数据的值 }, legend: {//图例 data: state, bottom: '1%', selectedMode: true, // 图例设为不可点击 textStyle: { color: '#000' } }, grid: {//绘图网格 left: '3%', right: '3%', top: '1%', bottom: '30%', containLabel: true }, dataZoom: [ { type: 'inside', filterMode: 'none', show: true, realtime: true, start: 0, height: 16, end: 100, bottom: 10, minValueSpan: 5000 } ], xAxis: {
type: 'time', min: '2009/6/1 00:00:00', max: '2009/6/1 23:59:59',
interval: 3600 1000, //以一个小时递增 min:'2009/6/1 1:00', //将data里最小时间的整点时间设为min,否则min会以data里面的min为开始进行整点递增 axisLabel: { formatter: function(value) { return '{HH}:{mm}:{ss}' } } }, yAxis: { data: ['异常', '计划','停机'] }, series: [ // 用空bar来显示三个图例 { name: state[0], type: 'bar', data: [] }, { name: state[1], type: 'bar', data: [] }, { name: state[2], type: 'bar', data: [] }, { type: 'custom',
renderItem: function (params, api) {//开发者自定义的图形元素渲染逻辑,是通过书写 renderItem 函数实现的 var categoryIndex = api.value(0);//这里使用 api.value(0) 取出当前 dataItem 中第一个维度的数值。 var start = api.coord([api.value(1), categoryIndex]); // 这里使用 api.coord(...) 将数值在当前坐标系中转换成为屏幕上的点的像素值。 var end = api.coord([api.value(2), categoryIndex]); // var height = api.size([0, 1])[1]; var height = 20
] } doubleLine.setOption(doubleLineOption) doubleLine.on('click', (e) => { console.log('点击----------e', e) }) window.addEventListener('resize', function() { doubleLine.resize() }) }
Current Behavior
我时间轴是当天的24小时,我有一段人员上班时间是当天的00:00:00 - 16:20:48,我鼠标滚轮事件对dataZoom对横坐标进行缩放的时候,缩放到最小的时候时间轴还在往左滑动,但是我的标记的区间还是停留在那里不动,就导致我这个标记刚开始是00:00:00 - 16:20:48,随着到最后我的这个标记不动时间轴动,这个区间就可能变成16:20:48之后的任何时间比如23:00:00 这是没有缩放的时候,我这个人员的结束时间大概是在16点多的时候 这是缩放到最后,就是刚开始的时候这个柱子的长度会随着时间变化,缩到最小缩放值之后,就开始横坐标时间轴一直向左移动,但是这个柱子不再变化,就导致这个柱子的实际时间跟看到的是对不上的
Expected Behavior
当缩放到最小不能再缩放的时候继续鼠标滚轮事件不要移动时间轴
Environment
Any additional comments?
No response