Compare commits

...

2 Commits

  1. 30
      HexGrid/Path.pm
  2. 1
      tests/.gitignore
  3. 9
      tests/paths.pl
  4. 329
      tests/paths.svg

@ -35,9 +35,9 @@ sub get_edge_direction($tile1, $tile2)
#TODO: should die here, to be caught/bubbled in render...
}
sub curve_path($x1, $y1, $qx, $qy, $x2, $y2)
sub curve_to($qx, $qy, $x, $y)
{
return "M $x1,$y1 Q $qx,$qy $x2,$y2";
return "Q $qx,$qy $x,$y";
}
@ -48,7 +48,7 @@ sub render($this, $grid, $svg)
return unless @{$this->tiles};
my $g = $svg->g(id => $this->id, class => $this->css_class);
my ($x1, $x2, $y1, $y2);
my ($x0, $x, $y0, $y);
my $current_tile = shift @{$this->tiles};
unless (@{$this->tiles})
@ -59,13 +59,13 @@ sub render($this, $grid, $svg)
fill => $this->colour, style => $this->style, class => $this->css_class);
return;
}
my $path_spec;
my $previous_tile = $current_tile;
$current_tile = shift @{$this->tiles};
my $next_edge = get_edge_direction($previous_tile, $current_tile);
($x1, $y1) = $grid->coords_of_centre($previous_tile->nw, $previous_tile->sw);
($x2, $y2) = $grid->coords_of_edge($previous_tile->nw, $previous_tile->sw, $next_edge);
$g->line(x1 => $x1, y1 => $y1, x2 => $x2, y2 => $y2,
stroke => $this->colour, style => $this->style, class => $this->css_class);
($x0, $y0) = $grid->coords_of_centre($previous_tile->nw, $previous_tile->sw);
($x, $y) = $grid->coords_of_edge($previous_tile->nw, $previous_tile->sw, $next_edge);
$path_spec .= "M $x0,$y0 L $x,$y";
my $previous_edge; # not defined yet
my $next_tile; # not defined yet
@ -75,23 +75,21 @@ sub render($this, $grid, $svg)
$previous_edge = -$next_edge;
$next_edge = get_edge_direction($current_tile, $next_tile);
($x1,$y1) = $grid->coords_of_edge($current_tile->nw, $current_tile->sw, $previous_edge);
my ($qx,$qy) = $grid->coords_of_centre($current_tile->nw, $current_tile->sw);
($x2,$y2) = $grid->coords_of_edge($current_tile->nw, $current_tile->sw, $next_edge);
($x,$y) = $grid->coords_of_edge($current_tile->nw, $current_tile->sw, $next_edge);
$g->path(d => curve_path($x1,$y1, $qx,$qy, $x2,$y2), fill => 'transparent',
stroke => $this->colour, style => $this->style, class => $this->css_class
);
$path_spec .= " " . curve_to($qx,$qy, $x,$y);
$previous_tile = $current_tile;
$current_tile = $next_tile;
}
# When loop is done (or if it was empty) $current_tile is the last tile
# $next_edge will be the last used edge, so use it's opposite for the source of last line
($x1, $y1) = $grid->coords_of_edge($current_tile->nw, $current_tile->sw, -$next_edge);
($x2, $y2) = $grid->coords_of_centre($current_tile->nw, $current_tile->sw);
$g->line(x1 => $x1, y1 => $y1, x2 => $x2, y2 => $y2,
stroke => $this->colour, style => $this->style, class => $this->css_class);
($x, $y) = $grid->coords_of_centre($current_tile->nw, $current_tile->sw);
$path_spec .= " L $x,$y";
$g->path(d => $path_spec, fill => 'transparent',
stroke => $this->colour, style => $this->style, class => $this->css_class
);
}
1;

1
tests/.gitignore vendored

@ -0,0 +1 @@
*.svg

@ -35,14 +35,5 @@ $grid->make_path_from('loop-id',
colour => 'red', css_class => 'path', style => { 'stroke-width' => 5 }
);
# say "@{[$grid->coords_of_centre(-2,0)]}";
# say "@{[$grid->coords_of_edge(-2,0,$HexGrid::DIR{nw})]}";
# say "@{[$grid->coords_of_edge(-2,0,$HexGrid::DIR{sw})]}";
# say "@{[$grid->coords_of_edge(-2,0,$HexGrid::DIR{s})]}" ;
# say "@{[$grid->coords_of_edge(-2,0,$HexGrid::DIR{se})]}";
# say "@{[$grid->coords_of_edge(-2,0,$HexGrid::DIR{ne})]}";
# say "@{[$grid->coords_of_edge(-2,0,$HexGrid::DIR{n})]}" ;
# say Dumper($grid);
say $grid->render;

