JavaScript 4.22

JS

---

1.数据可视化

1.1可视化库

• ECharts.js
• Highcharts.js

2.EChars

2.1使用

• 下载并引入echarts.js
• 准备具备大小的DOM容器
• 初始化echarts实例化对象

     var myChart = echarts.init(document.querySelector('.box'));

• 指定配置项和数据
  官网复制，具体配置项可查阅手册
• 将配置项设置给echarts实例对象

	myChart.setOption(option);

2.2配置项

• grid：containLable：true/false grid内是否包含刻度标签
• xAxis： boundaryGap坐标轴两边缝隙
• stack：数据堆叠即数据相加

3.项目

• background-size ：cover图片适配页面
• 防止变量名冲突，使用立即执行函数，多个立即执行函数中间用分号隔开

(function(){})();

边框图片

• 使用场景：盒子大小不一，但边框样式相同
• 切图原理：把四个角切出去（九宫格），顺序上右下左，中间部分铺排、拉伸或环绕
  
• 语法：
  border-image-width默认为边框宽度