diff --git a/nezha-fronted/src/components/charts/chartDataFormat.js b/nezha-fronted/src/components/charts/chartDataFormat.js index 4a15ddef6..d8cbbc443 100644 --- a/nezha-fronted/src/components/charts/chartDataFormat.js +++ b/nezha-fronted/src/components/charts/chartDataFormat.js @@ -559,42 +559,50 @@ let unitOptions=[ { value:26, compute:Hertz, - label:'Hertz (1/s)' + label:'Hertz (1/s)', + ascii:1, }, { value:27, compute:nanoseconds, - label:'nanoseconds (ns)' + label:'nanoseconds (ns)', + ascii:1000, }, { value:28, compute:microseconds, - label:'microseconds (us)' + label:'microseconds (us)', + ascii:1000, }, { value:29, compute:milliseconds, - label:'milliseconds (ms)' + label:'milliseconds (ms)', + ascii:60, }, { value:30, compute:seconds, - label:'seconds (s)' + label:'seconds (s)', + ascii:60, }, { value:31, compute:minutes, - label:'minutes (m)' + label:'minutes (m)', + ascii:60, }, { value:32, compute:hours, - label:'hours (h)' + label:'hours (h)', + ascii:24, }, { value:33, compute:days, - label:'days (d)' + label:'days (d)', + ascii:7, }, ] }//Time end @@ -627,10 +635,27 @@ export default { formatData:function(value,unit){ return this.getUnit(unit).compute(value,null,2) }, - formatDatas:function(value,type,flow='ceil'){ + formatDatas:function(value,type,flow='ceil',ascii){ let pow=0; if(type ==='Time'){ - return value + if(value>1 && ascii!==1){ + while(value>ascii){ + pow++; + value=value/ascii + } + + if(flow==='ceil'){ + let length=JSON.stringify(Math.ceil(value)).length; + value=value/Math.pow(10,length-1); + return Math.ceil(value)*Math.pow(ascii,pow)*Math.pow(10,length-1); + }else if(flow==='floor'){ + let length=JSON.stringify(Math.floor(value)).length; + value=value/Math.pow(10,length-1); + return Math.floor(value)*Math.pow(ascii,pow)*Math.pow(10,length-1); + } + }else{ + return value + } } if(type==='Data' || type==='DataRate'){ @@ -693,12 +718,16 @@ export default { } }, Interval:function(value,copies,type){ - if(type==='Data' || type==='DataRate' || type==='Misc'){ - let interVal=value/copies; - interVal = interVal || 1; - console.log(interVal); - return interVal - } - return 1; + // if(type==='Data' || type==='DataRate' || type==='Misc'){ + // let interVal=value/copies; + // interVal = interVal || 1; + // console.log(interVal); + // return interVal + // } + // return 1; + let interVal=value/copies; + interVal = interVal || 1; + console.log(interVal); + return interVal } } diff --git a/nezha-fronted/src/components/charts/line-chart-block.vue b/nezha-fronted/src/components/charts/line-chart-block.vue index 7821d0b49..1094feb50 100644 --- a/nezha-fronted/src/components/charts/line-chart-block.vue +++ b/nezha-fronted/src/components/charts/line-chart-block.vue @@ -496,9 +496,9 @@ let stackIconBorderColor = (chartInfo.type==='stackArea'?'#53a3cb':'#7e7e7e'); let stackIconChooseBorderColor = (chartInfo.type==='stackArea'?'#7e7e7e':'#53a3cb'); console.log(chartInfo, dataArg, chartSite,legend); - let maxValue=''; - let minValue=''; - if(chartInfo.type==='line' && chartInfo.unit){ + let maxValue=0; + let minValue=0; + if(chartInfo.type==='line' && chartInfo.unit &&dataArg.length>0){ maxValue=dataArg[0].data[0][1]; minValue=dataArg[0].data[0][1]; for(let j = 0; j < dataArg.length ; j++){ @@ -510,8 +510,8 @@ } let chartUnit=chartInfo.unit?chartInfo.unit:2; let unit=chartDataFormat.getUnit(chartUnit); - maxValue=chartDataFormat.formatDatas(maxValue,unit.type,'ceil'); - minValue=chartDataFormat.formatDatas(minValue,unit.type,'floor'); + maxValue=chartDataFormat.formatDatas(maxValue,unit.type,'ceil',unit.ascii); + minValue=chartDataFormat.formatDatas(minValue,unit.type,'floor',unit.ascii); let oldValue=maxValue; console.log(maxValue,'123123'); let dot=0; @@ -531,7 +531,7 @@ dot++; } let copies=chartDataFormat.copies(oldValue); - console.log(oldValue,copies,maxValue) + console.log(oldValue,copies,maxValue); let oldDot=2; if(maxValue<=1){ oldDot=dot>6?6:dot; @@ -767,9 +767,6 @@ let chartUnit=chartInfo.unit; chartUnit=chartUnit?chartUnit:2; let unit=chartDataFormat.getUnit(chartUnit); - console.log(value); - // console.log(value,unit,unit.compute(value,index),123); - //console.info(value, chartUnit, unit.compute(value,index)) return unit.compute(value,index,-1,dot); }, }, diff --git a/nezha-fronted/src/components/common/project/popData/lineChart.vue b/nezha-fronted/src/components/common/project/popData/lineChart.vue index bd799044b..fa0e7ca51 100644 --- a/nezha-fronted/src/components/common/project/popData/lineChart.vue +++ b/nezha-fronted/src/components/common/project/popData/lineChart.vue @@ -443,6 +443,46 @@ }; let stackIconBorderColor = (chartInfo.type==='stackArea'?'#53a3cb':'#7e7e7e'); let stackIconChooseBorderColor = (chartInfo.type==='stackArea'?'#7e7e7e':'#53a3cb'); + let maxValue=0; + let minValue=0; + if(chartInfo.type==='line' && chartInfo.unit &&dataArg.length>0){ + maxValue=dataArg[0].data[0][1]; + minValue=dataArg[0].data[0][1]; + for(let j = 0; j < dataArg.length ; j++){ + for (let i = 0; i < dataArg[j].data.length - 1; i++) { + maxValue = (maxValue < dataArg[j].data[i+1][1] ? dataArg[j].data[i+1][1] : maxValue); + minValue = (minValue > dataArg[j].data[i+1][1] ? dataArg[j].data[i+1][1] : minValue); + } + } + } + let chartUnit=chartInfo.unit?chartInfo.unit:2; + let unit=chartDataFormat.getUnit(chartUnit); + maxValue=chartDataFormat.formatDatas(maxValue,unit.type,'ceil',unit.ascii); + minValue=chartDataFormat.formatDatas(minValue,unit.type,'floor',unit.ascii); + let oldValue=maxValue; + console.log(maxValue,'123123'); + let dot=0; + if(maxValue==1){ + dot++; + } + if(oldValue>10){ + while(oldValue>10){ + oldValue=oldValue/10; + } + }else if(oldValue<1&&maxValue!==0){ + while(oldValue<1&&oldValue>0){ + oldValue=oldValue*10; + dot++; + } + maxValue=Math.ceil(oldValue)/Math.pow(10,dot); + dot++; + } + let copies=chartDataFormat.copies(oldValue); + console.log(oldValue,copies,maxValue); + let oldDot=2; + if(maxValue<=1){ + oldDot=dot>6?6:dot; + } var option = { title:{ show:false, @@ -705,7 +745,7 @@ axisLine:{ show:false }, - minInterval: 1, + minInterval: chartDataFormat.Interval(maxValue,copies,unit.type), axisTick: { show: false, },