导航:首页 > 软件知识 > 微信小程序如何调用echarts

微信小程序如何调用echarts

发布时间:2023-07-25 12:57:37

❶ 微信小程序开发中遇到的坑及解决办法

taro单独为某个项目切换taro版本环境

单独为某一个项目升级#这样做的好处是全局的 Taro 版本还是 1.x 的,多个项目间的依赖不冲突,其余项目依然可以用旧版本开发。 如果你的项目里没有安装 Taro CLI,你需要先装一个:

# 如果你使用 NPM

$ npm install --save-dev @tarojs/[email protected]

# 如果你使用 Yarn

$ yarn add -D @tarojs/[email protected]

echarts在小程序中滑动卡顿

由于微信小程序中,echarts的层级最高,无论设置多大层级也无法遮住echarts。而且小程序中好像只能用echarts吧。所以为了解决这个bug,我只能委屈求全了。打开ec-canvas.wxml文件,将touchStart、touchMove和touchEnd去掉了,直接删除就好啦。这三个事件应该是做缩放的吧,我们也没有这个缩放的需求。所以就去掉了。虽然暂时满足的需求,还是没有真正的解决问题。

原:

bindinit="init"

bindtouchstart="{{ ec.disableTouch ? '' : 'touchStart' }}"

bindtouchmove="{{ ec.disableTouch ? '' : 'touchMove' }}"

bindtouchend="{{ ec.disableTouch ? '' : 'touchEnd' }}"

现:

bindinit="init"

echarts在小程序中无法跟随页面滑动

在卡顿问题中能与echarts交互少的,可以直接使用图片代替cannvas,即在echarts渲染完毕后将它替换为一张图片。

如果我更新了数据,那么就重新放出echarts,等它渲染完毕后,再次替换为一张图片。

chart.on('finished', () => {

getCurrentInstance().page.selectComponent(id).canvasToTempFilePath({

success: res => {

console.log('res.tempFilePath====',res.tempFilePath)

this.setState({

echartImgSrc: res.tempFilePath

      })

},

    fail: res =>console.log('转换图片失败', res)

});

})

render:

this.state.echartImgSrc =='' ?

  ref={this.refChart}

id={this.state.id}

canvas-id="mychart-area"

  force-use-old-canvas="true"

  ec={this.state.ec}

/>

:

<CoverImage src={this.state.echartImgSrc}></CoverImage>

阅读全文

与微信小程序如何调用echarts相关的资料

热点内容
apachedruid是什么数据库 浏览:588
手机程序包换了怎么办 浏览:648
如何清除王者荣耀微信数据 浏览:503
网络扶贫产品有哪些 浏览:383
上技术学院需要准备什么 浏览:587
数据类型哪些是字符型 浏览:33
售卖伪造3c的产品怎么判 浏览:11
哪个手机上的小程序能看电视剧 浏览:249
技术领先者是什么 浏览:477
除了打电话报案发信息怎么报案 浏览:447
卡拉宝的目标市场有哪些 浏览:335
基金撤销交易后资金什么时候到账 浏览:19
如何建立小程序官网 浏览:392
剔除数据为什么要剔除金融行业 浏览:698
安全技术防范备案怎么做 浏览:206
lead用什么代理软件 浏览:598
新式家居产品有哪些 浏览:870
交易日送股一般多少个 浏览:95
小程序新零售是什么意思 浏览:278
听力差的男孩适合学什么技术 浏览:36