echarts学习笔记（部分angular及ant-design）

1、在项目中修改ng-zorro组件默认样式的一些方法：

• 类名等 前加::ng-deep；
• 类名等 前加：root；
• 类名等 前加:host /deep/；

2、echarts横轴自定义时间粒度

两种解决方案，

• 第一：使用category为category作为xAxis，就可以调用xAxis中的xAxis.axisLabel.interval
• 第二：formatter的时候增加自己的判定，比如默认是yyyy-MM-dd格式，当满足一定条件后格式化为yyyy-MM-dd hh:mm

3、关于echarts折线图颜色渐变设置

areaStyle: {
            normal: {
              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                offset: 0,
                color: seriesItem.areaStyle.colorStart    //赋值颜色
              }, {
                offset: 0.8,
                color: seriesItem.areaStyle.colorEnd
              }], false),
              shadowColor: seriesItem.areaStyle.shadowColor,
              shadowBlur: 10
            }
          },

4、Angular开发问题：(node:11188) UnhandledPromiseRejectionWarning: Error: spawn cmd ENOENT

问题定位：

　　原因系统windown开发环境变量出了问题，ipconfig等命令失效。

　　这个 system32 文件夹中包含了大量的用于 Windows 的文件. 这里主要用于存储 DLL 文件, 控制面板小程序(.CPL), 设备驱动 (.drv), 帮助文件 (.hlp 和 .cnt), MS-DOS 工具 (.com), 语言支持文件 (.nls), 屏幕保护 (.scr), 安装信息文件 (.inf), 以及其它用于支持, 配置, 或操作的文件.文件说明　　aclui.dll …Security Descriptor Editor，没有它，注册表编辑器会无法运行

解决办法：

　　在系统属性中选择“高级系统设置”。在系统属性对话框中找到其上方的“高级”选项卡，里面有一个“环境变量”按钮，点击进入。

　　下方的系统变量区中找到变量“path”，点击下方的编辑。

　　如果path变量之前有内容，则需要在末尾添加一个分号，然后加入内容“c:windowssystem32”，如下图所示。环境变量设置完毕后，依次单击“确定”保存设置并退出设置界面。

　　重启启动idea，并运行项目解决。

5、angular空项目添加ng-alain

ng-alian 官网中推荐使用的方式有两种：

第一种

# 确保使用的是最新版本 Angular cli
ng new my-project --style less
cd my-project
ng add ng-alain
# 如果你想创建一个英文版本，则：
ng add ng-alain --defaultLanguage=en
ng serve

ps：angular-cli的升级

# 卸载现有angular-cli
npm uninstall -g angular-cli
# 清空cache
npm cache clean -f
# 升级
npm install -g @angular/cli@latest
# 升级到固定版本号
npm install -g @angular/cli@版本号 

第二种

git clone --depth=1 https://github.com/ng-alain/ng-alain.git my-project
cd my-project
# 安装依赖包
yarn / npm i # 选一个
ng serve

第一种是一个空项目，第二种要自己删很多组件。

重点说明一下第二种，遇到通过npm添加，报很多的错误，具体的错误没有截图，这时候就需要通过yarm的方式来添加了。

全局安装yarn

npm install -g yarn

使用angular-cli成一个空项目

# 空项目
ng new ng-alain-demo --style less
cd ng-alain-demo
# 添加ng-alain
yarn add ng-alain
# 启动
ng serve

6、