0
点赞
收藏
分享

微信扫一扫

折线图自适应X轴坐标Title

北溟有渔夫 2022-01-25 阅读 64
 let isRotate = document.body.scrollWidth <= 350 ? "-20" : 0; // 获取屏幕宽度 
        var chartDom = document.getElementById('lineAvg');
        var myChart = echarts.init(chartDom);
        var option;
        option = {
            legend: {
                data: ['总均价'],
                x: 'center',
                top: "5%"
            },
            tooltip: {
                trigger: 'axis'
            },
            grid: {
                right: "7%",
                left: "15%"
            },
            xAxis: {
                type: 'category',
                data: res.bizDate,
                axisLabel: {// X轴title倾斜
                    interval: 0,      //坐标轴刻度标签的显示间隔(在类目轴中有效) 0:显示所有  1:隔一个显示一个 :3:隔三个显示一个...
                    rotate: isRotate    //标签倾斜的角度,显示不全时可以通过旋转防止标签重叠(-90到90)
                }
            },
            yAxis: {
                type: 'value',
                scale: true,
                // min: (value) => {
                //     return value.min > 10 ? 10 : 0;
                // }
            },
            series: [
                {
                    name: "总均价",
                    data: res.sumAvgPrice,
                    type: 'line',
                    smooth: true,
                    lineStyle: {
                        color: '#73c0de'
                    },
                    itemStyle: {
                        normal: {
                            color: '#73c0de'
                        }
                    }
                }
            ]
        };

        option && myChart.setOption(option);
举报

相关推荐

0 条评论