echarts多条y轴重叠/数据量过大/y轴无刻度/增加x轴滚动条

多条y轴不重叠

yAxis: [
                    {
                        name:'温度',
                        position: "left",
                        type: 'value',
                        min:0,
                        boundaryGap: [0, '100%'],

                    },{
                        name:'湿度',
                        position:'left',
                        type: 'value',
                        min:0,
                        max:100,
                        boundaryGap: [10, 10],
                        offset:30,
                    },{
                        name:'风力',
                        position:'right',
                        type: 'value',
                        min:0,
                        max:12,
                    },{
                        name:'PM2.5质量',
                        position:'right',
                        type: 'value',
                        offset:20,
                    },{
                        name:'人口密度',
                        position:'right',
                        type: 'value',
                        splitNumber: 10, // Y 轴分隔格数
                        splitLine: {
                            // Y 轴分隔线样式
                            show: true,
                            lineStyle: {
                                color: ["#f3f0f0"],
                                width: 2,
                                type: "solid"
                            }
                        },offset:40,

                    },
                ],

主要是offset 和position起作用。

y轴不显示刻度，serial的name和y轴name对应了无效果

错误：
数据没有跟刻度值对应起来，而且右边两个轴没有自适应显示出数值

正确：

解决办法：

在serial里加入yAxisIndex属性。
series: [{name: '温度', data: data.data1, type: 'line',yAxisIndex:0,},{name: '湿度', data: data.data2, type: 'line',yAxisIndex:1,},{name: '风力', yAxisIndex:2,data: data.data3, type: 'line'} ,{name: 'PM2.5质量', data: data.data4, type: 'line',yAxisIndex:3,},{name: '人口密度', data: data.data5, type: 'line',yAxisIndex:4,}]
除了初始的y轴，其他的顺序为从左到右数。

canvas过宽/右边重叠y轴显示不全

像上图一样 右边的刻度被截掉了

使用grid属性

,grid:{
                    x2:85,
                    x:55,
                }

调整后：

X轴数据太多增加滚动条

dataZoom: [{
                    type: 'slider',
                    show: true,
                    xAxisIndex: [0],
                    bottom: -5,
                    start: 10,
                    height:14,
                    end: 90 //初始化滚动条
                }],

调节bottom值，调整其上下位置。