【ECharts、vue】vue.js+ECharts实现实时更新的热力图

林宇荣

首先在vue项目根目录中打开命令行工具然后安装echarts：
npm  install  echarts --save
推荐使用cnpm  install  echarts --save
cnpm 安装：npm install -g cnpm --registry=https://registry[color=rgb(0, 153, 0) !important].npm[color=rgb(0, 153, 0) !important].taobao[color=rgb(0, 153, 0) !important].org

布局：
创建一个盒子存放热力图：
html：
  <div>
    <div class="imaging">
      <div class="Chart" id="Chart"></div>
    </div>
  </div>



js：
代码太长，打开附件查看

css：
#Chart {
  width: 752px;
  height: 616px;
  background-color: #09326a;
  border-radius: 20px;
  padding-left: 50px;
}



最后别忘了在生命周期中启用Thermodynamic()方法