下面是antv f2 的一个demo,求教怎么把onInitChart方法写到data外面?
最终呈现:
index.wxml↓
<view class="container">
<f2 class="f2-chart" onInit="{{onInitChart}}" />
</view>
index.json↓
{
"usingComponents": {
"f2": "@antv/wx-f2"
}
}
index.js↓
Page({
data: {
onInitChart (F2, config) {
const chart = new F2.Chart(config);
const data = [
{ value: 63.4, city: 'New?York', date: '2011-10-01' },
{ value: 62.7, city: 'Alaska', date: '2011-10-01' },
{ value: 72.2, city: 'Austin', date: '2011-10-01' },
{ value: 58, city: 'New?York', date: '2011-10-02' },
{ value: 59.9, city: 'Alaska', date: '2011-10-02' },
{ value: 67.7, city: 'Austin', date: '2011-10-02' },
{ value: 53.3, city: 'New?York', date: '2011-10-03' },
{ value: 59.1, city: 'Alaska', date: '2011-10-03' },
{ value: 69.4, city: 'Austin', date: '2011-10-03' },
];
chart.source(data, {
date: {
range: [0, 1],
type: 'timeCat',
mask: 'MM-DD'
},
value: {
max: 300,
tickCount: 4
}
});
chart.area().position('date*value').color('city').adjust('stack');
chart.line().position('date*value').color('city').adjust('stack');
chart.render();
//?注意:需要把chart?return?出来
return chart;
}
},
onLoad:function(){
//?console.log(Page())
//?this.data.onInitChart()
},
});
这是官方给的demo,但是onInitChart方法是写到data中的,不太理解。怎么把这个方法拿出来呢?
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…