echars 常用配置项

霄
2022-03-12 / 0 评论 / 32 阅读 / 正在检测是否收录...

x 或者 y轴标签太多超出图标不显示

option里面添加如下内容(letf,right)都可以调整位置
grid: {  left: 160;},

格式化底部标签 字符

xAxis: {
                            type: 'category',
                            data: ProductSaleName,
                            axisTick: {
                                alignWithLabel: true,
                                show: false
                            },
                            axisLabel: {
                                interval: 0,
                                //格式化器
                                formatter: (params) => {
                                    var end = ""
                                    if (params.length > 6) {
                                        var chars = [...params]
                                        chars.forEach((element, index) => {
                                            console.log(index);
                                            if (!(index % 10)) {
                                                if (index != 0) {
                                                    end += element + '\n';
                                                }
                                            } else {
                                                end += element;
                                            }
                                        });
                                    } else {
                                        return params
                                    }
                                    return end
                                }
                            },
                        },

开启柱状图顶部显示数据

series: [{
                            color: '#a90000',
                            name: '销量',
                            type: 'bar',
                            data: ProductSaleQuantity,
                            itemStyle: {
                                normal: {
                                    //开启柱状图顶部显示数据
                                    label: {
                                        show: true, //开启显示
                                        position: 'top', //在上方显示
                                        textStyle: { //数值样式
                                            color: 'black',
                                            fontSize: 16
                                        }
                                    }
                                }
                            },
                        }]
扫描二维码,在手机上阅读!
95

评论

博主关闭了当前页面的评论