各位遇到问题请先参考以下问题，如果仍不能解决，请到uni-app插件市场留言。

通用问题

  • 如果用在您的项目上图表不显示，请先运行demo页面，如果demo页面也无法显示，请查看全局样式是否定义了canvas的样式，如有请取消。
  • 如果实例化图表后，发现图表位置不正确，请检查css样式以及cWidth和cHeight的值是否相等，很多朋友修改画布大小时，忽略的这个问题，导致图表显示不完整。
  • 图表背景颜色问题，很多朋友设置图表背景颜色时候，只修改了view和canvas的css,忘记了修改实例化参数中的background:'#FFFFFF'，导致图表画板右侧有一道白条（这个是图表配置中的右边距），所以特修改了demo中的柱状图的背景颜色供大家参考。
  • 如果将canvas放在多级组件下，遇到ToolTip不显示或点击区域不正确，请在touch事件中增加以下代码解决。
  1. //#ifdef MP-ALIPAY
  2. e.mp.currentTarget.offsetTop+=uni.upx2px(510);
  3. //#endif

uni.upx2px(510);是canvas组件的上级组件的高度

支付宝问题

兼容支付宝小程序写法，请在模板中使用条件编译，请参考如下代码

  1. <!--#ifdef MP-ALIPAY -->
  2. <canvas canvas-id="canvasColumn" id="canvasColumn" class="charts" :style="{'width':cWidth*pixelRatio+'px','height':cHeight*pixelRatio+'px', 'transform': 'scale('+(1/pixelRatio)+')','margin-left':-cWidth*(pixelRatio-1)/2+'px','margin-top':-cHeight*(pixelRatio-1)/2+'px'}"></canvas>
  3. <!--#endif-->
  4. <!--#ifndef MP-ALIPAY -->
  5. <canvas canvas-id="canvasColumn" id="canvasColumn" class="charts""></canvas>
  6. <!--#endif-->

  • 在高分屏模式下，如果发现图表已显示，但位置不正确，请检查上级view容器的样式，为了解决高分屏canvas模糊问题，使用了css的transform，所以请修改上级样式使canvas容器缩放至相应位置。

支付宝小程序IDE中不显示，但运行到真机是可以显示的，请真机测试。

组件问题

  • 很多小伙伴们自行把本插件做成组件来调用，做成组件需要注意，如果涉及到v-if切换显示图表组件，第二次可能会变空白，这里有两个建议：1、建议用v-show替代v-if切换显示图表组件。2、建议参考demo，不要将canvas做到组件里使用，即直接写在主页面中。3、初步解决组件内使用问题，感谢342805357@qq.com提出组件问题解决方案，增加opts.$this参数，组件使用时实例化前请传递this。后续会增加组件使用示例，请关注。