uniapp 使用echart

uniapp 插件市场

echarts - DCloud 插件市场

```

<template>
<view>
<view style="width:100%;height: 500px;"><l-echart ref="chartRef"></l-echart></view>
</view>
</template>
 
<script>
const app = getApp();
import componentNoData from '../../components/no-data/no-data';
import componentBottomLine from '../../components/bottom-line/bottom-line';
import * as echarts from '@/uni_modules/lime-echart/static/echarts.min';
var common_static_url = app.globalData.get_static_url('common');
export default {
data() {
return {
option: {
xAxis: {
    type: 'category',
    data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
  },
  yAxis: {
    type: 'value'
  },
  series: [
    {
data: [820, 932, 901, 934, 1290, 1330, 1320],
type: 'line',
smooth: true
    }
]
},
}
},
onLoad(params) {
    // 调用公共事件方法
console.log(params)
 
//     app.globalData.page_event_onload_handle(params);
 
//     // 设置参数
//     this.setData({
//         params: params,
//     });
this.init()
},
methods: {
async init() {
// chart 图表实例不能存在data里
const chart = await this.$refs.chartRef.init(echarts);
var _this = this
uni.request({
url: app.globalData.get_request_url('line', 'buy'),
method: 'POST',
dataType: 'json',
success: (res) => {
chart.setOption(res.data.option)
}
})
 
 
 
}
 
}
}
</script>
 
<style>
    
</style>
```

原创文章,作者:易码农,如若转载,请注明出处:http://moon0421.top/?post=226

打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2024-9-10 00:00
下一篇 2024-9-10 09:38
版权所有:易码农
文章标题:uniapp 使用echart
除非注明,文章均为 易码农 原创,请勿用于任何商业用途,禁止转载

相关推荐

发表回复

您的电子邮箱地址不会被公开。 必填项已用*标注

sitemap