这是我在wxml文件中定义的canvas:
<canvas canvas-id="arcCanvas"style="width:{{mywinWidth}}; height:{{myWinWidth}};" ></canvas>
//下面是我在js文件中onLoad(){....}函数中获取的两个值:
wx.getSystemInfo({
success(res) {
circleRound = (res.windowWidth) / 2;
var my_js_WinWidth = res.windowWidth;//获取到了窗口的宽度
that.setData({
mycircleRound: circleRound, //成功设置数据绑定,加载到WXML文件中
mywinWidth: my_js_WinWidth //成功设置数据绑定,加载到WXML文件中,而且控制台也显示相关信息:
})
}
})
//成功设置数据绑定,编译以后,在控制台的WXML栏目也显示出如下信息:
//在控制台的WXML栏目也显示出如下信息:
<canvascanvas-id="arcCanvas"style="width:414; height:414;"></canvas>
//但是在控制台的Styles栏目却显示出如下信息:
Styles
element.style {
}
* {
margin:0;
}
page {
-webkit-user-select:none;
user-select:none;
width:100%;
overflow-x:hidden;
}
截图如下:
这个效果是固定的高度和宽度,不同的手机效果会不同,我需要满屏显示星空图
你style栏选中的是page。。。
class无效,
class="width:420px; height:444px;"
JS里面显示错误:
// ctx.canvas.width=2*circleRound;//行不通
// ctx.canvas.height=2*circleRound;//行不通
// ctx.width=2*circleRound;//行不通
// ctx.height=2*circleRound;//行不通
如果有解决思路请你直接说答案好么?