JavaScriptの質問をしたり答えたりする掲示板
JavaScriptに関する質問を何でもしていい掲示板です。匿名での投稿も可能です。どんなことでもどしどし書き込んでください。回答もどなたでも自由にできます。僕も回答できる内容であれば必ず回答します！
質問は下記に沿って書いていただくと回答しやすくなります。
- 実際のソースコードがある場合、可能な範囲で書いていただくと問題点を見つけやすくなります。
- 実際に発生したエラーメッセージがある場合、コピペしていただくと問題解決につながる可能性が高いです。
- 見た目上の問題の場合、スクリーンショットを貼ると状況が把握しやすくなります。
首記の件、教えて頂きたく。
下記ソースコードで花びらの一枚を作成しました。
これを題名の通り花びらの角度を変えて複製する方法がありましたら教えて頂きたくお願い致します。
イメージとして添付画像の様にしたいです。
'use strict;'
//init
const canvas = document.getElementById('test');
const context = canvas.getContext('2d');
const WIDTH = $('#test').get(0).width = $(window).width();
const HEIGHT =$('#test').get(0).height = $(window).height();
//花びら(上)
context.beginPath();
context.moveTo(270,50);
context.quadraticCurveTo(300, 50, 260, 150);
context.moveTo(260,150);
context.quadraticCurveTo(240, 165, 230, 150);
context.quadraticCurveTo(210, 50, 230, 50);
context.moveTo(230,50);
context.lineTo(250,80);
context.lineTo(270,50);
context.lineWidth = 8;
context.strokeStyle = 'rgb(255,204,255)';
context.save();
context.moveTo(260,150);
context.quadraticCurveTo(240, 165, 230, 150);
context.quadraticCurveTo(210, 50, 230, 50);
context.moveTo(230,50);
context.lineTo(250,80);
context.lineTo(270,50);
context.stroke();