微信小程序antv-f2的异步记载传值

本文介绍了如何在微信小程序中利用antv-f2库进行异步图表的绘制,并详细阐述了如何在异步回调方法中传递和更新数据,确保图表与页面数据的同步。通过示例展示了从页面获取数据,初始化图表,以及在自定义tooltip和legend中的交互处理。同时提到了防止与其他组件渲染冲突的处理策略。
摘要由CSDN通过智能技术生成

示例中只有静态赋值,这个问题困扰了很久,最终结果

page外仍然定义initChart

let chart = null;

 

function initChart(canvas, width, height, F2) {

 

var pages = getCurrentPages();

var currPage = pages[pages.length - 1]

var data = currPage.data.myData

chart = new F2.Chart({

el: canvas,

width,

height

});

chart.source(data);

chart.tooltip({

custom: true, // 自定义 tooltip 内容框

onChange(obj) {

const legend = chart.get('legendController').legends.top[0];

const tooltipItems = obj.items;

const legendItems = legend.items;

const map = {};

legendItems.map(item => {

map[item.name] = Object.assign({}, item);

});

tooltipItems.map(item => {

const { name, value } = item;

if (map[name]) {

评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值