首記の件、教えて頂きたく。
下記ソースコードで花びらの一枚を作成しました。
これを題名の通り花びらの角度を変えて複製する方法がありましたら教えて頂きたくお願い致します。

イメージとして添付画像の様にしたいです。

'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();