You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@echarts.apache.org by "guoliuqing123 (via GitHub)" <gi...@apache.org> on 2024/11/13 02:05:41 UTC
[I] [Bug] 漏斗图设置圆角 [echarts]
guoliuqing123 opened a new issue, #20508:
URL: https://github.com/apache/echarts/issues/20508
### Version
无
### Link to Minimal Reproduction
无
### Steps to Reproduce
let data1 =[
{
"number": 90,
"avgAge": null,
"license": "A1",
"proportion": 21.2,
"type": null,
"name": "A1",
"value": 90,
"countValue": null,
"eduCountList": null,
"omDeptId": null,
"omOfficeId": null,
"omManageUnitId": null,
"cnsType": null,
"children": null
},
{
"number": 90,
"avgAge": null,
"license": "A1",
"proportion": 21.2,
"type": null,
"name": "A1",
"value": 90,
"countValue": null,
"eduCountList": null,
"omDeptId": null,
"omOfficeId": null,
"omManageUnitId": null,
"cnsType": null,
"children": null,
"itemStyle": {
"normal": {
"color": "#fff",
"borderWidth": 0,
"borderColor": "black",
"height": 0
}
}
},
{
"number": 88,
"avgAge": null,
"license": "A2",
"proportion": 20.8,
"type": null,
"name": "A2",
"value": 88,
"countValue": null,
"eduCountList": null,
"omDeptId": null,
"omOfficeId": null,
"omManageUnitId": null,
"cnsType": null,
"children": null
},
{
"number": 88,
"avgAge": null,
"license": "A2",
"proportion": 20.8,
"type": null,
"name": "A2",
"value": 88,
"countValue": null,
"eduCountList": null,
"omDeptId": null,
"omOfficeId": null,
"omManageUnitId": null,
"cnsType": null,
"children": null,
"itemStyle": {
"normal": {
"color": "#fff",
"borderWidth": 0,
"borderColor": "black",
"height": 0
}
}
},
{
"number": 0,
"avgAge": null,
"license": "A3",
"proportion": 0,
"type": null,
"name": "A3",
"value": 0,
"countValue": null,
"eduCountList": null,
"omDeptId": null,
"omOfficeId": null,
"omManageUnitId": null,
"cnsType": null,
"children": null
},
{
"number": 0,
"avgAge": null,
"license": "A3",
"proportion": 0,
"type": null,
"name": "A3",
"value": 0,
"countValue": null,
"eduCountList": null,
"omDeptId": null,
"omOfficeId": null,
"omManageUnitId": null,
"cnsType": null,
"children": null,
"itemStyle": {
"normal": {
"color": "#fff",
"borderWidth": 0,
"borderColor": "black",
"height": 0
}
}
},
{
"number": 0,
"avgAge": null,
"license": "A4",
"proportion": 0,
"type": null,
"name": "A4",
"value": 0,
"countValue": null,
"eduCountList": null,
"omDeptId": null,
"omOfficeId": null,
"omManageUnitId": null,
"cnsType": null,
"children": null
},
{
"number": 0,
"avgAge": null,
"license": "A4",
"proportion": 0,
"type": null,
"name": "A4",
"value": 0,
"countValue": null,
"eduCountList": null,
"omDeptId": null,
"omOfficeId": null,
"omManageUnitId": null,
"cnsType": null,
"children": null,
"itemStyle": {
"normal": {
"color": "#fff",
"borderWidth": 0,
"borderColor": "black",
"height": 0
}
}
},
{
"number": 0,
"avgAge": null,
"license": "A5",
"proportion": 0,
"type": null,
"name": "A5",
"value": 0,
"countValue": null,
"eduCountList": null,
"omDeptId": null,
"omOfficeId": null,
"omManageUnitId": null,
"cnsType": null,
"children": null
},
{
"number": 0,
"avgAge": null,
"license": "A5",
"proportion": 0,
"type": null,
"name": "A5",
"value": 0,
"countValue": null,
"eduCountList": null,
"omDeptId": null,
"omOfficeId": null,
"omManageUnitId": null,
"cnsType": null,
"children": null,
"itemStyle": {
"normal": {
"color": "#fff",
"borderWidth": 0,
"borderColor": "black",
"height": 0
}
}
},
{
"number": 0,
"avgAge": null,
"license": "A6",
"proportion": 0,
"type": null,
"name": "A6",
"value": 0,
"countValue": null,
"eduCountList": null,
"omDeptId": null,
"omOfficeId": null,
"omManageUnitId": null,
"cnsType": null,
"children": null
},
{
"number": 0,
"avgAge": null,
"license": "A6",
"proportion": 0,
"type": null,
"name": "A6",
"value": 0,
"countValue": null,
"eduCountList": null,
"omDeptId": null,
"omOfficeId": null,
"omManageUnitId": null,
"cnsType": null,
"children": null,
"itemStyle": {
"normal": {
"color": "#fff",
"borderWidth": 0,
"borderColor": "black",
"height": 0
}
}
},
{
"number": 0,
"avgAge": null,
"license": "A7",
"proportion": 0,
"type": null,
"name": "A7",
"value": 0,
"countValue": null,
"eduCountList": null,
"omDeptId": null,
"omOfficeId": null,
"omManageUnitId": null,
"cnsType": null,
"children": null
},
{
"number": 0,
"avgAge": null,
"license": "A7",
"proportion": 0,
"type": null,
"name": "A7",
"value": 0,
"countValue": null,
"eduCountList": null,
"omDeptId": null,
"omOfficeId": null,
"omManageUnitId": null,
"cnsType": null,
"children": null,
"itemStyle": {
"normal": {
"color": "#fff",
"borderWidth": 0,
"borderColor": "black",
"height": 0
}
}
},
{
"number": 0,
"avgAge": null,
"license": "B1",
"proportion": 0,
"type": null,
"name": "B1",
"value": 0,
"countValue": null,
"eduCountList": null,
"omDeptId": null,
"omOfficeId": null,
"omManageUnitId": null,
"cnsType": null,
"children": null
},
{
"number": 0,
"avgAge": null,
"license": "B1",
"proportion": 0,
"type": null,
"name": "B1",
"value": 0,
"countValue": null,
"eduCountList": null,
"omDeptId": null,
"omOfficeId": null,
"omManageUnitId": null,
"cnsType": null,
"children": null,
"itemStyle": {
"normal": {
"color": "#fff",
"borderWidth": 0,
"borderColor": "black",
"height": 0
}
}
},
{
"number": 1,
"avgAge": null,
"license": "B2",
"proportion": 0.2,
"type": null,
"name": "B2",
"value": 1,
"countValue": null,
"eduCountList": null,
"omDeptId": null,
"omOfficeId": null,
"omManageUnitId": null,
"cnsType": null,
"children": null
},
{
"number": 1,
"avgAge": null,
"license": "B2",
"proportion": 0.2,
"type": null,
"name": "B2",
"value": 1,
"countValue": null,
"eduCountList": null,
"omDeptId": null,
"omOfficeId": null,
"omManageUnitId": null,
"cnsType": null,
"children": null,
"itemStyle": {
"normal": {
"color": "#fff",
"borderWidth": 0,
"borderColor": "black",
"height": 0
}
}
},
{
"number": 0,
"avgAge": null,
"license": "B3",
"proportion": 0,
"type": null,
"name": "B3",
"value": 0,
"countValue": null,
"eduCountList": null,
"omDeptId": null,
"omOfficeId": null,
"omManageUnitId": null,
"cnsType": null,
"children": null
},
{
"number": 0,
"avgAge": null,
"license": "B3",
"proportion": 0,
"type": null,
"name": "B3",
"value": 0,
"countValue": null,
"eduCountList": null,
"omDeptId": null,
"omOfficeId": null,
"omManageUnitId": null,
"cnsType": null,
"children": null,
"itemStyle": {
"normal": {
"color": "#fff",
"borderWidth": 0,
"borderColor": "black",
"height": 0
}
}
},
{
"number": 0,
"avgAge": null,
"license": "B4",
"proportion": 0,
"type": null,
"name": "B4",
"value": 0,
"countValue": null,
"eduCountList": null,
"omDeptId": null,
"omOfficeId": null,
"omManageUnitId": null,
"cnsType": null,
"children": null
},
{
"number": 0,
"avgAge": null,
"license": "B4",
"proportion": 0,
"type": null,
"name": "B4",
"value": 0,
"countValue": null,
"eduCountList": null,
"omDeptId": null,
"omOfficeId": null,
"omManageUnitId": null,
"cnsType": null,
"children": null,
"itemStyle": {
"normal": {
"color": "#fff",
"borderWidth": 0,
"borderColor": "black",
"height": 0
}
}
},
{
"number": 19,
"avgAge": null,
"license": "C1",
"proportion": 4.5,
"type": null,
"name": "C1",
"value": 19,
"countValue": null,
"eduCountList": null,
"omDeptId": null,
"omOfficeId": null,
"omManageUnitId": null,
"cnsType": null,
"children": null
},
{
"number": 19,
"avgAge": null,
"license": "C1",
"proportion": 4.5,
"type": null,
"name": "C1",
"value": 19,
"countValue": null,
"eduCountList": null,
"omDeptId": null,
"omOfficeId": null,
"omManageUnitId": null,
"cnsType": null,
"children": null,
"itemStyle": {
"normal": {
"color": "#fff",
"borderWidth": 0,
"borderColor": "black",
"height": 0
}
}
},
{
"number": 53,
"avgAge": null,
"license": "C2",
"proportion": 12.5,
"type": null,
"name": "C2",
"value": 53,
"countValue": null,
"eduCountList": null,
"omDeptId": null,
"omOfficeId": null,
"omManageUnitId": null,
"cnsType": null,
"children": null
},
{
"number": 53,
"avgAge": null,
"license": "C2",
"proportion": 12.5,
"type": null,
"name": "C2",
"value": 53,
"countValue": null,
"eduCountList": null,
"omDeptId": null,
"omOfficeId": null,
"omManageUnitId": null,
"cnsType": null,
"children": null,
"itemStyle": {
"normal": {
"color": "#fff",
"borderWidth": 0,
"borderColor": "black",
"height": 0
}
}
},
{
"number": 41,
"avgAge": null,
"license": "C3",
"proportion": 9.7,
"type": null,
"name": "C3",
"value": 41,
"countValue": null,
"eduCountList": null,
"omDeptId": null,
"omOfficeId": null,
"omManageUnitId": null,
"cnsType": null,
"children": null
},
{
"number": 41,
"avgAge": null,
"license": "C3",
"proportion": 9.7,
"type": null,
"name": "C3",
"value": 41,
"countValue": null,
"eduCountList": null,
"omDeptId": null,
"omOfficeId": null,
"omManageUnitId": null,
"cnsType": null,
"children": null,
"itemStyle": {
"normal": {
"color": "#fff",
"borderWidth": 0,
"borderColor": "black",
"height": 0
}
}
},
{
"number": 33,
"avgAge": null,
"license": "C4",
"proportion": 7.8,
"type": null,
"name": "C4",
"value": 33,
"countValue": null,
"eduCountList": null,
"omDeptId": null,
"omOfficeId": null,
"omManageUnitId": null,
"cnsType": null,
"children": null
},
{
"number": 33,
"avgAge": null,
"license": "C4",
"proportion": 7.8,
"type": null,
"name": "C4",
"value": 33,
"countValue": null,
"eduCountList": null,
"omDeptId": null,
"omOfficeId": null,
"omManageUnitId": null,
"cnsType": null,
"children": null,
"itemStyle": {
"normal": {
"color": "#fff",
"borderWidth": 0,
"borderColor": "black",
"height": 0
}
}
},
{
"number": 95,
"avgAge": null,
"license": "C5",
"proportion": 22.4,
"type": null,
"name": "C5",
"value": 95,
"countValue": null,
"eduCountList": null,
"omDeptId": null,
"omOfficeId": null,
"omManageUnitId": null,
"cnsType": null,
"children": null
},
{
"number": 95,
"avgAge": null,
"license": "C5",
"proportion": 22.4,
"type": null,
"name": "C5",
"value": 95,
"countValue": null,
"eduCountList": null,
"omDeptId": null,
"omOfficeId": null,
"omManageUnitId": null,
"cnsType": null,
"children": null,
"itemStyle": {
"normal": {
"color": "#fff",
"borderWidth": 0,
"borderColor": "black",
"height": 0
}
}
},
{
"number": 1,
"avgAge": null,
"license": "D1",
"proportion": 0.2,
"type": null,
"name": "D1",
"value": 1,
"countValue": null,
"eduCountList": null,
"omDeptId": null,
"omOfficeId": null,
"omManageUnitId": null,
"cnsType": null,
"children": null
},
{
"number": 1,
"avgAge": null,
"license": "D1",
"proportion": 0.2,
"type": null,
"name": "D1",
"value": 1,
"countValue": null,
"eduCountList": null,
"omDeptId": null,
"omOfficeId": null,
"omManageUnitId": null,
"cnsType": null,
"children": null,
"itemStyle": {
"normal": {
"color": "#fff",
"borderWidth": 0,
"borderColor": "black",
"height": 0
}
}
},
{
"number": 2,
"avgAge": null,
"license": "D2",
"proportion": 0.5,
"type": null,
"name": "D2",
"value": 2,
"countValue": null,
"eduCountList": null,
"omDeptId": null,
"omOfficeId": null,
"omManageUnitId": null,
"cnsType": null,
"children": null
},
{
"number": 2,
"avgAge": null,
"license": "D2",
"proportion": 0.5,
"type": null,
"name": "D2",
"value": 2,
"countValue": null,
"eduCountList": null,
"omDeptId": null,
"omOfficeId": null,
"omManageUnitId": null,
"cnsType": null,
"children": null,
"itemStyle": {
"normal": {
"color": "#fff",
"borderWidth": 0,
"borderColor": "black",
"height": 0
}
}
}
]
option = {
tooltip: {
// show:false,
// trigger: 'item',
formatter: '{b} : {c}'
},
series: [
{
name: '从业证照',
type: 'funnel',
orient: 'horizontal',
left:5,
right:0,
gap: 0, // 矩形间距
minSize: '20%',// 数据最小值的占比宽度
maxSize: '100%',// 数据最大值的占比宽度
sort: function (params) {
return params
}, // 数据排序方式
itemStyle: {
normal: {
borderWidth: 0,
color: function (params) {
if (params.name === 'A1') {
return '#6d80ff'
} else if (params.name === 'A2') {
return '#6d80ff'
} else if (params.name === 'A3') {
return '#6d80ff'
} else if (params.name === 'A4') {
return '#6d80ff'
} else if (params.name === 'A5') {
return '#6d80ff'
} else if (params.name === 'A6') {
return '#6d80ff'
} else if (params.name === 'A7') {
return '#6d80ff'
} else if (params.name === 'B1') {
return '#3fbcb3'
} else if (params.name === 'B2') {
return '#3fbcb3'
} else if (params.name === 'B3') {
return '#75d1c6'
} else if (params.name === 'B4') {
return '#42c1ac'
} else if (params.name === 'C1') {
return '#90a8cf'
} else if (params.name === 'C2') {
return '#93aac8'
} else if (params.name === 'C3') {
return '#93a8c6'
} else if (params.name === 'C4') {
return '#8aa7d6'
} else if (params.name === 'C5') {
return '#8ea8d3'
} else if (params.name === 'D1') {
return '#8970fd'
} else if (params.name === 'D2') {
return '#878efd'
}
},
height: 22
},
},
data: data1,
label: {
position: 'inside',
formatter: function (params) {
if (params.borderColor === '#fff') {
return params.data.license
}
if (params.borderColor === 'black') {
return ''
}
},
color: '#fff',
fontSize: 11,
},
labelLine: false, // 是否显示视觉引导线
},
{
name: '从业证照',
type: 'funnel',
orient: 'horizontal',
left:5,
right:0,
gap: 0, // 矩形间距
maxSize: 0,// 设为 0，表示最大宽度为0，这样此层只会显示label
sort: function (params) {
return params
}, // 数据排序方式
itemStyle: {
normal: {
borderWidth: 0,
color: function (params) {
if (params.name === 'A1') {
return '#6d80ff'
} else if (params.name === 'A2') {
return '#6d80ff'
} else if (params.name === 'A3') {
return '#6d80ff'
} else if (params.name === 'A4') {
return '#6d80ff'
} else if (params.name === 'A5') {
return '#6d80ff'
} else if (params.name === 'A6') {
return '#6d80ff'
} else if (params.name === 'A7') {
return '#6d80ff'
} else if (params.name === 'B1') {
return '#3fbcb3'
} else if (params.name === 'B2') {
return '#3fbcb3'
} else if (params.name === 'B3') {
return '#75d1c6'
} else if (params.name === 'B4') {
return '#42c1ac'
} else if (params.name === 'C1') {
return '#90a8cf'
} else if (params.name === 'C2') {
return '#93aac8'
} else if (params.name === 'C3') {
return '#93a8c6'
} else if (params.name === 'C4') {
return '#8aa7d6'
} else if (params.name === 'C5') {
return '#8ea8d3'
} else if (params.name === 'D1') {
return '#8970fd'
} else if (params.name === 'D2') {
return '#878efd'
}
},
height: 22
},
},
data: data1,
labelLine: {
show: false,
position: 'bottom',
// length: 105, // label拉线的长度根据自己的场景进行设置即可
},
label: {
position: 'bottom',
formatter: function (params) {
if (params.borderColor === '#fff') {
return params.data.value
}
if (params.borderColor === 'black') {
return ''
}
},
color: '#999999',
},
},
]
};
### Current Behavior
想要给漏斗图设置圆角 没有找到配置的项
### Expected Behavior
想要给漏斗图实现这个效果
### 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
Re: [I] [Bug] 漏斗图设置圆角 [echarts]
Posted by "Ovilia (via GitHub)" <gi...@apache.org>.
Ovilia commented on issue #20508:
URL: https://github.com/apache/echarts/issues/20508#issuecomment-2475777782
@helgasoft That's genius. I was just going to reply that custom series should be required.
--
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
Re: [I] [Bug] 漏斗图设置圆角 [echarts]
Posted by "echarts-bot[bot] (via GitHub)" <gi...@apache.org>.
echarts-bot[bot] commented on issue #20508:
URL: https://github.com/apache/echarts/issues/20508#issuecomment-2472186253
@guoliuqing123 It seems you are not using English, I've helped translate the content automatically. To make your issue understood by more people and get helped, we'd like to suggest using English next time. 🤗
<details><summary><b>TRANSLATED</b></summary><br>
**TITLE**
[Bug] Funnel chart set rounded corners
</details>
--
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
Re: [I] [Bug] 漏斗图设置圆角 [echarts]
Posted by "helgasoft (via GitHub)" <gi...@apache.org>.
helgasoft commented on issue #20508:
URL: https://github.com/apache/echarts/issues/20508#issuecomment-2475508894
Simple lines will work better than funnel - [Demo](https://echarts.apache.org/examples/en/editor.html?c=line-simple&code=PTAEGMHsDsBcCcCWAjArrRNTIJ6gBYCmANgOYCGAzpAGawB0UAtqKwFCWFKGgC8oAb1CwcAB0IAuUAHJiiaIWkAaUJRxNkkYhOnQYilXIUBlEcUmCA7ogAmsfBIBMjleHKid8SKmg3pAX1B_Di5EQko-UABtAF0AbjY3WAj-KOkAQQBGZWkAIWylPMccgGFs-MStFOjpAGIANhsADgAGGhoc2oAWR3BM8nBOnr6BzoBOFvIm8A6Km3JYckiozIBWFqUAdg3HDdXVuYXyeiZ3AAozgDclRABKPgA-QTZWSmrCcHxyeGT6dERiIxiPozpxuLc4qAXqpKPR5otUlEkpQoogYipLujosjUViALSYiqvWFQYHwfiklFohKvULheiiVCUfCgygQtj-W5sSCiDBYfhCDCwcxSASwQgAD1gUlk8nCASU0NgkC0GA8gmESFIpC4MvIEsQlGUrFA-sNAAVIPJxfBRcIxBZdPppEFWP5FawJekDZQ7SJxDKkoRSJB4DhjQAvCRdD0ms2UAAqiHAAGsJAJmZBLBIaORiJx3dDWPGADJy9OZ7O5_OEd1Qk2mn0l8jIEjp0CneCkeRSPEAWQW-BO-rO9DH8PItwA1JkNhAtKGdDgSMDLAF2G7YzhvYa7ZWc3nOCpThKJAP7MOJaPx0d7oXadxKBy4kA).
🚩 This is not-a-bug or feature request. Please follow **Official posting guidelines** below:
---
The issue list is reserved exclusively for bug reports and feature requests.
For usage questions, please use the following resources:
* Read the [docs](https://echarts.apache.org/option.html)
* Find in [examples](https://echarts.apache.org/examples/)
* Look for / ask questions on [Stack Overflow](https://stackoverflow.com/questions/tagged/echarts)
---
--
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