简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
ホームページ > ウェブフロントエンド > H5 チュートリアル > 本文

HTML5 キャンバスで楕円を描画し、線の太さを均一に保つためのヒント_html5 チュートリアルのヒント

WBOY
リリース： 2016-05-16 15:49:54
オリジナル
1399 人が閲覧しました

Canvas での楕円の描画は非常に一般的な要件です。比較的新しい HTML Canvas 2D Context W3C ドラフトでは、楕円を描画するための ellipse メソッドが追加されています。そのため、arc または arcTo を使用する必要があります。 . スケール変形を組み合わせて楕円を描く方法です。

サンプルコード:

コードをコピー
コードは次のとおりです:


<script> <br>var ctx = documentquerySelector('canvas')getContext('2d'); = "10 "; <br>ctxarc(150,150,100,0,MathPI*2,false); <br></script>



線の太さが不均一で、ストロークもスケールの影響を受けているため、何かが間違っています。 この問題を解決するには、ちょっとしたコツが必要です。
サンプルコード:



コードをコピー
コードは次のとおりです:
[コード]
人気のチュートリアル
詳細>
関連するチュートリアル
人気のおすすめ
最新のコース
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート
私たちについて 免責事項 Sitemap
PHP中国語ウェブサイト：福祉オンライン PHP トレーニング，PHP 学習者の迅速な成長を支援します！