Flag EU: Difference between revisions
		
		
		
		Jump to navigation
		Jump to search
		
No edit summary  | 
				|||
| Line 3: | Line 3: | ||
<div class=qu data-width=150 data-height=100>  | <div class=qu data-width=150 data-height=100>  | ||
[[Image:flagEuropeWrong.png|frame|Flag of Europe (almost)]]  | [[Image:flagEuropeWrong.png|frame|Flag of Europe (almost)]]  | ||
* 150 by 100  | |||
* stars are in a circle radius 100/3  | |||
* each star is had radius 7  | |||
<pre class=usr>  | <pre class=usr>  | ||
function drawFlag(ctx){  | function drawFlag(ctx){  | ||
Revision as of 18:59, 20 August 2021
Flag of Europe (nearly)

- 150 by 100
 - stars are in a circle radius 100/3
 - each star is had radius 7
 
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();
}
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();
}