sanganasrikanth9618 opened a new issue, #20725: URL: https://github.com/apache/echarts/issues/20725
### Version 5.5.1 ### Link to Minimal Reproduction https://codepen.io/Srikanth-Sangana/pen/pvzGmYa ### Steps to Reproduce 1. Initialize an ECharts instance. 2. Use the provided Line Chart configuration with visualMap.type = 'piecewise'. 3. Set a condition with only the min value (e.g., { gt: 50, color: '#FF0000' }). 4. Observe that the color is not applied to the Line Chart. 5. Use the same visualMap configuration in a Bar Chart. 6. Observe that the color is applied correctly in the Bar Chart. Bar chart options : option = { title: { text: 'Bar Chart with VisualMap', left: 'center', }, tooltip: { trigger: 'axis', }, grid: { left: '10%', right: '10%', bottom: '15%', containLabel: true, }, xAxis: { type: 'category', data: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'], name: 'Month', }, yAxis: { type: 'value', name: 'Value', }, visualMap: { type: 'piecewise', show: true, position: 'top', orient: 'horizontal', scrollable: true, // Enables scrolling for many conditions itemWidth: 20, itemHeight: 16, pieces: [ { gt:50, color: '#FF0000'} ], calculable: true, textStyle: { fontSize: 12, color: '#000', }, height: 100, outOfRange: { color: '#00ACDD' } }, series: [ { name: 'Data', type: 'bar', data: [3, 12, 25, 45, 65, 78, 90, 101, 125, 145, 160, 175], itemStyle: { color: function (params) { let value = params.value; return value > 50 ? '#FF0000' : '#00ACDD'; } } } ] }; Line chart Options: option = { title: { text: 'Line Chart with VisualMap', left: 'center', }, tooltip: { trigger: 'axis', }, grid: { left: '10%', right: '10%', bottom: '15%', containLabel: true, }, xAxis: { type: 'category', boundaryGap: false, data: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'], name: 'Month', }, yAxis: { type: 'value', name: 'Value', }, visualMap: { type: 'piecewise', show: true, position: 'top', orient: 'horizontal', scrollable: true, // Enables scrolling for many conditions itemWidth: 20, itemHeight: 16, pieces: [ { gt:50, color: '#FF0000'} ], calculable: true, textStyle: { fontSize: 12, color: '#000', }, height: 100, outOfRange: { "color": "#00ACDD" } }, series: [ { name: 'Data', type: 'line', data: [3, 12, 25, 45, 65, 78, 90, 101, 125, 145, 160, 175], lineStyle: { width: 2, }, }, ], }; ### Current Behavior 1. In the Line Chart, the visualMap does not apply the expected color when only min is provided. 2. The same configuration works correctly in the Bar Chart, where values above 50 get colored as expected. ### Expected Behavior 1. The visualMap should apply the specified color to the Line Chart when the min condition is met, just as it does in the Bar Chart. ### 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: [email protected] For queries about this service, please contact Infrastructure at: [email protected] --------------------------------------------------------------------- To unsubscribe, e-mail: [email protected] For additional commands, e-mail: [email protected]
