ECharts数据可视化项目-笔记
https://www.bilibili.com/video/BV1v7411R7mp
数据可视化主要目的：借助图形化手段，清晰有效传输和沟通信息；把冰冷的数字转为图形，揭示蕴含在数据中的道理和规律。
项目素材地址： https://gitee.com/xiaoqiang001/eckarts_open_class.git 学习目的： 1、可视化面板布局适配屏幕 2、利用ECharts 实现柱状图展示 核心技术： -基于 flexible.js + rem 智能大屏适配 - VScode cssrem插件 - Flex 布局 - Less 使用 - 基于ECharts 数据可视化展示 - ECharts 柱状图数据设置 - ECharts 地图引入
- Live Server 服务器.安装完成后，右键“open with Live Server”
VScode cssrem插件 : 扩展设置-》Root Font Size设置为80 ，表示1920px按24份，每份80px.
VScode EasyLESS : 将 less转为css.(less就是简便书写css的工具)
flexible.js : function setRemUnit(){ var rem = docEL.clientWidth / 24}
css中class优先选择级
js中立即执行函数。（）（）； （）（）；避免变量污染. 如(function(){var a=1;})(); (function(){var a=2;})();
css中伪类: ::befor ::after
css3特性：动画特性
display:flex(弹性盒子布局)
1 HTML布局方式：DIV+CSS、FLEX、GRID、TABLE、IFRAME 2 --https://www.cnblogs.com/ruchun/p/8149287.html 3 1 DIV+CSS 盒子模型由四部分组成margin、border、padding、content。 4 5 2 Flex弹性布局 通过使用display：flex；或者display：inline-flex；坏处就是不能再设置子元素的float、clear、vertical-align。 6 7 3 Grid网格布局 通过display：grid；或者display：inline-grid；网格线将元素分成一个一个的小格子。 8 9 4 HTML表格、table布局 10 11 border属性 定义表格的边框，设置值是数值 12 cellpadding属性 定义单元格内容与边框的距离，设置值是数值（内间距） 13 cellspacing属性 定义单元格与单元格之间的距离，设置值是数值（外间距） 14 align属性 设置整体表格相对于浏览器窗口的水平对齐方式,设置值有：left | center | right默认左对齐 15 height设置高度 16 width设置宽度
5 IFrame 类似LigerUi,LayUI
