echarts的一些常见使用配置项（持续更新中）---木头人

1、echarts的position定位使用grid，值可以使用%或者直接使用number。containLabel为true时防止标签长度动态变化时，可能会溢出容器或者覆盖其他组件；当多个grid对齐时为false。

grid: {
            left: '80',
            right: '60',
            top: '2%',
            bottom: '0'，
            containLabel: true
        }

2、实现隐藏x轴，y轴，刻度线，网格,直接在xAixs\yAixs中使用，以yAixs为例

        yAxis: {
          splitLine:{
            show: false  //去除网格线
          }, 
          axisTick:{
            show:false //y轴刻度线
          },
          axisLine:{
            show:false //y轴
          }
        },

3、当echarts数据太多，在折线图中会密密麻麻如图：

mima.png

，使用dataZoom滑动条型数据区域缩放组件，可以拖拽echarts图，如图：

mima2.png

，start和end代表刚开始显示的区域%，0-100刚开始进去入图1；zoomLock为true只能平移，不能手动放大，所以设置为false，更多grid属性可以查看https://echarts.apache.org/zh/option.html#dataZoom-inside
。

        dataZoom: [
            {
                type: 'inside', //slider表示有滑动块的，inside表示内置的
                show: true,
                xAxisIndex: [0],
                zoomLock: false,
                start: 0,
                end: 100,
                backgroundColor: 'rgba(0,0,0,0.5)', // 滑块背景颜色
                fillerColor: 'rgba(255,255,0,0.5)', // 填充颜色
                showDetail: false, // 拖拽时，是否显示详细信息
            }
        ],