canvas中设置animation: true 第一次进入制作的图表正常显示多次进行退出进入图表后图表中数据随动画上线闪烁后才展示全面,如图。这个如何处理呢?是否属于bug?小程序名称为:请求管理员帮助
代码如下: 运用了此chartjs库
var
wxCharts = require(
'../../../utils/wxcharts.js'
);
var
app = getApp();
var
lineChart =
null
;
Page({
data: {
},
touchHandler:
function
(e) {
console.log(e);
console.log(lineChart.getCurrentDataIndex(e));
lineChart.showToolTip(e, {
// background: '#7cb5ec'
});
},
createSimulationData:
function
() {
var
categories = [];
var
data = [];
for
(
var
i = 0; i < 10; i++) {
categories.push(
'2016-'
+ (i + 1));
data.push(Math.random()*(20-10)+10);
}
// data[4] = null;
return
{
categories: categories,
data: data
}
},
updateData:
function
() {
var
simulationData =
this
.createSimulationData();
var
series = [{
name:
'成交量1'
,
data: simulationData.data,
format:
function
(val, name) {
return
val.toFixed(2) +
'万'
;
}
}];
lineChart.updateData({
categories: simulationData.categories,
series: series
});
},
onLoad:
function
(e) {
var
windowWidth = 320;
try
{
var
res = wx.getSystemInfoSync();
windowWidth = res.windowWidth;
}
catch
(e) {
console.error(
'getSystemInfoSync failed!'
);
}
var
simulationData =
this
.createSimulationData();
lineChart =
new
wxCharts({
canvasId:
'lineCanvas'
,
type:
'line'
,
categories: simulationData.categories,
animation:
true
,
background:
'#f5f5f5'
,
series: [{
name:
'成交量1'
,
data: simulationData.data,
format:
function
(val, name) {
return
val.toFixed(2) +
'万'
;
}
}, {
name:
'成交量2'
,
data: [11, 24, 29, 15,
null
, 21, 32, 23, 45, 21],
format:
function
(val, name) {
return
val.toFixed(2) +
'万'
;
}
}],
xAxis: {
disableGrid:
true
},
yAxis: {
title:
'成交金额 (万元)'
,
format:
function
(val) {
return
val.toFixed(2);
},
min: 0
},
width: windowWidth,
height: 200,
dataLabel:
false
,
dataPointShape:
true
,
extra: {
lineStyle:
'curve'
}
});
}
});