vue項目, 需要使用echart庫, 查看文檔得知,echart獲取方式分為npm, github, cdn等方式,還有在線定制, 再次記錄在線定制echarts.js文件后如何使用
1. 在線根據(jù)功能定制echarts.js文件,并copy到項目目錄下;
2. 在項目的index.html文件中引入
<script type='text/javascript' src='/echarts/echarts.js'></script>
3. 新建echart.vue文件, 實現(xiàn)業(yè)務頁面;
4. 頁面中實現(xiàn)
? ? 1)??html: <div class="echart-box" id="box"></div>
? ? 2)?script 中的?methods定義方法, 實現(xiàn)方法
? ???var chartDom = document.getElementById('box0');
? ?? var myChart = echarts.init(chartDom); // 此處echarts可以直接用
? ??myChart.setOption(option)// 此處的option就是實例中的內(nèi)容, 根據(jù)業(yè)務功能填寫即可
完成
記錄遇到的另外一個問題:
控制臺提示錯誤:?Component title is used but not imported.
import { TitleComponent } from 'echarts/components';
echarts.use([TitleComponent]);
這里面是因為我在在option中設置了title內(nèi)容, TitleComponent組件與其對應, 但是在線定制的echarts.js沒有TitleComponent就報錯.
解決方式1: 重新定制echarts.js文件, 讓其包含title相關設置;
解決方式2: 刪除option中的title 相關設置
