第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全,請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問題,去搜搜看,總會(huì)有你想問的

在 HTML Canvas 中的圖像頂部繪制圓/弧

在 HTML Canvas 中的圖像頂部繪制圓/弧

aluckdog 2022-12-22 09:31:19
我有一個(gè)簡單的畫布,背景是一個(gè)矩形,底部有一個(gè)圖像,我正在嘗試?yán)L制一個(gè)圓圈,該圓圈的一部分與圖像重疊。我有點(diǎn)卡在globalCompositeOperation使用哪個(gè)圓弧/圓出現(xiàn)在畫布上圖像的頂部。代碼:   var canvas = document.getElementById('myCanvas');      var context = canvas.getContext('2d');      var centerX = canvas.width / 2;      var centerY = canvas.height / 2;      var radius = 70;      context.fillStyle = "#29BEF1";      context.fillRect(0, 0, 800, 131);       var img = new Image;       img.src = 'https://i.imgur.com/aN26XpH.png';       img.onload = function() {          context.drawImage(img, 0, 29)      }       context.beginPath();      context.arc(800, -29, 87, 0, 2 * Math.PI);      context.closePath();      context.fillStyle = '#FEDB62';      context.fill();      body {        margin: 0px;        padding: 0px;      }    <canvas id="myCanvas" width="800" height="131"></canvas>
查看完整描述

1 回答

?
不負(fù)相思意

TA貢獻(xiàn)1777條經(jīng)驗(yàn) 獲得超10個(gè)贊

問題是由于加載圖像是異步的,一旦加載并繪制它就會(huì)與已經(jīng)繪制的圖像重疊。


一個(gè)解決方案是將繪制太陽的代碼移動(dòng)到onload回調(diào)中。


img.onload = function() {

  // draw image

  context.drawImage(img, 0, 29)


  // draw sun

  context.beginPath();

  context.arc(800, -29, 87, 0, 2 * Math.PI);

  context.closePath();

  context.fillStyle = '#FEDB62';

  context.fill();

}


查看完整回答
反對(duì) 回復(fù) 2022-12-22
  • 1 回答
  • 0 關(guān)注
  • 114 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)