Vue移動端專案中使用echarts

2021-10-09 05:00:25 字數 1226 閱讀 4386

npm i echarts -s
// 引入

import echarts from 'echarts'

// 註冊

vue.prototype.$echarts = echarts

// 獲取需要生成圖表的元素

// 以下是一些常用的配置引數 都有寫明詳細的注釋

initchart()

},splitarea:

,// 縱向背景區域

axistick:

,// 除去x軸的刻度

axisline:

// x軸},

boundarygap:

false

,// 使折點與x軸的數值對齊 為true時是與刻度對齊

axislabel:}}

, yaxis:

, axisline:

// y軸}}

, series:[}

, smooth:

true

,// symbol: 'circle', //設定為實心點

symbolsize:4,

// 設定折點的大小

itemstyle:

:' show:

false

, formatter:''}

, color:

'#f6c20a'

, width:3}

, emphasis:}}

,// data: [45, 50, 51, 50, 49, 48, 53],

data:[,

,,,,

,}// 給指定的拐點上方顯示值],

type:

'line'}]

, grid:

} echarts.

setoption

(option)},

// 然後在mounted裡呼叫該方法就可以了

mounted()

最終展示的效果就是圖下所示啦

在vue移動端專案中使用rem布局簡易教程

rem布局由於其根據螢幕寬度的改變修改相應的rem與px的轉換比例,這樣非常適合移動端的專案。在不同的解析度下,都會有較好的顯示效果。在使用rem布局的時候需要引入flexible.js。js會根據螢幕的寬度計算html的根字型大小 在vue專案中只需要安裝raziel flex模組引用就行 安裝方...

vue專案中使用jQuery

這裡是引入全域性的jquery 1.在package.json檔案中,devdependencies 物件中新增 jquery 3.1.1 2.在build資料夾下的webpack.base.conf.js檔案中新增 var webpack require webpack 增加乙個plugins p...

vue 專案中使用 jquery

在 vue 專案中使用 jquery,具體步驟如下 1 npm 安裝 jquery 命令如下,後邊指定安裝的 jquery 版本 npm install jquery 3.2.1不加 會安裝最新版本 npm install jquery命令執行成功後,會在 package.json 檔案中自動生成 ...