Custom style does not take effect

[QuYunFengg]

{
            tooltip : {
                trigger: 'item',
                formatter: "{a} <br/>{b} : {c}件 ({d}%)"
            },
            legend: {
                orient: 'vertical',
                right: 0,
                top: '20%',
                data: ['a级','b级','c级','d级'],
                formatter: function (name) {
                    if (name == 'a级') {
                        return `{title |a级} 18%`;
                    }    
                    if (name == 'b级') {
                        return 'b级 27%';
                    }
                    if (name == 'c级') {
                        return 'c级 24%';
                    }
                    if (name == 'd级') {
                        return 'd级 31%';
                    }
                },
                textStyle: {
                    rich: {
                        title: {
                            color: 'green',
                            align: 'left',

                        },
                        value: {
                            align: 'right',
                            width: 50
                        }
                    }
                }
            },
            series : [
                {
                    name: '隐患数量',
                    type: 'pie',
                    radius : [30, 60],
                    roseType : 'radius',
                    center: ['35%', '45%'],
                    data:[
                        {value:18, name:'a级',itemStyle: {
                            color: '#51D292'
                        }},
                        {value:27, name:'b级',itemStyle: {
                            color: '#68B6FD'
                        }},
                        {value:24, name:'c级',itemStyle: {
                            color: '#C783F2'
                        }},
                        {value:31, name:'d级',itemStyle: {
                            color: '#FF9D0C'
                        }},
                    ],
                    label: {
                        formatter: function (item,names) {
                            return item.data.value+'件'
                        }
                    },
                    itemStyle: {
                        emphasis: {
                            shadowBlur: 10,
                            shadowOffsetX: 0,
                            shadowColor: 'rgba(0, 0, 0, 0.5)'
                        },

                    }
                }
            ]
        }

This is normal display. But on mobile phones.

Thank you very much for this component.