首頁猿問為什么我的畫布在將 html...

為什么我的畫布在將 html 轉換為 DOM 調用時會自行縮放？

JavaScript

翻過高山走不出你 2024-01-18 20:34:02

在重構我的代碼以避免調用該innerHtml成員時，一個新的錯誤出現了。我只將 html 字符串轉換為 DOM 調用。鉻檢查器中不會拋出錯誤。我使用的是mercurial，舊版本仍然有效。我四處搜尋并發現：alert(ctx.getTransform());返回1,0,0,1,0,0恒等變換。但我的畫布縮放比例仍然錯誤。除了基本的線和筆畫成員之外，我不會稱呼任何其他東西。function buildColorTool() { var pick = document.createElement("DIV"); var canvas = document.createElement("canvas"); canvas.style.width = "200px"; canvas.style.height = "200px"; canvas.id = "wheelCanvas"; pick.appendChild(canvas); document.getElementById("toolWindow").appendChild(pick);}已損壞，但是： function buildColorTool() { let toolWindow = "<div class=\"toolDialogue\">"; toolWindow += " <div id=\"colorPicker\">"; toolWindow += " <canvas id=\"wheelCanvas\" width=\"200\" height=\"200\"></canvas>"; toolWindow += " </div>"; toolWindow += " </div>"; document.getElementById("toolWindow").innerHTML = toolWindow; }作品。我使用過hg diff -c 25 ./script.js > changes.txt，是否有更好的一組用于發布到堆棧交換的多變參數？

查看完整描述

1 回答

慕雪6442864

TA貢獻1812條經驗獲得超5個贊

問題是，您通過元素的樣式標簽設置元素的寬度和高度。然而，這會導致畫布元素出現問題。通常，高度和寬度屬性用于實際大小調整，CSS寬度/高度用于縮放。

解決方案?變更

function newColorCanvas() {

? ?var pick = document.createElement("DIV");

? ?var canvas = document.createElement("canvas");

? ?canvas.style.width = "200px";

? ?canvas.style.height = "200px";

? ?canvas.id = "wheelCanvas";

? ?canvas.innerText = "Canvas tag not supported";

? ?pick.appendChild(canvas);

? ?var select = document.createElement("P");

? ?select.id = "colorSelection";

? ?select.innerText = "HSL: 135, 75, 50";

? ?pick.appendChild(select);

? ?document.getElementById("toolWindow").appendChild(pick);

? ?paintCanvas(135,75,50);

? ?canvas.addEventListener('click', function() {updateCanvas();});

}

到

function newColorCanvas() {

? ?var pick = document.createElement("DIV");

? ?var canvas = document.createElement("canvas");

? ?canvas.width = 200;

? ?canvas.height = 200;

? ?canvas.id = "wheelCanvas";

? ?canvas.innerText = "Canvas tag not supported";

? ?pick.appendChild(canvas);

? ?var select = document.createElement("P");

? ?select.id = "colorSelection";

? ?select.innerText = "HSL: 135, 75, 50";

? ?pick.appendChild(select);

? ?document.getElementById("toolWindow").appendChild(pick);

? ?paintCanvas(135,75,50);

? ?canvas.addEventListener('click', function() {updateCanvas();});

}

反對回復 2024-01-18

1 回答
0 關注
197 瀏覽

關注

添加回答

舉報

0/150

提交

取消

亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

熱搜

最近搜索清空

為什么我的畫布在將 html 轉換為 DOM 調用時會自行縮放？

為什么我的畫布在將 html 轉換為 DOM 調用時會自行縮放？

1 回答

添加回答

為什么我的畫布在將 html 轉換為 DOM 調用時會自行縮放？

為什么我的畫布在將 html 轉換為 DOM 調用時會自行縮放？