Tag:echarts3
Article From:https://segmentfault.com/q/1010000012152437
Question:

Want to achieve

Now it has become

How to set up?
The code is:

{

                    label:{
                        normal:{
                            show: true,
                            textStyle:{color:'#000',fontSize:"18"},
                            position: 'top'
                        },
                    },
                    tooltip: {
                        trigger: 'axis',
                        axisPointer: {
                            type: 'shadow'
                        }
                    },
                    grid: {
                        //  x:0,
                        //  y:40,
                        //  x2:10,
                        //  y2: 30,
                        //  containLabel: true
                    },
                    xAxis: {
                        type: 'value',
                        axisLabel: {
                            textStyle: {
                                color: '#000',
                                fontSize:'12'
                            },
                             formatter:function(val){
                                var newval =val/10000;
                                return newval+ "Ten thousand ";},}},YAxis: {Type:'category',NameLocation: "left",BoundaryGap: false,Data: ["Apple|iPhone 6", "ApplE|iPhone 6S "," Apple|iPhone 7 Plus "," Apple|iPhone 7 ","Apple|iPhone 6 PluS "," Apple|iPhone 6S Plus "," Apple|iPhone 5S "," OPPO R9s "," HUAWEI MHA-AL00 "," Vivo X7 "].reverse (),SplitLine: {show: false},AxisLaBel: {TextStyle: {Color:'#666',FontSize:'12',Align:'left',Baseline:'middle'}}},Series: [{Name: 'quantity',Type:'bar',Data: [698963,567124,503456,441705,426022,401662,174016,152560,143810,One hundred and one thousand two hundred and eighteen].reverse (),BarWidth: 6,/ / barGap: 10,/ / smooth: true,Label: {NormAl: {Show: true,Position:'right',Offset: [5, -2],TeXtStyle: {Color:'#000',FontSize: 13}}},ItemStyle: {NormaL: {Color: new echarts.graphic.LinearGradient (0, 0, 1, 0,[{offset: 0, color:'#fff'},{offseT: 0.5, color:'#5E9DD6'},{offset: 1, color:'#5E9DD6'}])}}]]]}       
                

Answer 0:

The word alignment is wrong. It should be right – aligned, default is right – aligned, yAxis’s boundaryGap: false, and align:’left’are removed, and you should not set yAxis axisTick:fals on the Y axis.E, in the left – aligned words, add a margin to the axisLabel

      yAxis: {
                        type: 'category',
                        nameLocation:"left",
                        axisTick:false,
                        //boundaryGap : false,
                        data:  ["Apple|iPhone 6","Apple|iPhone 6s","Apple|iPhone 7 Plus","Apple|iPhone 7",
                            "Apple|iPhone 6 Plus","Apple|iPhone 6s Plus","Apple|iPhone 5S","OPPO R9s","HUAWEI MHA-AL00","Vivo X7"
                        ].reverse(),
                        splitLine: {show: false},
                        axisLabel: {
                             margin:150,              
                            textStyle: {
                                color: '#666',
                                fontSize:'12',
                                baseline:'middle',
                                align:'left',               
                            }
                        }
                 
                    },
                    ser

Leave a Reply

Your email address will not be published. Required fields are marked *