danwizard208
/
wiki-map
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Compare commits

base: danwizard208:bc9e7d5477195db9d7124087544f604eb0431918
Branches Tags
danwizard208:main
..
compare: danwizard208:d99d7446ca9a2471cd561fd028de6c83c79079d6
Branches Tags
danwizard208:main

No commits in common. 'bc9e7d5477195db9d7124087544f604eb0431918' and 'd99d7446ca9a2471cd561fd028de6c83c79079d6' have entirely different histories.
bc9e7d5477 ... d99d7446ca

4 changed files with 354 additions and 15 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats
  1. 30
      HexGrid/Path.pm
  2. 1
      tests/.gitignore
  3. 9
      tests/paths.pl
  4. 329
      tests/paths.svg

30
HexGrid/Path.pm
Unescape View File

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

1
tests/.gitignore vendored
Unescape View File

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

9
tests/paths.pl
Unescape View File

@ -35,5 +35,14 @@ $grid->make_path_from('loop-id',
colour => 'red', css_class => 'path', style => { 'stroke-width' => 5 } 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; say $grid->render;

329
tests/paths.svg
Unescape View File

@ -0,0 +1,329 @@
<?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>
Side by Side

After

Width:  |  Height:  |  Size: 18 KiB

Write Preview
Loading…
Cancel
Save