vue+ highcharts 整合 完美运行视图

一,配置highcharts环境

            1,如果你只是自己单独的写个测试demo

                 请先搭建highcharts       命令    npm  install highcharts  --save

           vue+ highcharts 整合 完美运行视图_第1张图片

           配置完成之后.

 二,新建组件   

       在src ------> components (组件目录下)

         新建    charts.vue 页面

vue+ highcharts 整合 完美运行视图_第2张图片

   2,编辑 charts.vue 页面,  代码如下:

       


三,编辑视图: 

            1. 新建一个页面 highcharts.vue   测试页面

        vue+ highcharts 整合 完美运行视图_第3张图片

 

           2. highcharts.vue  代码如下



 


四,运行结果

 

vue+ highcharts 整合 完美运行视图_第4张图片

五;git  地址

   

 

 

你可能感兴趣的:(vue)