You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@echarts.apache.org by GitBox <gi...@apache.org> on 2022/08/10 04:44:24 UTC

[GitHub] [echarts] CrazyWood007 opened a new issue, #17494: [Bug]

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

   ### Version
   
   5.3.2
   
   ### Link to Minimal Reproduction
   
   https://codepen.io/crazywood007/pen/vYRaJzL
   
   ### Steps to Reproduce
   
   1. Create chart at any site, it dos't matter.
   2. The option is:
   {
     grid: {
       left: 50,
       right: 46,
       bottom: 60,
       top: 50,
       containLabel: true
     },
     toolbox: {
       show: false,
       top: 5,
       right: 40,
       iconStyle: {
         normal: {
           borderColor: 'rgba(255, 255, 255, 0.6)'
         },
         emphasis: {
           borderColor: '#00ccff'
         }
       },
       feature: {
         dataZoom: {
           yAxisIndex: 'none',
           title: {
             zoom: 'Zoom-in',
             back: 'Revert'
           }
         },
         restore: {
           title: 'Revert to original'
         },
         saveAsImage: {
           name: 'hhh',
           backgroundColor: 'rgb(9, 77, 103)',
           title: 'Save as png',
           pixelRatio: 1.2
         }
       },
       showTitle: false,
       tooltip: {
         show: true,
         backgroundColor: '#222',
         textStyle: {
           fontSize: 12
         },
         confine: true,
         extraCssText: 'box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);'
       }
     },
     dataZoom: [
       {
         show: true,
         showDetail: false,
         yAxisIndex: 0,
         start: 0,
         end: 100,
         backgroundColor: 'transparent',
         fillerColor: 'rgba(0, 204, 255, 0.3)',
         borderColor: 'rgba(255, 255, 255, 0.3)',
         textStyle: {
           color: 'rgba(255,255,255,0.4)'
         },
         handleStyle: {
           color: '#00ccff'
         }
       }
     ],
     tooltip: {
       trigger: 'item',
       backgroundColor: 'rgba(0, 0, 0, 0.8)',
       borderWidth: 1,
       padding: 8,
       textStyle: {
         fontSize: 12,
         color: '#ffffff'
       },
       borderColor: '#00ccff'
     },
     legend: {
       data: ['label1', 'label2'],
       bottom: 35,
       left: 'center'
     },
     xAxis: {
       type: 'category',
       data: ['2022-01-01', '2022-01-02'],
       splitArea: {
         show: true
       },
       axisLabel: {
         show: true,
         interval: 4
       },
       splitLine: {
         show: false
       },
       axisTick: {
         show: false,
         alignWithLabel: true
       }
     },
     yAxis: {
       type: 'category',
       data: ['ALongLongLongName1', 'ALongLongLongName2'],
       splitArea: {
         show: true
       },
       axisLine: {
         show: false
       },
       axisTick: {
         show: false
       },
       axisPointer: {
         show: true,
         snap: false,
         trigger: 'item',
         type: 'shadow',
         shadowStyle: {
           color: 'transparent'
         },
         label: {
           margin: 100,
           backgroundColor: 'green'
         }
       },
       axisLabel: {
         width: 50,
         overflow: 'truncate' // 截断,显示...
       }
     },
     visualMap: [
       {
         min: 0,
         max: 20000,
         range: [0, 20000],
         precision: 2,
         calculable: true,
         orient: 'horizontal',
         left: 'center',
         bottom: '10',
         seriesIndex: 0,
         color: ['#FFCC66', '#00CCFF'],
         text: ['High', 'Low'],
         itemWidth: 14,
         itemHeight: 360,
         textStyle: {
           color: 'rgba(255,255,255,0.6)'
         }
       },
       {
         min: 0,
         max: 0,
         calculable: true,
         orient: 'horizontal',
         left: 'center',
         bottom: '100',
         seriesIndex: 1,
         zlevel: 1,
         show: false,
         color: ['#FF5F74']
       }
     ],
     series: [
       {
         name: 'label1',
         type: 'heatmap',
         label: {
           normal: {
             color: '#ffffff',
             fontSize: 14
           }
         },
         itemStyle: {
           emphasis: {
             borderColor: 'rgb(98, 118, 128)'
           },
           normal: {
             borderColor: 'rgb(98, 118, 128)',
             color: {
               colorStops: [
                 {
                   offset: 0,
                   color: '#FFCC66'
                 },
                 {
                   offset: 1,
                   color: '#00CCFF'
                 }
               ]
             }
           }
         },
         symbol: 'circle',
         symbolSize: 2,
         showSymbol: true,
         showAllSymbol: true,
         hoverAnimation: true,
         data: [
           ['2022-01-01', 'ALongLongLongName2', 1111],
           ...Array(1999)
             .fill(1)
             .map(() => ['1', '1', 1])
         ],
         unit: 'kWh'
       },
       {
         name: 'label2',
         type: 'heatmap',
         label: {
           normal: {
             color: '#ffffff',
             fontSize: 14
           }
         },
         itemStyle: {
           emphasis: {
             borderColor: 'rgb(98, 118, 128)'
           },
           normal: {
             borderColor: 'rgb(98, 118, 128)',
             color: '#FF5F74'
           }
         },
         symbol: 'circle',
         symbolSize: 2,
         showSymbol: true,
         showAllSymbol: true,
         hoverAnimation: true,
         data: Array(964)
           .fill(1)
           .map(() => ['1', '1', 1]),
         unit: 'kWh'
       }
     ]
   }
   3. In this option, there are 2 series. When the total length is more then 2963 or more then 2958(change toolbox.show to true),  the axisPointer.label will be covered.
   
   ### Current Behavior
   
   ![image](https://user-images.githubusercontent.com/44600593/183817458-6807df52-4679-4976-be3f-125c791eb6f6.png)
   
   
   ### Expected Behavior
   
   ![image](https://user-images.githubusercontent.com/44600593/183817548-36cecf5a-5a25-4efd-9bec-633be0df1da6.png)
   
   
   ### Environment
   
   ```markdown
   - OS:
   - Browser:
   - Framework:
   ```
   
   
   ### Any additional comments?
   
   _No response_


-- 
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-unsubscribe@echarts.apache.org.apache.org

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


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


[GitHub] [echarts] echarts-bot[bot] commented on issue #17494: [Bug]

Posted by GitBox <gi...@apache.org>.
echarts-bot[bot] commented on issue #17494:
URL: https://github.com/apache/echarts/issues/17494#issuecomment-1210154500

   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.


-- 
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-unsubscribe@echarts.apache.org

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


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


[GitHub] [echarts] helgasoft commented on issue #17494: [Bug] axisPointer label has been covered when data is large in heatmap

Posted by "helgasoft (via GitHub)" <gi...@apache.org>.
helgasoft commented on issue #17494:
URL: https://github.com/apache/echarts/issues/17494#issuecomment-1496807864

   Cannot reproduce and the meaning of _"total length is more then 2963"_ is not clear.
   The yAxis green label shows on top as requested.


-- 
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-unsubscribe@echarts.apache.org

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


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


[GitHub] [echarts] echarts-bot[bot] closed issue #17494: [Bug]

Posted by GitBox <gi...@apache.org>.
echarts-bot[bot] closed issue #17494: [Bug] 
URL: https://github.com/apache/echarts/issues/17494


-- 
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-unsubscribe@echarts.apache.org

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


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