小程序柱状图

最新推荐文章于 2023-08-04 17:29:50 发布

置顶 Frankeen

最新推荐文章于 2023-08-04 17:29:50 发布

阅读量6.1k

点赞数 1

分类专栏：小程序

本文链接：https://blog.csdn.net/kai_1215/article/details/79298375

版权

小程序专栏收录该内容

20 篇文章 0 订阅

订阅专栏

注意要点：

1，通过小程序提供的canvas组件来绘制。需要注意地方是自定义的组件的包含canvas的时候，创建 canvas 绘图上下文需要使用wx.createCanvasContext(canvasId, this)，有疑问请查看微信小程序api介绍https://developers.weixin.qq.com/miniprogram/dev/api/canvas/create-canvas-context.html
2，使用canvasContext.setLineDash虚线完成之后，可以通过以下方式让之后的线条变回实线。

canvasContext.setLineDash([10,0],0)

3，使用canvasContext.createLinearGradient渐变之后，可以通过以下方式让之后的画笔回归正常效果

  let bgrd = context.createLinearGradient(0, 0, 1, 1);
  bgrd.addColorStop(0, items.point.bColor)
  bgrd.addColorStop(1, items.point.bColor)
  context.setFillStyle(bgrd);