liuweijiaCHN opened a new issue, #19587:
URL: https://github.com/apache/echarts/issues/19587

   ### Version
   
   5.4.3
   
   ### Link to Minimal Reproduction
   
    https://cdn.staticfile.org/echarts/5.4.3/echarts.js
   
   ### Steps to Reproduce
   
                   var chartDom = document.getElementById('tmgraph');
                   chartDom.style.display="block";
                   chartDom.style.width='100%';
                   //chartDom.style.height='2500px';
                   var m_file=document.getElementById('mfile').innerHTML;
                   var m_x=document.getElementById('mx').innerHTML;
                   var m_y=document.getElementById('my').innerHTML;
                   var m_cnt=document.getElementById('cnt').innerHTML;
                   len=Math.floor((m_cnt/90)*2500);
                   chartDom.style.height=len+'px';
                   function shuffle(arr) {
                     return arr.sort(() => Math.random() - 0.5);
                   }
                   var 
l_colors=['#ffb6c1','#ffc0cb','#dc143c','#fff0f5','#db7093','#ff69b4','#ff1493','#c7158
   
5','#da70d6','#d8bfd8','#dda0dd','#ee82ee','#ff00ff','#ff00ff','#8b008b','#800080','#ba55d3','#9400d3','#99
   
32cc','#4b0082','#8a2be2','#9370db','#7b68ee','#6a5acd','#483d8b','#e6e6fa','#f8f8ff','#0000ff','#0000cd','
   
#191970','#00008b','#000080','#4169e1','#6495ed','#b0c4de','#778899','#708090','#1e90ff','#f0f8ff','#4682b4
   
','#87cefa','#87ceeb','#00bfff','#add8e6','#b0e0e6','#5f9ea0','#f0ffff','#e1ffff','#afeeee','#00ffff','#00f
   
fff','#00ced1','#2f4f4f','#008b8b','#008080','#48d1cc','#20b2aa','#40e0d0','#7fffaa','#00fa9a','#f5fffa','#
   
00ff7f','#3cb371','#2e8b57','#f0fff0','#90ee90','#98fb98','#8fbc8f','#32cd32','#00ff00','#228b22','#008000'
   
,'#006400','#7fff00','#7cfc00','#adff2f','#556b2f','#6b8e23','#fafad2','#fffff0','#ffffe0','#ffff00','#8080
   
00','#bdb76b','#fffacd','#eee8aa','#f0e68c','#ffd700','#fff8dc','#daa520','#fffaf0','#fdf5e6','#f5deb3','#f
   
fe4b5','#ffa500','#ffefd5','#ffebcd','#ffdead','#faebd7','#d2b48c','#deb887','#ffe4c4','#ff8c00','#faf0e6',
   
'#cd853f','#ffdab9','#f4a460','#d2691e','#8b4513','#fff5ee','#a0522d','#ffa07a','#ff7f50','#ff4500','#e9967
   
a','#ff6347','#ffe4e1','#fa8072','#fffafa','#f08080','#bc8f8f','#cd5c5c','#ff0000','#a52a2a','#b22222','#8b
   
0000','#800000','#f5f5f5','#dcdcdc','#d3d3d3','#c0c0c0','#a9a9a9','#808080','#696969','#000000'];
                   l_colors=shuffle(l_colors);
                   var myChart = echarts.init(chartDom);
                   var option;
                   const updateFrequency = 6000;
                   const dimension = 0;
                   myChart.showLoading();
                   $.when($.get('my_urls',function( d ){
                           } )).done(function (data) {
                           myChart.hideLoading();
                           const flags = '';
                           const years = [];
                           var colorm=new Map();
                           var c_idx=Math.floor(Math.random() * 
10)%l_colors.length;
                           for (let i = 0; i < data.length; ++i) {
                                   if (years.length === 0 || years[years.length 
- 1] !== data[i][4]) {
                                           years.push(data[i][4]);
                                   }
                                   if(colorm.has(data[i][3])==false){
                                           colorm[data[i][3]]=l_colors[c_idx];
                                           c_idx=(c_idx+1)%l_colors.length;
                                   }
                           }
                           function getFlag(countryName) {
                                   return '';
                           }
                           let startIndex = 1;
                           let startYear = years[startIndex];
                           option = {
                                   grid: {
                                           top: 10,
                                           bottom: 30,
                                           left: 150,
                                           right: 80
                                   },
                                   xAxis: {
                                           max:function (value){
                                                   if(value.max>m_x){
                                                           return m_x;
                                                   }
                                                   return value.max;
                                           },
                                           min:function (value) {
                                                   if(value.min< m_y){
                                                           return m_y;
                                                   }
                                               return value.min;
                                           },
                                           axisLabel: {
                                                   formatter: function (n) {
                                                   return n+'%';
                                                   }
                                           }
                                   },
                                   dataset: {
                                           source: 
data.slice(1).filter(function (d) {
                                                   return d[4] === startYear;
                                           })
                                   },
                                   yAxis: {
                                           type: 'category',
                                           inverse: true,
                                           //max: function (value) {
                                           //    return value.max;
                                           //      },
                                           axisLabel: {
                                                   show: true,
                                                   fontSize: 10,
                                                   formatter: function (value) {
                                                           return value;
                                                   },
                                                   rich: {
                                                           flag: {
                                                                   fontSize: 25
                                                           }
                                                   }
                                           },
                                           animationDuration: 300,
                                           animationDurationUpdate: 300
                                   },
                                   series: [
                                   {
                                           realtimeSort: true,
                                           seriesLayoutBy: 'column',
                                           type: 'bar',
                                           itemStyle: {
                                                   color: function (param) {
                                                   return 
colorm[param.value[3]] || '#5470c6';
                                                   //return '#5470c6';
                                                   }
                                           },
                                           encode: {
                                                   x: dimension,
                                                   y: 3
                                           },
                                           label: {
                                                   show: true,
                                                   precision: 1,
                                                   position: 'insideLeft',
                                                   valueAnimation: true,
                                                   fontFamily: 'monospace',
                                                   formatter:function(val){
                                                    return 
'7天:'+val.data[2].toFixed(2)+'%,15天:'+val.data[1]
   .toFixed(2)+'%,30天:'+val.data[0].toFixed(2)+'%';
                                                   }
                                           }
                                   }
                                   ],
                                   // Disable init animation.
                                   animationDuration: 0,
                                   animationDurationUpdate: updateFrequency,
                                   animationEasing: 'linear',
                                   animationEasingUpdate: 'linear',
                                   graphic: {
                                           elements: [
                                           {
                                                   type: 'text',
                                                   right: 160,
                                                   top: 100,
                                                   style: {
                                                           text: startYear,
                                                           font: 'bolder 80px 
monospace',
                                                           fill: 'rgba(100, 
100, 100, 0.25)'
                                                   },
                                                   z: 100
                                           }
                                   ]
                           }
                   };
                   // console.log(option);
                   myChart.setOption(option);
                   for (let i = startIndex; i < years.length - 1; ++i) {
                           (function (i) {
                                   setTimeout(function () {
                                           updateYear(years[i + 1]);
                                   }, (i - startIndex) * updateFrequency);
                           })(i);
                   }
                   function updateYear(year) {
                           let source = data.slice(1).filter(function (d) {
                                   return d[4] === year;
                           });
                           option.series[0].data = source;
                           option.graphic.elements[0].style.text = year;
                           myChart.setOption(option);
                   }
           });
           option && myChart.setOption(option);
           });
           }
   
   
   
   ### Current Behavior
   
    option = {     
                   xAxis: {
                       max:function (value){
                           if(value.max>0.5){
                               return m_x;
                           }
                           return value.max;
                       }
                  }
   当数值大于0.5时,bar的柱子高度就是0.5,但是排序也用的是0.5,而不是真实的value,导致排序随机。
   
   
   
   
   ### Expected Behavior
   
   echarts.js:44469 
   44469           var orderMapping_1 = function (idx) {
   44470             var el = data.getItemGraphicEl(idx);
   44471             if(option.use_true_value==1){                       //  
add some code here
   44472                    var v = data._store._chunks[0][idx];        //  add 
some code here
   44473                   return v;                                            
       // add some code here
   44474              }                                                         
           // add some code here
   44475             var shape = el && el.shape;
   44476             return shape && // The result should be consistent with 
the initial sort by data value.
   44477             // Do not support the case that both positive and negative 
exist.
   44478             Math.abs(baseAxis.isHorizontal() ? shape.height : 
shape.width) // If data is NaN, shape      .xxx may be NaN, so use || 0 here in 
case
   44479             || 0;
   
   
   ### Environment
   
   ```markdown
   - OS:
   - Browser:
   - Framework:
   ```
   
   
   ### Any additional comments?
   
   series.realtimeSort 加一个属性,use_true_value:1 ,使用原始真值来排序。


-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

To unsubscribe, e-mail: commits-unsubscr...@echarts.apache.org.apache.org

For queries about this service, please contact Infrastructure at:
us...@infra.apache.org


---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscr...@echarts.apache.org
For additional commands, e-mail: commits-h...@echarts.apache.org

Reply via email to