Echarts 教程一
可视化大屏幕适配方案
// flexible.js 源码
var docEl = document.documentElement // 返回文档的root元素,即html
var rem = docEl.clientWidth / 10
docEl.style.fontSize = rem + 'px'
从源码中得知，1rem = 屏幕宽度的1/10
比如设计稿是1920*1080的，那1rem === 192px
// flexible.js 源码修改
var docEl = document.documentElement // 返回文档的root元素,即html
var rem = docEl.clientWidth / 24
docEl.style.fontSize = rem + 'px'
可视化大屏幕布局方案
- 整体body部分：放背景图，缩放100% (background-size:100% 100%)
- header部分：
2.1 确定高度
2.1 放背景图，缩放100% - main部分：flex 布局，划分主体区域即可
- 公共面板部分：
4.1 确定高度
4.2 标题三元素(height:50px; line-height:50px; text-align:center)
4.3 放图表。