echart柱状图中,给x轴添加时间轴,需要调整样式,各项内容如下~
dataZoom: [//给x轴设置滚动条
{
type: 'slider',//slider表示有滑动块的,inside表示内置的
// startValue: 8,//可用于设置开始显示的柱子的长度
// endValue: 1,//可用于设置结束显示的柱子的长度
start: 80,//默认为0 可设置滚动条从在后进行展示
end: 100,//默认为100
show: true,
xAxisIndex: [0],
handleSize: 0,//滑动条的 左右2个滑动条的大小
height: 12,//组件高度
left: '10%', //左边的距离
right: '10%',//右边的距离
bottom: -2,//右边的距离
borderColor: "#F4F4F4",
fillerColor: '#E7E7E7',
backgroundColor: '#F4F4F4',//两边未选中的滑动条区域的颜色
showDataShadow: false,//是否显示数据阴影 默认auto
showDetail: false,//即拖拽时候是否显示详细数值信息 默认true
realtime: true, //是否实时更新
filterMode: 'filter',
handleStyle: {
borderRadius: '20',
},
},
//下面这个属性是里面拖到
{
type: 'inside',
show: true,
xAxisIndex: [0],
start: 0,//默认为1
end: 100,//默认为100
moveOnMouseWheel: false,
preventDefaultMouseMove: false,
},
],