微信使用echarts ec-canvas 区域缩放 真机调试不流畅 很卡 [图片] // pages/study/study.js import * as echarts from '../../ec-canvas/echarts'; function initChart(canvas, width, height) { const chart = echarts.init(canvas, null, { width: width, height: height }); canvas.setChart(chart); var option = { xAxis: { type: 'category', data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] }, yAxis: { type: 'value' }, dataZoom: [{ // 内置于坐标系中，使用户可以在坐标系上通过鼠标拖拽、鼠标滚轮、手指滑动（触屏上）来缩放或漫游坐标系 type: 'inside', start: 0, end: 10 }, { start: 0, end: 10, // handleIcon 手柄的 icon 形状，支持路径字符串 handleIcon: 'M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z', handleSize: '80%', //  控制手柄的尺寸，可以是像素大小，也可以是相对于 dataZoom 组件宽度的百分比，默认跟 dataZoom 宽度相同。 handleStyle: { color: 'pink', shadowBlur: 3, // shadowBlur图片阴影模糊值，shadowColor阴影的颜色 shadowColor: 'red', shadowOffsetX: 2, shadowOffsetY: 2 } }], series: [{ data: [820, 932, 901, 934, 1290, 1330, 1320], type: 'line' }] } chart.setOption(option); return chart; } Page({ /**   * 页面的初始数据   */ data: { ec: { onInit: initChart } }

微信使用echarts ec-canvas 区域缩放 真机调试不流畅 很卡 // pages/study/study.js import * as echarts from '../../ec-canvas/echarts'; function initChart(canvas, width, height) { const chart = echarts.init(canvas, null, { width: width, height: height }); canvas.setChart(chart); var option = { xAxis: { type: 'category', data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] }, yAxis: { type: 'value' }, dataZoom: [{ // 内置于坐标系中，使用户可以在坐标系上通过鼠标拖拽、鼠标滚轮、手指滑动（触屏上）来缩放或漫游坐标系 type: 'inside', start: 0, end: 10 }, { start: 0, end: 10, // handleIcon 手柄的 icon 形状，支持路径字符串 handleIcon: 'M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z', handleSize: '80%', //  控制手柄的尺寸，可以是像素大小，也可以是相对于 dataZoom 组件宽度的百分比，默认跟 dataZoom 宽度相同。 handleStyle: { color: 'pink', shadowBlur: 3, // shadowBlur图片阴影模糊值，shadowColor阴影的颜色 shadowColor: 'red', shadowOffsetX: 2, shadowOffsetY: 2 } }], series: [{ data: [820, 932, 901, 934, 1290, 1330, 1320], type: 'line' }] } chart.setOption(option); return chart; } Page({ /**   * 页面的初始数据   */ data: { ec: { onInit: initChart } }, /**   * 生命周期函数--监听页面加载   */ onLoad: function(options) { }, /**   * 生命周期函数--监听页面初次渲染完成   */ onReady: function() { }, /**   * 生命周期函数--监听页面显示   */ onShow: function() { }, /**   * 生命周期函数--监听页面隐藏   */ onHide: function() { }, /**   * 生命周期函数--监听页面卸载   */ onUnload: function() { }, /**   * 页面相关事件处理函数--监听用户下拉动作   */ onPullDownRefresh: function() { }, /**   * 页面上拉触底事件的处理函数   */ onReachBottom: function() { }, /**   * 用户点击右上角分享   */ onShareAppMessage: function() { }, })

- 当前 Bug 的表现（可附上截图） - 预期表现 - 复现路径 - 提供一个最简复现 Demo // pages/study/study.js import * as echarts from '../../ec-canvas/echarts'; function initChart(canvas, width, height) { const chart = echarts.init(canvas, null, { width: width, height: height }); canvas.setChart(chart); var option = { xAxis: { type: 'category', data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] }, yAxis: { type: 'value' }, dataZoom: [{ // 内置于坐标系中，使用户可以在坐标系上通过鼠标拖拽、鼠标滚轮、手指滑动（触屏上）来缩放或漫游坐标系 type: 'inside', start: 0, end: 10 }, { start: 0, end: 10, // handleIcon 手柄的 icon 形状，支持路径字符串 handleIcon: 'M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z', handleSize: '80%', //  控制手柄的尺寸，可以是像素大小，也可以是相对于 dataZoom 组件宽度的百分比，默认跟 dataZoom 宽度相同。 handleStyle: { color: 'pink', shadowBlur: 3, // shadowBlur图片阴影模糊值，shadowColor阴影的颜色 shadowColor: 'red', shadowOffsetX: 2, shadowOffsetY: 2 } }], series: [{ data: [820, 932, 901, 934, 1290, 1330, 1320], type: 'line' }] } chart.setOption(option); return chart; } Page({ /**   * 页面的初始数据   */ data: { ec: { onInit: initChart } }, /**   * 生命周期函数--监听页面加载   */ onLoad: function(options) { }, /**   * 生命周期函数--监听页面初次渲染完成   */ onReady: function() { }, /**   * 生命周期函数--监听页面显示   */ onShow: function() { }, /**   * 生命周期函数--监听页面隐藏   */ onHide: function() { }, /**   * 生命周期函数--监听页面卸载   */ onUnload: function() { }, /**   * 页面相关事件处理函数--监听用户下拉动作   */ onPullDownRefresh: function() { }, /**   * 页面上拉触底事件的处理函数   */ onReachBottom: function() { }, /**   * 用户点击右上角分享   */ onShareAppMessage: function() { }, })