canvas设置scale在模拟器有效，真机无效
这是模拟器效果 [图片] 这是真机效果 [图片] 下面是代码： WXML： [代码]<[代码][代码]view[代码] [代码]class[代码][代码]=[代码][代码]"bg_theme"[代码][代码]>[代码][代码] [代码][代码]<[代码][代码]view[代码] [代码]class[代码][代码]=[代码][代码]"head_title"[代码][代码]>生长评价</[代码][代码]view[代码][代码]>[代码][代码] [代码][代码]<[代码][代码]view[代码] [代码]class[代码][代码]=[代码][代码]"flex-tab"[代码][代码]>[代码][代码] [代码][代码]<[代码][代码]view[代码] [代码]class[代码][代码]=[代码][代码]"toptab {{currentNavtab==idx ? 'active' : ''}}"[代码] [代码]wx:for[代码][代码]=[代码][代码]"{{navTab}}"[代码] [代码]wx:for-index[代码][代码]=[代码][代码]"idx"[代码] [代码]wx:for-item[代码][代码]=[代码][代码]"itemName"[代码] [代码]data-idx[代码][代码]=[代码][代码]"{{idx}}"[代码] [代码]bindtap[代码][代码]=[代码][代码]"switchTab"[代码][代码]>[代码][代码] [代码][代码]{{itemName}}[代码][代码] [代码][代码]</[代码][代码]view[代码][代码]>[代码][代码] [代码][代码]</[代码][代码]view[代码][代码]>[代码][代码] [代码][代码]<[代码][代码]view[代码] [代码]class[代码][代码]=[代码][代码]"canvasView"[代码][代码]>[代码][代码] [代码][代码]<[代码][代码]view[代码] [代码]class[代码][代码]=[代码][代码]"canvas_bg"[代码][代码]>[代码][代码] [代码][代码]<[代码][代码]canvas[代码] [代码]canvas-id[代码][代码]=[代码][代码]"mycanvas"[代码] [代码]class[代码][代码]=[代码][代码]"canvas"[代码] [代码]/>[代码][代码] [代码][代码]</[代码][代码]view[代码][代码]>[代码][代码] [代码][代码]</[代码][代码]view[代码][代码]>[代码][代码] [代码][代码]<[代码][代码]view[代码] [代码]class[代码][代码]=[代码][代码]"tipLabel"[代码][代码]>采用世卫组织儿童生长标准,评价结果仅供参考</[代码][代码]view[代码][代码]>[代码][代码]</[代码][代码]view[代码][代码]>[代码]WXSS [代码].toptab.active{[代码][代码] [代码][代码]font-weight[代码][代码]: [代码][代码]bold[代码][代码];[代码][代码] [代码][代码]background-color[代码][代码]: [代码][代码]gray[代码][代码];[代码][代码] [代码][代码]display[代码][代码]: flex;[代码][代码] [代码][代码]align-items: [代码][代码]center[代码][代码];[代码][代码] [代码][代码]justify-[代码][代码]content[代码][代码]: [代码][代码]center[代码][代码];[代码][代码] [代码][代码]width[代码][代码]: [代码][代码]30%[代码][代码];[代码][代码] [代码][代码]height[代码][代码]: [代码][代码]80[代码][代码]rpx;[代码][代码] [代码][代码]/*文字下面加线 border-bottom: solid 3px #ed7321;*/[代码][代码]}[代码] [代码].toptab{[代码][代码] [代码][代码]background-color[代码][代码]: lightgray;[代码][代码] [代码][代码]display[代码][代码]: flex;[代码][代码] [代码][代码]align-items: [代码][代码]center[代码][代码];[代码][代码] [代码][代码]justify-[代码][代码]content[代码][代码]: [代码][代码]center[代码][代码];[代码][代码] [代码][代码]width[代码][代码]: [代码][代码]30%[代码][代码];[代码][代码] [代码][代码]height[代码][代码]: [代码][代码]80[代码][代码]rpx;[代码][代码] [代码][代码]/* 动画 */[代码][代码] [代码][代码]border-bottom[代码][代码]: [代码][代码]solid[代码] [代码]3px[代码] [代码]transparent[代码][代码];[代码][代码] [代码][代码]transition: [代码][代码]all[代码] [代码]0.4[代码][代码]s ease-in-out;[代码][代码] [代码][代码]-moz-transition: [代码][代码]all[代码] [代码]0.4[代码][代码]s ease-in-out; [代码][代码]/* Firefox 4 */[代码][代码] [代码][代码]-webkit-transition: [代码][代码]all[代码] [代码]0.4[代码][代码]s ease-in-out; [代码][代码]/* Safari 和 Chrome */[代码][代码] [代码][代码]-o-transition: [代码][代码]all[代码] [代码]0.4[代码][代码]s ease-in-out; [代码][代码]/* Opera */[代码][代码]}[代码] [代码].flex-tab{[代码][代码] [代码][代码]margin[代码][代码]: [代码][代码]40[代码][代码]rpx;[代码][代码] [代码][代码]display[代码][代码]: flex;[代码][代码] [代码][代码]flex-flow: row [代码][代码]nowrap[代码][代码];[代码][代码] [代码][代码]justify-[代码][代码]content[代码][代码]: space-between;[代码][代码] [代码][代码]align-items: [代码][代码]center[代码][代码];[代码][代码]}[代码] [代码].canvasView {[代码][代码] [代码][代码]margin-top[代码][代码]: [代码][代码]40[代码][代码]rpx;[代码][代码] [代码][代码]display[代码][代码]: flex;[代码][代码] [代码][代码]justify-[代码][代码]content[代码][代码]: [代码][代码]center[代码][代码];[代码][代码]}[代码] [代码].canvas_bg {[代码][代码] [代码][代码]background-color[代码][代码]: [代码][代码]white[代码][代码];[代码][代码] [代码][代码]height[代码][代码]: [代码][代码]320px[代码][代码];[代码][代码] [代码][代码]width[代码][代码]: [代码][代码]320px[代码][代码];[代码][代码]}[代码] [代码].canvas{[代码][代码] [代码][代码]height[代码][代码]: [代码][代码]640px[代码][代码];[代码][代码] [代码][代码]width[代码][代码]: [代码][代码]640px[代码][代码];[代码][代码] [代码][代码]transform: scale([代码][代码]0.5[代码][代码]) translate([代码][代码]-320px[代码][代码], [代码][代码]-320px[代码][代码]);[代码][代码]}[代码] [代码].tipLabel {[代码][代码] [代码][代码]font-size[代码][代码]: [代码][代码]8pt[代码][代码];[代码][代码] [代码][代码]margin-top[代码][代码]: [代码][代码]10[代码][代码]rpx;[代码][代码] [代码][代码]margin-left[代码][代码]: [代码][代码]40[代码][代码]rpx;[代码][代码]}[代码] JS文件 [代码]const ctx = wx.createCanvasContext([代码][代码]'mycanvas'[代码][代码]);[代码][代码]const allWidth = 640;[代码][代码]const ageNum = 5;[代码][代码]const yNum = 5;[代码][代码]const itemLeft = 40;[代码][代码]const itemBottom = 40;[代码][代码]const ageItemWidth = (allWidth - itemLeft) / ageNum;[代码][代码]const ageItemHeight = (allWidth - itemBottom) / yNum;[代码] [代码]ctx.beginPath(); [代码][代码]// 开始创建一个路径，需要调用fill或者stroke才会使用路径进行填充或描边。[代码][代码][代码][代码]ctx.setLineWidth(1);[代码][代码]for[代码] [代码](let i = 1; i <= yNum; i++) {[代码][代码]// 横线[代码][代码] [代码][代码]ctx.moveTo(itemLeft, ageItemHeight*i);[代码][代码] [代码][代码]ctx.lineTo(allWidth, ageItemHeight*i);[代码][代码][代码][代码]}[代码][代码][代码][代码]for[代码] [代码](let i = 0; i < ageNum; i++) {[代码][代码]// 竖线[代码][代码] [代码][代码]ctx.moveTo(ageItemWidth*i + itemLeft, 0);[代码][代码] [代码] [代码] [代码][代码]ctx.lineTo(ageItemWidth*i + itemLeft, allWidth - itemBottom);[代码] [代码][代码][代码]}[代码] [代码] [代码][代码]// 2.画单位[代码][代码]ctx.setFontSize(16);[代码][代码]for[代码][代码](let i=0; i<=yNum; i++){[代码][代码] [代码][代码]ctx.fillText(`${120-i*15}cm`, 0, ageItemHeight * i + 20);[代码][代码] [代码][代码]ctx.fillText(`${i}Years`, ageItemWidth * i, allWidth - 5);[代码][代码]}[代码][代码] [代码] [代码]ctx.drawImage(`/Asset/${isBoy? [代码][代码]"boy"[代码][代码]:[代码][代码]"girl"[代码][代码]}AgeHeight.png`, itemLeft, 0);[代码][代码]ctx.stroke(); [代码][代码]// stroke一次画一次，只是没有显示出来[代码][代码]ctx.draw();[代码] 重点是： [代码].canvas{[代码][代码] [代码][代码]height[代码][代码]: [代码][代码]640px[代码][代码];[代码][代码] [代码][代码]width[代码][代码]: [代码][代码]640px[代码][代码];[代码][代码] [代码][代码]transform: scale([代码][代码]0.5[代码][代码]) translate([代码][代码]-320px[代码][代码], [代码][代码]-320px[代码][代码]);[代码][代码]}[代码]这个设置在真机上无用啊 大神帮忙看看啊
