主頁 > 知識庫 > HTML5 canvas畫矩形時出現(xiàn)邊框樣式不一致的解決方法

HTML5 canvas畫矩形時出現(xiàn)邊框樣式不一致的解決方法
熱門標簽：小朱地圖標注 地圖標注柱狀圖 四川移動電銷外呼客戶管理系統(tǒng) 智能芯電話機器人 臨海地圖標注app 咸陽穩(wěn)定外呼系統(tǒng)軟件 400開頭的電話好申請不 百度地圖標注為什么總是封號 怎么做百度地圖標注

這兩天需要用到同事HTML5畫圖的東東，發(fā)現(xiàn)里面畫矩形的函數(shù)畫出來的邊框出現(xiàn)了樣式不一致的問題，最后我通過一些排除法找到了問題的癥結(jié)，現(xiàn)分享給大家。

先附上HTML5畫矩形的的代碼：

復制代碼
代碼如下:

<canvas id="myCanvas" width="578" height="200"></canvas>
<script>
var canvas = document.getElementById('myCanvas');
var context = canvas.getContext('2d');

context.beginPath();

context.rect(188.0, 50, 200, 100.375);
context.fillStyle = 'white';
context.fill();
context.lineWidth = 1;
context.strokeStyle = 'red';
context.stroke();
</script>

你會發(fā)現(xiàn)執(zhí)行后邊框樣式不一樣，明顯底部很細。顏色也略有不同

把context.rect(188.0, 50, 200, 100.375)修改為context.rect(188.0, 50, 200, 100)后，發(fā)現(xiàn)樣式就完全一致了。
由此說明：畫矩形的時候，如果里面的參數(shù)有不是整數(shù)的話，容易導致邊框問題，所以建議大家取整后再用。

標簽：山南 公主嶺 黃石 黃石 平頂山 南平 陜西

巨人網(wǎng)絡通訊聲明：本文標題《HTML5 canvas畫矩形時出現(xiàn)邊框樣式不一致的解決方法》，本文關鍵詞  HTML5,canvas,畫,矩形,時,出現(xiàn),；如發(fā)現(xiàn)本文內(nèi)容存在版權問題，煩請?zhí)峁┫嚓P信息告之我們，我們將及時溝通與處理。本站內(nèi)容系統(tǒng)采集于網(wǎng)絡，涉及言論、版權與本站無關。
  • 相關文章
  • 下面列出與本文章《HTML5 canvas畫矩形時出現(xiàn)邊框樣式不一致的解決方法》相關的同類信息！
  • 本頁收集關于HTML5 canvas畫矩形時出現(xiàn)邊框樣式不一致的解決方法的相關信息資訊供網(wǎng)民參考！

    • 四合一精品企业网站建设

    多一个网站就为企业多增加一条营销渠道

    ¥888元限时抢购

    QQ立即咨询快速购买

    企业400电话

    智能AI客服机器人
    ￥15000

    在线订购

    合计11份范本：公司章程+合伙协议+出资协议+合作协议+股权转让协议+增资扩股协议+股权激励+股东会决议+董事会决议

    推薦文章