Difference between revisions of "Flag EU"
Jump to navigation
Jump to search
Line 2: | Line 2: | ||
== Not quite right== | == Not quite right== | ||
<div class=qu data-width=150 data-height=100> | <div class=qu data-width=150 data-height=100> | ||
[[Image:flagEurope.png|frame|Flag of Europe}} | |||
<pre class=usr> | <pre class=usr> | ||
function drawFlag(ctx){ | function drawFlag(ctx){ | ||
ctx.fillStyle = 'blue'; | |||
ctx.fillRect(0,0,150,100); | |||
ctx.translate(75,50); | |||
ctx.fillStyle = 'gold'; | |||
for(let i = 0;i<12; i++){ | |||
ctx.translate(0,-50*2/3); | |||
ctx.scale(7/100,7/100); | |||
star(ctx); | |||
ctx.scale(100/7,100/7); | |||
ctx.translate(0,50*2/3); | |||
ctx.rotate(Math.PI/6); | |||
} | |||
} | |||
function star(ctx) | |||
{ | |||
ctx.beginPath(); | |||
[[0,-100],[22,-31],[95,-31],[36,12],[59,81], | |||
[0,38],[-59,81],[-36,12],[-95,-31],[-22,-31]] | |||
.forEach((xy)=>ctx.lineTo(xy[0],xy[1])); | |||
ctx.fill(); | |||
} | } | ||
</pre> | </pre> | ||
<pre class=ans> | <pre class=ans> | ||
function drawFlag(ctx){ | function drawFlag(ctx){ | ||
ctx.fillStyle = 'blue'; | |||
ctx.fillRect(0,0,150,100); | |||
ctx.translate(75,50); | |||
ctx.fillStyle = 'gold'; | |||
for(let i = 0;i<12; i++){ | |||
ctx.translate(0,-50*2/3); | |||
ctx.scale(7/100,7/100); | |||
star(ctx); | |||
ctx.scale(100/7,100/7); | |||
ctx.translate(0,50*2/3); | |||
ctx.rotate(Math.PI/6); | |||
} | |||
} | |||
function star(ctx) | |||
{ | |||
ctx.beginPath(); | |||
[[0,-100],[22,-31],[95,-31],[36,12],[59,81], | |||
[0,38],[-59,81],[-36,12],[-95,-31],[-22,-31]] | |||
.forEach((xy)=>ctx.lineTo(xy[0],xy[1])); | |||
ctx.fill(); | |||
} | } | ||
</pre> | </pre> | ||
</div> | </div> |
Revision as of 18:50, 20 August 2021
Not quite right
[[Image:flagEurope.png|frame|Flag of Europe}}
function drawFlag(ctx){ ctx.fillStyle = 'blue'; ctx.fillRect(0,0,150,100); ctx.translate(75,50); ctx.fillStyle = 'gold'; for(let i = 0;i<12; i++){ ctx.translate(0,-50*2/3); ctx.scale(7/100,7/100); star(ctx); ctx.scale(100/7,100/7); ctx.translate(0,50*2/3); ctx.rotate(Math.PI/6); } } function star(ctx) { ctx.beginPath(); [[0,-100],[22,-31],[95,-31],[36,12],[59,81], [0,38],[-59,81],[-36,12],[-95,-31],[-22,-31]] .forEach((xy)=>ctx.lineTo(xy[0],xy[1])); ctx.fill(); }
function drawFlag(ctx){ ctx.fillStyle = 'blue'; ctx.fillRect(0,0,150,100); ctx.translate(75,50); ctx.fillStyle = 'gold'; for(let i = 0;i<12; i++){ ctx.translate(0,-50*2/3); ctx.scale(7/100,7/100); star(ctx); ctx.scale(100/7,100/7); ctx.translate(0,50*2/3); ctx.rotate(Math.PI/6); } } function star(ctx) { ctx.beginPath(); [[0,-100],[22,-31],[95,-31],[36,12],[59,81], [0,38],[-59,81],[-36,12],[-95,-31],[-22,-31]] .forEach((xy)=>ctx.lineTo(xy[0],xy[1])); ctx.fill(); }