https://blog.csdn.net/CherryLee_1210/article/details/83016706（copy）
1、首先在uni-app中不支持包下載所以得自己先新建一個項目，然后進入到這個目錄下，執行 npm init，接下來一路回車即可。
2、下載所需要的庫
npm install echarts mpvue-echarts --save
1
3、進入 node_modules 目錄，里面的三個目錄：echarts、mpvue-echats 、zrender 就是我們需要的第三方庫。
4、把這三個庫copy到自己項目的根目錄下。
5、接下來要做的事兒就是導入庫。
在自己需要圖表顯示的組件中導入所需要的庫。
import * as echarts from 'echarts'
import mpvueEcharts from 'mpvue-echarts'
1
2
6、導入庫之后就要使用了
我在同一個頁面中使用了兩次mpvueEcharts組件，這里需要注意的是，使用多次就要給每一個mpvueEcharts組件指定一個特有的canvasId。（必須要的，否則不好使，我在這個地方踩坑了）
視圖層
<!-- 外層預留的圖表容器 -->
<view class="box1">
<!-- 引入的mpvue-echarts組件 -->
<mpvue-echarts canvasId="chat1" :echarts="echarts" :onInit="fn1OnInit" />
</view>
<view class="box2">
<mpvue-echarts canvasId="chat2" :echarts="echarts" :onInit="fn2OnInit" />
</view>
業務層
//導入庫
import * as echarts from 'echarts'
import mpvueEcharts from 'mpvue-echarts'
//命名一個方法名稱，方便自己識別，也方便多個圖表引用時易區別。
//切記這方法不能寫到export default中。
function fn1(canvas, width, height) {
const chart = echarts.init(canvas, null, {
width: width,
height: height
})
canvas.setChart(chart);
var option = {
...一些表格配置（參考echarts官方文檔根據自己需求配置即可）
}
chart.setOption(option)
return chart
};
function fn2(canvas, width, height) {
const chart = echarts.init(canvas, null, {
width: width,
height: height
})
canvas.setChart(chart);
var option = {
...一些表格配置（參考echarts官方文檔根據自己需求配置即可）
}
chart.setOption(option)
return chart
};
//這是vue的導出對象
export default {
data() {
return {
//初始化圖表
echarts,
//圖表數據綁定（我們定義的兩個方法綁定）
fn1OnInit: fn1,
fn2OnInit: fn2
}
},
//導入mpvue的mpvueEcharts組件。
components: {
mpvueEcharts
}
}
這樣就實現了我們的echarts表格在uni中的使用
相關鏈接
uni-app引入第三方庫
微信小程序中使用echarts
這里說明一點：
雖然第二個鏈接是微信小程序引入echarts，其實遠離一樣的。我們要到事情的本質，開始我一看小程序，直接忽略，因為我寫的不是小程序。可是后來找不到，就耐着性子去看，發現代碼是相通的。
雖然mpvue是一個使用 Vue.js 開發小程序的前端框架，但是這里導入組件，並且使用還是很順暢的。
mpvue的地址：
mpvue,外號“沒朋友”