echarts.js刻度標(biāo)簽實(shí)現(xiàn)富文本實(shí)現(xiàn)中文+圖片的效果，求解

問題描述

echarts.js刻度標(biāo)簽實(shí)現(xiàn)富文本實(shí)現(xiàn)中文+圖片的效果，求解:

這是echarts官方demo中的例子，現(xiàn)在我想實(shí)現(xiàn)圖片下面是中文的效果的話，應(yīng)該如何去改呢？在demo里直接改成中文，效果就不顯示啦。

問題出現(xiàn)的環(huán)境背景及自己嘗試過哪些方法

自己做了個(gè)類似的例子，目前已經(jīng)實(shí)現(xiàn)了圖片+英文作為刻度標(biāo)簽的效果，如下：

但如果想實(shí)現(xiàn)圖片+中文，本例中就是 圖片+周一這樣的效果的話，下列代碼改如何去改呢？求解。

相關(guān)代碼

// 這是我自己的例子中，X軸配置項(xiàng)代碼

                xAxis: { //設(shè)置x軸
                    type: 'category',
                    boundaryGap: false,
                    data: ['Mon', 'Tue', 'Wed','Thu','Fri','Sat','Sun'],
                    axisLine: {
                        show: false //是否顯示坐標(biāo)軸軸線。
                    },
                    axisTick: {
                        show: false,  //是否顯示坐標(biāo)軸刻度。
                        interval:0
                    },
                    axisLabel: {   //刻度標(biāo)簽--即軸線下的文字
                        formatter: function (value) {
                            return '{' + value + '| }\n{value|' + value + '}';
                        },
                        interval:0, //設(shè)置成 0 強(qiáng)制顯示所有標(biāo)簽。
                        margin: 20,
                        rich: {     //x軸刻度標(biāo)簽的自定義--圖片+文字
                            value: {
                                lineHeight: 20,
                                align: 'center'
                            },
                            Mon: {         //與data中的數(shù)組元素要對應(yīng)
                                height: 20,
                                align: 'center',
                                backgroundColor: {
                                    image: str[0]
                                }
                            },
                            Tue: {
                                height: 20,
                                align: 'center',
                                backgroundColor: {
                                    image: str[1]
                                }
                            },
                            Wed: {
                                height: 20,
                                align: 'center',
                                backgroundColor: {
                                    image: str[2]
                                }
                            },
                            Thu: {
                                height: 20,
                                align: 'center',
                                backgroundColor: {
                                    image: str[3]
                                }
                            },
                            Fri: {
                                height: 20,
                                align: 'center',
                                backgroundColor: {
                                    image: str[4]
                                }
                            },
                            Sat: {
                                height: 20,
                                align: 'center',
                                backgroundColor: {
                                    image: str[5]
                                }
                            },
                            Sun: {
                                height: 20,
                                align: 'center',
                                backgroundColor: {
                                    image: str[6]
                                }
                            },
                        }
                    },
                },