lambdaspeech :: hilbert

1 | list | login |load

| |

_h1 hilbert | [[hilbert2]]

{center
 {svg 
  {@ width="330px" height="330px" 
    style="box-shadow:0 0 8px #888; background:#eee;
           border:1px solid grey;"}
 
 {def path_style {lambda {:col :d}
      fill="transparent" stroke=":col" stroke-width=":d"}}

{path {@ d="M {turtle 10 10 0 {left 10 1}}" 
               {path_style black 9}}}

{path {@ d="M {turtle 40 10 -90 {left 10 2}}" 
               {path_style red 7}}}

{path {@ d="M {turtle 10 10 0 {left 10 3}}" 
               {path_style green 5}}}

{path {@ d="M {turtle 160 10 -90 {left 10 4}}" 
               {path_style blue 3}}}

{path {@ d="M {turtle 10 10 0 {left 10 5}}"
               {path_style grey 1} id="spline"}}  
 
 {circle {@ cx="0" cy="0" r="5" 
            fill="rgba(255,255,0,0.5)" stroke="#f00"} 
  {animateMotion 
   {@ dur="100s" repeatCount="indefinite" rotate="auto"}
   {mpath {@ xlink:href="#spline"}}
  }
 }

}}

_p The [[Hilbert curve|https://en.m.wikipedia.org/wiki/Hilbert_curve]] is a continuous fractal space filling curve. Following [[logo.twentygototen.org|http://logo.twentygototen.org/dZ1f62XY]] we build the drawing algorithm on two recursive functions calling each other:

{pre
{b 1) defining two recursive functions calling each other:}
'{def left {lambda {:d :n}
 {if {< :n 1}
   then  // stop
   else T90      {right :d {- :n 1}}
        M:d T-90 {left  :d {- :n 1}}
        M:d      {left  :d {- :n 1}}
        T-90 M:d {right :d {- :n 1}}
        T90
}}}
-> {def left
 {lambda {:d :n}
  {if {< :n 1} then
   else T90      {right :d {- :n 1}}
        M:d T-90 {left  :d {- :n 1}}
        M:d      {left  :d {- :n 1}}
        T-90 M:d {right :d {- :n 1}}
        T90
}}}

'{def right {lambda {:d :n}
 {if {< :n 1}
   then  // stop
   else T-90    {left  :d {- :n 1}}
        M:d T90 {right :d {- :n 1}}
        M:d     {right :d {- :n 1}}
        T90 M:d {left  :d {- :n 1}}
        T-90
}}}
-> {def right
 {lambda {:d :n}
  {if {< :n 1} then
   else T-90    {left  :d {- :n 1}}
        M:d T90 {right :d {- :n 1}}
        M:d     {right :d {- :n 1}}
        T90 M:d {left  :d {- :n 1}}
        T-90
}}}

{b 2) defining the five first curves:}
'{turtle 10 10    0 {left 10 1}}  -> black curve
'{turtle 40 10  -90 {left 10 2}}  -> red curve
'{turtle 10 10    0 {left 10 3}}  -> green curve
'{turtle 160 10 -90 {left 10 4}}  -> blue curve
'{turtle 10 10    0 {left 10 5}}  -> grey curve

{b 3) drawing:}
'{svg 
 {@ width="330px" height="330px" 
    style="box-shadow:0 0 8px #888;"}
 {def path_style {lambda {:col :d}
      fill="transparent" stroke=":col" stroke-width=":d"}}

{path {@ d="M {turtle 10 10 0    {left 10 1}}" {path_style black 9}}}
 {path {@ d="M {turtle 40 10 -90  {left 10 2}}" {path_style red 7}}}
 {path {@ d="M {turtle 10 10 0    {left 10 3}}" {path_style green 5}}}
 {path {@ d="M {turtle 160 10 -90 {left 10 4}}" {path_style blue 3}}}
 {path {@ d="M {turtle 10 10 0    {left 10 5}}"  {path_style grey 1}
          id="spline" }}  
 {circle 
  {@ cx="0" cy="0" r="5" 
     fill="rgba(255,255,0,0.5)" stroke="#f00"} 
  {animateMotion 
   {@ dur="100s" repeatCount="indefinite" rotate="auto"}
   {mpath {@ xlink:href="#spline"}}
  }
 }
}

}

_p See also:
_ul [[hilbert2]] a javascript fast version
_ul [[http://bit-player.org/extras/hilbert/|http://bit-player.org/extras/hilbert/]]
_ul [[http://www.fundza.com/algorithmic/space_filling/hilbert/basics/|http://www.fundza.com/algorithmic/space_filling/hilbert/basics/]]
_ul [[http://www.datagenetics.com/blog/march22013/index.html|http://www.datagenetics.com/blog/march22013/index.html]]
_ul [[https://corte.si/posts/code/hilbert/portrait/index.html|https://corte.si/posts/code/hilbert/portrait/index.html]]
_ul [[http://blog.christianperone.com/2015/08/googles-s2-geometry-on-the-sphere-cells-and-hilbert-curve/|http://blog.christianperone.com/2015/08/googles-s2-geometry-on-the-sphere-cells-and-hilbert-curve/]]

{img {@ src="http://www.datagenetics.com/blog/march22013/c.png" width="100%"}}

{img {@ src="https://imgs.xkcd.com/comics/map_of_the_internet.jpg" width="100%" title="https://xkcd.com/195/"}}

{img {@ src="https://corte.si/posts/code/hilbert/portrait/hilbert3d-o3.png" width="100%"}}
{img {@ src="https://www.apprendre-a-dessiner.org/wp-content/uploads/2015/09/cerveau-droit.jpg" width="100%"}}

{div {@ style="font:italic 7.0em georgia; text-align:center; color:#888;"} '{left right}}