canvas柱状图前言在使用uni-app做项目的时候，遇到一个需要柱状图的地方。由于插件没有找到合适的，自己写了一个分享给大家。如果你有写得不好的地方，请多多指教。效果图功能：通过X轴数组的长度计算出每段的宽度，从而实现图片宽度和位置的自动分配。通过Y轴数组的最大值和最小值计算列在Y轴上对应的坐标，从而实现图形高度的比例分布。自定义宽度和高度。不定义宽度时，会自适应屏幕宽度。绘图分析此图标由xy轴、数据条组成。axis：使用moveTo(x,y)和lineTo(x,y)实现text：使用fillText(text,x,y)实现rectangle：使用fillRect(x,y,width,height)实现steps--displayed数据项X:['一月','二月','三月','四月','五月','六月','七月','八月','九月','十月','十一月','December',],itemsY:[65,35,43,77,75,48,95,80,65,35,43,77],--定义画布--计算Y轴上的刻度值数据Y轴每一段的长度，通过for循环，将每一段的scale值依次保存在yScales数组中。Y轴每段长度=（y轴最大值-y轴最小值）/总段数this.yNumberfor(letindex=0;indexthis.maxNumy?this.getMaxNum(this.itemsY):this.maxNumythis.scaleIntervalMin=this.getMinNum(this.itemsY)this.getyScale()this.getSingleLengths()this.drawCanvas()},方法：{getyScale(){//获取y轴上的刻度值数组letlength=(this.scaleIntervalMax-this.yAxisMinNum)/this.yNumberfor(letindex=0;indexnum?num=cur:null}returnnum},getMinNum(items){letnum=items[0]letcurfor(leti=1;i
