HTML Canvas弧在错误的位置绘制JavaScript

时间:2018-10-17 20:51:29

标签: javascript html css html5-canvas

{org.wso2.carbon.identity.oauth2.token.handlers.grant.PasswordGrantHandler} -  Non-SaaS service provider. Application tenantDomain(carbon.super) != User tenant domain(aipsso.com)
TID: [-1234] [] [2018-10-17 20:24:39,065] DEBUG {org.wso2.carbon.identity.oauth2.token.AccessTokenIssuer} -  Error occurred while validating grant
org.wso2.carbon.identity.oauth2.IdentityOAuth2Exception: Users in the tenant domain : aipsso.com do not have access to application aip_default
       at org.wso2.carbon.identity.oauth2.token.handlers.grant.PasswordGrantHandler.validateUserTenant(PasswordGrantHandler.java:91)
       at org.wso2.carbon.identity.oauth2.token.handlers.grant.PasswordGrantHandler.validateGrant(PasswordGrantHandler.java:69)

动态创建画布后尝试在鼠标位置绘制弧形,例如 : 按下画布右下角的位置可以给我正确的位置,但是按下时不会画出弧线,按下中间的位置会画出远离鼠标位置的弧线。检查解决方案并尝试了不同的宽度和高度,如果画布尺寸为250x100,则几乎可以绘制正确的圆弧位置。

  • HTML代码包含脚本,只有一个带有类的正文。

1 个答案:

答案 0 :(得分:0)

使用

canvas.width = 300;
canvas.height = 200;

代替

canvas.style.width = "300px";
canvas.style.height = "200px";

为什么?

默认情况下,canvas width属性设置为300,高度设置为150。上下文将仅在这些尺寸内运行。设置画布的CSS高度和宽度只会将其缩放到指定的大小,这意味着您的弧线会在300x150的框中绘制,然后拉伸到300x200。这会导致变形和不正确的定位。

Demo