调试器不会出现该问题,但真机调试会出现
底部一排按钮是fixed固定在下方的,但当滚动出现echart折线图时层级会比固定区域更高
要如何处理折线图的层级问题?
<view class="container log-list">
<block wx:for="{{logs}}" wx:key="timeStamp" wx:for-item="log">
<view style="height: 500rpx;">1111</view>
<view style="height: 500rpx;">2222</view>
<view style="height: 500rpx;">3333</view>
<view style="height: 500rpx;">4444</view>
<view style="width: 100%;border: 1px solid red;height: 400rpx">
<ec-canvas force-use-old-canvas="true" style="width: 100%; height: 220px;" id="mychart-dom-bar" canvas-id="mychart-bar" ec="{{ ec }}"></ec-canvas>
</view>
<view style="height: 500rpx;">5555</view>
<cover-view class="buttom">哈哈哈哈</cover-view>
</block>
</view>
.log-list {
display: flex;
flex-direction: column;
padding: 40rpx;
}
.log-item {
margin: 10rpx;
}
.buttom{
height: 100px;
line-height: 100px;
background-color: pink;
width: 100vw;
position: fixed;
bottom: 0;
text-align: center;
}
// logs.js
const util = require('../../utils/util.js')
import * as echarts from './ec-canvas/echarts';
let chart = null;
const initChart = (canvas, width, height, dpr) => {
chart = echarts.init(canvas, null, {
width: width,
height: height,
devicePixelRatio: dpr // 像素
});
canvas.setChart(chart);
let option = {
grid: {
// top: 0,
left: '40px',
right: '20px',
// bottom: 0,
width:'auto',
height:'auto'
},
xAxis: {
type: 'category',
data: [1, 2, 3,4, 5, 6],
axisLine: {
lineStyle: {
color: '#909090',
width: 1, //这里是为了突出显示加上的
}
},
splitLine: {
show: false,
}
},
yAxis: {
type: 'value',
minInterval: 1,
axisLine: {
lineStyle: {
color: '#909090',
width: 1, //这里是为了突出显示加上的
}
},
splitLine: {
show: true, //隐藏或显示
lineStyle:{
color: ['#EBEBEB'],
width: 1,
type: 'solid'
}
},
},
series: [
{
data: [1, 2, 4, 56,6 ,7 ],
type: 'line',
symbol:'none',
color: '#FC2853'
}
]
};
chart.setOption(option);
return chart;
}
Page({
data: {
logs: [],
ec: {
onInit: initChart
},
},
onLoad() {
}
})
同样的问题,请问解决了没有?
朋友,你解决了吗
z-index 调大不行吗