guoliuqing123 opened a new issue, #21270:
URL: https://github.com/apache/echarts/issues/21270
### Version
无
### Link to Minimal Reproduction
无
### Steps to Reproduce
无
### Current Behavior
窗口或画布宽度变化的时候 分割成的矩形数量没有控制在10个
var data = [];
data = [[10],[9],[""],[7,0,1,1]]
var option = {
title: {
text: "工作实绩",
textStyle: {
rich: {
numAll: {
color: '#000',
padding: [10, 5],
backgroundColor: '#fff',
height: 30
},
numText: {
fontWeight: 100,
fontSize: 12,
padding: [10, 5],
backgroundColor: '#fff',
height: 30
}
}
},
top: 5,
left: 5,
subtext:
`{numAll|${data[1]}}{numText|总分}{textBlack|工作实绩}{numGreen|${data[3][0]}}{textBlack|}|{textBlack|合格以下}{numRed|-${data[3][1]}}{textBlack|}|{textBlack|近三年两次及以上优秀}{numElse|+${data[3][2]}}{textBlack|}|{textBlack|当年优秀}{numElse|+${data[3][3]}}`,
subtextStyle: {
fontSize: 13, // 统一字体大小（也可在 rich 中单独设置）
rich: {
// 文字部分：黑色
textBlack: {
color: 'black',
padding: [10, 10],
},
// 数字部分：绿色（可根据需求调整色值，如 #00b42a 是常见的“成功绿”）
numGreen: {
color: 'rgba(26, 173, 85, 1)',
padding: [10, 5],
},
numRed: {
color: 'rgba(255, 87, 51, 1)',
padding: [10, 5],
},
numElse: {
color: 'rgba(26, 173, 85, 1)',
padding: [10, 5],
},
numAll: {
color: '#000',
padding: [10, 5],
fontSize: 20,
// backgroundColor:'#ccc',
height: 30,
fontWeight: 1000
},
numText: {
fontWeight: 100,
fontSize: 12,
padding: [10, 5],
// backgroundColor:'#ccc',
height: 30
}
}
}
},
xAxis: [{
type: "value",
show: false,
max: 10 // 设置最大值为10，确保10个矩
}],
yAxis: [{
type: "category",
inverse: true,
axisLabel: {
show: false,
},
// 纵坐标数据
data: data[2],
yAxisIndex: 0,
axisTick: {
show: false
},
axisLine: {
show: false
}
},
{
type: "category",
inverse: true,
axisLine: {
show: false
},
axisTick: {
show: false
},
axisLabel: {
show: true,
inside: false,
verticalAlign: "bottom",
// 位置 上右下左
padding: [0, 10, -20, 10],
lineHeight: "40",
textStyle: {
fontSize: 16,
color: "#000",
fontFamily: "SourceHanSansCN-Regular"
},
formatter(params) {
return '合计' + params
}
},
// 统计的总量 用纵坐标模拟
data: data[1],
},
],
series: [{
show: true,
type: 'bar',
barGap: '-100%',
barWidth: '20px', // 统计条宽度
labelLine: {
show: true,
},
z: 1,
itemStyle: {
normal: {
color: '#ccc'
}
},
data: data[0],
},
{
show: true,
type: 'bar',
// barGap: '-100%',
barWidth: '20px', // 统计条宽度
labelLine: {
show: true,
},
z: 2,
itemStyle: {
normal: {
color: {
colorStops: [{
offset: 0,
color: 'rgba(191, 232, 130, 1)', // 0% 处的颜色
},
{
offset: 1,
color: ' rgba(0, 186, 34, 1)', // 100% 处的颜色
},
],
}
},
},
data: data[1],
},
{
show: true,
type: 'pictorialBar',
symbol: 'rect',
// barWidth:'80%',
symbolSize: ['20', 30],
symbolMargin: 10,
symbolRepeatCount: 10, // 强制显示10个矩形
symbolRepeat: 'true',
itemStyle: {
normal: {
color: '#fff'
},
},
z: 3,
data: data[0],
},
]
};
### Expected Behavior
窗口或画布宽度变化的时候 分割成的矩形数量控制在10个
### 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]
