图表未在数值数据上划分x轴，而是在给定的数据点数上进行划分

Question

要求是显示风险评分的分布（范围0-100），并在此基础上进行一些分类划分，例如（0-5：级别1、5-7.5：级别2、7.5-20：级别3、20- 100：Level4）

我的期望是，在给了这些数字0、5、7.5、20、100之后，它应该根据数值占据面积，但是对于给定的x轴数字，它平均地划分了面积。

if ($('#risk_score_distribution_dashboard').length) {
    var echartLine = echarts.init(
        document.getElementById('risk_score_distribution_dashboard'), theme);

    echartLine.setOption({
        grid: {
            containLabel: true
        },
        legend: {
            x: 'center',
            y: 0,
            data: ['Male', 'Female']
        },
        calculable: true,
        xAxis: [{
            type: 'category',
            boundaryGap: false,
            name: 'Risk Score (%)',
            nameLocation: 'middle',
            nameGap: 30,
            data: ['0', '5', '7.5', '20', '100']
        }],
        yAxis: [{
            boundaryGap: false,
            type: 'value',
            axisLabel: {
                formatter: '{value}'
            },
            name: 'No. of Citizens',
            nameLocation: 'middle',
            nameGap: 50
        }],
        series: [{
            name: 'Male',
            type: 'line',
            smooth: true,
            data: [0,0,0,3352,6246],
        }, {
            name: 'Female',
            type: 'line',
            smooth: true,
            data: [0,0,0,9337,1065],
        }
    });

}

这是当前渲染的方式。