Kreisbogen...

var DrawBorder = 1;
var FillArea   = 2;
var ClosePath  = 4;

NewGraph2D( { Width: 600, Height: 400, DrawFunc: draw } );

function draw( jsg ) {
  jsg.Grid(50,50);

  jsg.SetAreaAttr( 'yellow', 'red', 2 );
  jsg.OpenPath();
  jsg.MoveTo( 150, 100 );
  jsg.LineTo( 250, 100 );
  jsg.ArcTo( 300, 150, 50 );
  jsg.LineTo( 300, 250 );
  jsg.ArcTo( 250, 300, -50 );
  jsg.Polygon( [210, 250, 200, 150, 190], [300, 325, 350, 325, 300], 8 );
  jsg.LineTo( 150, 300 );
  jsg.ArcTo( 100, 250, 50, true );
  jsg.LineTo( 100, 150 );
  jsg.ArcTo( 150, 100, -50, true );
  jsg.Circle( 200, 200, -50 );
  jsg.Path( 3 );

  jsg.Text( '1', 275, 125 );
  jsg.Text( '2 r<0', 275, 275 );
  jsg.Text( '3 big', 125, 275 );
  jsg.Text( '4 big r<0', 125, 125 );

  jsg.OpenPath();
  jsg.MoveTo( 500, 100 );
  jsg.ArcTo( 500, 200, 50 );
  jsg.LineTo( 400, 200 );
  jsg.ArcTo( 400, 100, 50 );
  jsg.Path( 7 );

  for (var r = 10; r < 100; r+=5) {
    jsg.ArcPt( 400, 300, 500, 300, -r, false );
    jsg.ArcPt( 400, 300, 500, 300, r, true );
  }
}