@ -1,329 +0,0 @@
<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
<svg height="1000" id="grid-root" preserveAspectRatio="xMidYMid" version="1.2" viewBox="-900 -519.615242270663 2000 1212.43556529821" width="1000" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<style>.pin-popup { visibility: hidden; }</style>
<defs />
<g id="">
<g class="" id="1_-2_tile" transform="translate(150, -259.807621135332)">
<polygon id="1_-2_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="1_-2_clip">
<use href="#1_-2_inner_hex" />
</clipPath>
</g>
<g class="" id="" transform="translate(-450, 86.6025403784439)">
<polygon id="1_2_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="1_2_clip">
<use href="#1_2_inner_hex" />
</clipPath>
</g>
<g class="" id="1_-3_tile" transform="translate(300, -346.410161513775)">
<polygon id="1_-3_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="1_-3_clip">
<use href="#1_-3_inner_hex" />
</clipPath>
</g>
<g class="" id="" transform="translate(-300, 0)">
<polygon id="1_1_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="1_1_clip">
<use href="#1_1_inner_hex" />
</clipPath>
</g>
<g class="" id="" transform="translate(-150, -86.6025403784439)">
<polygon id="1_0_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="1_0_clip">
<use href="#1_0_inner_hex" />
</clipPath>
</g>
<g class="" id="1_-1_tile" transform="translate(0, -173.205080756888)">
<polygon id="1_-1_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="1_-1_clip">
<use href="#1_-1_inner_hex" />
</clipPath>
</g>
<g class="" id="" transform="translate(-600, 173.205080756888)">
<polygon id="1_3_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="1_3_clip">
<use href="#1_3_inner_hex" />
</clipPath>
</g>
<g class="" id="0_-1_tile" transform="translate(150, -86.6025403784439)">
<polygon id="0_-1_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="0_-1_clip">
<use href="#0_-1_inner_hex" />
</clipPath>
</g>
<g class="" id="" transform="translate(-450, 259.807621135332)">
<polygon id="0_3_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="0_3_clip">
<use href="#0_3_inner_hex" />
</clipPath>
</g>
<g class="" id="" transform="translate(-150, 86.6025403784439)">
<polygon id="0_1_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="0_1_clip">
<use href="#0_1_inner_hex" />
</clipPath>
</g>
<g class="" id="" transform="translate(0, 0)">
<polygon id="0_0_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="0_0_clip">
<use href="#0_0_inner_hex" />
</clipPath>
</g>
<g class="" id="" transform="translate(-300, 173.205080756888)">
<polygon id="0_2_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="0_2_clip">
<use href="#0_2_inner_hex" />
</clipPath>
</g>
<g class="" id="0_-3_tile" transform="translate(450, -259.807621135332)">
<polygon id="0_-3_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="0_-3_clip">
<use href="#0_-3_inner_hex" />
</clipPath>
</g>
<g class="" id="0_-2_tile" transform="translate(300, -173.205080756888)">
<polygon id="0_-2_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="0_-2_clip">
<use href="#0_-2_inner_hex" />
</clipPath>
</g>
<g class="" id="-1_0_tile" transform="translate(150, 86.6025403784439)">
<polygon id="-1_0_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="-1_0_clip">
<use href="#-1_0_inner_hex" />
</clipPath>
</g>
<g class="" id="-1_1_tile" transform="translate(0, 173.205080756888)">
<polygon id="-1_1_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="-1_1_clip">
<use href="#-1_1_inner_hex" />
</clipPath>
</g>
<g class="" id="-1_-1_tile" transform="translate(300, 0)">
<polygon id="-1_-1_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="-1_-1_clip">
<use href="#-1_-1_inner_hex" />
</clipPath>
</g>
<g class="" id="-1_3_tile" transform="translate(-300, 346.410161513775)">
<polygon id="-1_3_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="-1_3_clip">
<use href="#-1_3_inner_hex" />
</clipPath>
</g>
<g class="" id="-1_-2_tile" transform="translate(450, -86.6025403784439)">
<polygon id="-1_-2_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="-1_-2_clip">
<use href="#-1_-2_inner_hex" />
</clipPath>
</g>
<g class="" id="-1_2_tile" transform="translate(-150, 259.807621135332)">
<polygon id="-1_2_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="-1_2_clip">
<use href="#-1_2_inner_hex" />
</clipPath>
</g>
<g class="" id="-1_-3_tile" transform="translate(600, -173.205080756888)">
<polygon id="-1_-3_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="-1_-3_clip">
<use href="#-1_-3_inner_hex" />
</clipPath>
</g>
<g class="" id="3_-2_tile" transform="translate(-150, -433.012701892219)">
<polygon id="3_-2_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="3_-2_clip">
<use href="#3_-2_inner_hex" />
</clipPath>
</g>
<g class="" id="3_-3_tile" transform="translate(0, -519.615242270663)">
<polygon id="3_-3_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="3_-3_clip">
<use href="#3_-3_inner_hex" />
</clipPath>
</g>
<g class="" id="" transform="translate(-750, -86.6025403784439)">
<polygon id="3_2_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="3_2_clip">
<use href="#3_2_inner_hex" />
</clipPath>
</g>
<g class="" id="" transform="translate(-450, -259.807621135332)">
<polygon id="3_0_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="3_0_clip">
<use href="#3_0_inner_hex" />
</clipPath>
</g>
<g class="" id="" transform="translate(-600, -173.205080756888)">
<polygon id="3_1_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="3_1_clip">
<use href="#3_1_inner_hex" />
</clipPath>
</g>
<g class="" id="" transform="translate(-900, 0)">
<polygon id="3_3_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="3_3_clip">
<use href="#3_3_inner_hex" />
</clipPath>
</g>
<g class="" id="3_-1_tile" transform="translate(-300, -346.410161513775)">
<polygon id="3_-1_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="3_-1_clip">
<use href="#3_-1_inner_hex" />
</clipPath>
</g>
<g class="" id="-2_-2_tile" transform="translate(600, 0)">
<polygon id="-2_-2_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="-2_-2_clip">
<use href="#-2_-2_inner_hex" />
</clipPath>
</g>
<g class="" id="-2_2_tile" transform="translate(0, 346.410161513775)">
<polygon id="-2_2_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="-2_2_clip">
<use href="#-2_2_inner_hex" />
</clipPath>
</g>
<g class="" id="-2_-3_tile" transform="translate(750, -86.6025403784439)">
<polygon id="-2_-3_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="-2_-3_clip">
<use href="#-2_-3_inner_hex" />
</clipPath>
</g>
<g class="" id="-2_1_tile" transform="translate(150, 259.807621135332)">
<polygon id="-2_1_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="-2_1_clip">
<use href="#-2_1_inner_hex" />
</clipPath>
</g>
<g class="" id="-2_0_tile" transform="translate(300, 173.205080756888)">
<polygon id="-2_0_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="-2_0_clip">
<use href="#-2_0_inner_hex" />
</clipPath>
</g>
<g class="" id="-2_-1_tile" transform="translate(450, 86.6025403784439)">
<polygon id="-2_-1_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="-2_-1_clip">
<use href="#-2_-1_inner_hex" />
</clipPath>
</g>
<g class="" id="-2_3_tile" transform="translate(-150, 433.012701892219)">
<polygon id="-2_3_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="-2_3_clip">
<use href="#-2_3_inner_hex" />
</clipPath>
</g>
<g class="" id="" transform="translate(-300, -173.205080756888)">
<polygon id="2_0_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="2_0_clip">
<use href="#2_0_inner_hex" />
</clipPath>
</g>
<g class="" id="" transform="translate(-450, -86.6025403784439)">
<polygon id="2_1_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="2_1_clip">
<use href="#2_1_inner_hex" />
</clipPath>
</g>
<g class="" id="2_-1_tile" transform="translate(-150, -259.807621135332)">
<polygon id="2_-1_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="2_-1_clip">
<use href="#2_-1_inner_hex" />
</clipPath>
</g>
<g class="" id="" transform="translate(-750, 86.6025403784439)">
<polygon id="2_3_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="2_3_clip">
<use href="#2_3_inner_hex" />
</clipPath>
</g>
<g class="" id="2_-2_tile" transform="translate(0, -346.410161513775)">
<polygon id="2_-2_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="2_-2_clip">
<use href="#2_-2_inner_hex" />
</clipPath>
</g>
<g class="" id="" transform="translate(-600, 0)">
<polygon id="2_2_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="2_2_clip">
<use href="#2_2_inner_hex" />
</clipPath>
</g>
<g class="" id="2_-3_tile" transform="translate(150, -433.012701892219)">
<polygon id="2_-3_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="2_-3_clip">
<use href="#2_-3_inner_hex" />
</clipPath>
</g>
<g class="" id="-3_0_tile" transform="translate(450, 259.807621135332)">
<polygon id="-3_0_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="-3_0_clip">
<use href="#-3_0_inner_hex" />
</clipPath>
</g>
<g class="" id="-3_1_tile" transform="translate(300, 346.410161513775)">
<polygon id="-3_1_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="-3_1_clip">
<use href="#-3_1_inner_hex" />
</clipPath>
</g>
<g class="" id="-3_3_tile" transform="translate(0, 519.615242270663)">
<polygon id="-3_3_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="-3_3_clip">
<use href="#-3_3_inner_hex" />
</clipPath>
</g>
<g class="" id="-3_-1_tile" transform="translate(600, 173.205080756888)">
<polygon id="-3_-1_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="-3_-1_clip">
<use href="#-3_-1_inner_hex" />
</clipPath>
</g>
<g class="" id="-3_-2_tile" transform="translate(750, 86.6025403784439)">
<polygon id="-3_-2_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="-3_-2_clip">
<use href="#-3_-2_inner_hex" />
</clipPath>
</g>
<g class="" id="-3_-3_tile" transform="translate(900, 0)">
<polygon id="-3_-3_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="-3_-3_clip">
<use href="#-3_-3_inner_hex" />
</clipPath>
</g>
<g class="" id="-3_2_tile" transform="translate(150, 433.012701892219)">
<polygon id="-3_2_inner_hex" points="0,86.6025403784439 50,0 150,0 200,86.6025403784439 150,173.205080756888 50,173.205080756888" style="stroke: white; stroke-width: 1" />
<clipPath id="-3_2_clip">
<use href="#-3_2_inner_hex" />
</clipPath>
</g>
</g>
<g class="path" id="test-id">
<line class="path" stroke="lime" style="stroke-width: 5" x1="100" x2="25" y1="86.6025403784439" y2="43.3012701892219" />
<path class="path" d="M 25,43.3012701892219 Q -50,0 -125,43.3012701892219" stroke="lime" style="stroke-width: 5" />
<path class="path" d="M -125,43.3012701892219 Q -200,86.6025403784439 -200,0" stroke="lime" style="stroke-width: 5" />
<path class="path" d="M -200,0 Q -200,-86.6025403784439 -125,-129.903810567666" stroke="lime" style="stroke-width: 5" />
<path class="path" d="M -125,-129.903810567666 Q -50,-173.205080756888 25,-216.50635094611" stroke="lime" style="stroke-width: 5" />
<path class="path" d="M 25,-216.50635094611 Q 100,-259.807621135332 175,-216.50635094611" stroke="lime" style="stroke-width: 5" />
<path class="path" d="M 175,-216.50635094611 Q 250,-173.205080756888 175,-129.903810567666" stroke="lime" style="stroke-width: 5" />
<path class="path" d="M 175,-129.903810567666 Q 100,-86.6025403784439 25,-129.903810567666" stroke="lime" style="stroke-width: 5" />
<path class="path" d="M 25,-129.903810567666 Q -50,-173.205080756888 -125,-216.50635094611" stroke="lime" style="stroke-width: 5" />
<line class="path" stroke="lime" style="stroke-width: 5" x1="-125" x2="-200" y1="-216.50635094611" y2="-259.807621135332" />
</g>
<g class="path" id="point-id">
<circle class="path" cx="100" cy="259.807621135332" fill="cyan" r="5" style="stroke-width: 5" />
</g>
<g class="path" id="loop-id">
<line class="path" stroke="red" style="stroke-width: 5" x1="400" x2="325" y1="259.807621135332" y2="216.50635094611" />
<path class="path" d="M 325,216.50635094611 Q 250,173.205080756888 325,129.903810567666" stroke="red" style="stroke-width: 5" />
<path class="path" d="M 325,129.903810567666 Q 400,86.6025403784439 475,129.903810567666" stroke="red" style="stroke-width: 5" />
<path class="path" d="M 475,129.903810567666 Q 550,173.205080756888 475,216.50635094611" stroke="red" style="stroke-width: 5" />
<line class="path" stroke="red" style="stroke-width: 5" x1="475" x2="400" y1="216.50635094611" y2="259.807621135332" />
</g>
<!--
Generated using the Perl SVG Module V2.87
by Ronan Oger
-->
</svg>

Before

Width:  |  Height:  |  Size: 18 KiB

Loading…
Cancel
Save