數據可視化工具-Vue-DataV入門


官網:http://datav.jiaminghi.com/guide

項目效果圖【注:已創建Vue項目】

 

 

 

1.npm安裝

npm install @jiaminghi/data-view

 

2.全局引用

import dataV from '@jiaminghi/data-view';
Vue.use(dataV);

 

 3.項目案例使用

在官方文檔中選擇想要的效果,復制代碼即可

eg:加載效果    <dv-loading>Loading...</dv-loading>

 

 4.效果展示

 5.水位圖的完整代碼

 

 

 

 

 

 

 

 6.膠囊柱圖

 

 

 7.飛線圖

 

 

1)組件提供了dev模式,可以幫你快速確定飛線點位置,設置組件屬性devtrue即可啟用dev模式:

 

 

2)根據config參數調整飛線圖效果

 

 eg:

 

更多驚喜等你開啟喲!


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM