apache / echarts

Apache ECharts is a powerful, interactive charting and data visualization library for browser
https://echarts.apache.org
Apache License 2.0
60.48k stars 19.62k forks source link

Can funnel chart render data by line? #12746

Closed regrex closed 4 years ago

regrex commented 4 years ago

What problem does this feature solve?

The funnel chart now is render by trapezoid area. Like this:

option = {
    series : [
        {
            name:'converted',
            type:'funnel',
            sort: 'none',
            minSize: '10%',
            maxSize: '80%',
            data:[{
                name: '感知',
                value: 331
            }, {
                name: '好奇',
                value: 213
            }, {
                name: '询问',
                value: 200
            }, {
                name: '行动',
                value: 80
            }, {
                name: '拥护',
                value: 100
            }],
            itemStyle: {
                color: '#2152d9',
            }
        }
    ]
};

5A area funnel

How to render by trapezoid line? Like this: 5A line funnel

What does the proposed API look like?

series-funnel.renderBy: 'area' || 'line'

regrex commented 4 years ago
option = {
    series : [
        {
            name:'converted',
            type:'funnel',
            sort: 'none',
            minSize: '10%',
            maxSize: '80%',
            label: {
                position: 'rightTop'
            },
            data:[{
                name: '感知',
                value: 100
            }, {
                name: '好奇',
                value: 60
            }, {
                name: '询问',
                value: 40
            }, {
                name: '行动',
                value: 60
            }, {
                name: '拥护',
                value: 100,
                itemStyle: {
                    height: 0,
                }
            }],
            itemStyle: {
                color: '#2152d9',
            }
        }
    ]
};

funnel demo I have solved this problem by set last item height to 0.