echarts折线图时间轴展示


[javascript]  view plain  copy
  1. echarts折线图，我们平时在使用的时候，x轴上面的数据通常会有很多很多，使得x轴上面的数据通常显示不完整
  3. 解决方案一:对x轴坐标添加时间间隔
  4. //添加x轴时间间隔(js)
  5. xAxis : [
            {
                axisLabel : {
                    show:true,
                        interval: '0',    // 显示全部数据，还有auto/>0数字均可
                    rotate: 45,
                    margin: 8,
                    formatter: '{value}月',
                    textStyle: {
                        color: 'blue',
                        fontFamily: 'sans-serif',
                        fontSize: 15,
                        fontStyle: 'italic',
                        fontWeight: 'bold'
                    }
                },
  6. //添加x轴坐标间隔(java)
  7. CategoryAxis categoryxAxis = new CategoryAxis();
  8. AxisLabel asxisLabel = new AxisLabel();
  9. axisLabel.setInterval(0);
  10. categoryAxis.setAxisLabel(axisLabel)

  12. 解决方案二:对x轴坐标添加时间轴
  13. //dataZoom时间轴
  14. DataZoom dataZoom = new DataZoom();
  15. dataZoom.setShow(true)
  16. dataZoom.start(70);