小程序echarts

小程序echarts,第1张

一、引入ec-canvas文件

https://github.com/ecomfe/echarts-for-weixin

“ec-canvas”

二、配置json

{

"usingComponents":{

"誉竖伍ec-canvas":"../../ec-canvas/ec-canvas"

}

}

三、书写结构

<view class="container log-list">

<ec-canvas id="mychart-dom-line" canvas-id="mychart-line" ec="{{ec}}"></ec-canvas>

</view>

四、js文件

//logs.js

const util = require('../../utils/util.js')

import * as echarts from '../../ec-canvas/echarts'

const app = getApp()

function initChart(canvas,width,height){

const chart = echarts.init(canvas,null,{

width:width,

height:height

})

canvas.setChart(chart)

var option = {

color:["#37A2DA","#67E0E3","#9FE6B8"],

legend:{

data:["A","B","C"],

top:20,

left:"center",

z:100

},

grid:{

left:"3%",

right:"4%",

bottom:"3%",

containLabel:true

},

xAxis:{

type:"category",

boundaryGap:false,

data:["周一","周二","周三","周四","周五","周纤帆六","周日"]

}

chart.setOption(option)

return chart

}

Page({

onShareAppMessage:function(res){

return{

title:"Echarts",

path:"/pages/index/index",

success:function(){},

fail:function(){}

}

},

data: {

ec:{

onInit:initChart

},

logs: []

},

onReady(){},

onLoad: function () {

this.setData({

logs: (wx.getStorageSync('庆或logs') || []).map(log =>{

return util.formatTime(new Date(log))

})

})

}

})

链接: https://pan.baidu.com/s/1W5Z-QWm1gNJGw9oX5CltDQ

提取码:vb0i

我是跟pages放在了同级

如:在 page目录饥核局的cc页面中使用echarts的话,需要在cc.json中添加以下配置烂让氏谨。


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/yw/12233327.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-22
下一篇 2023-05-22

发表评论

登录后才能评论

评论列表(0条)

保存