Combine bezier curves with points to fill in color

Question

I am a super beginner with no coding experience learning Haskell...so here goes and this question probably doesn't make that much sense but I'll try...

I'm trying to fill in a diagram with color. The diagram consists of points forming a line, and a few bezier curves in between those lines. I have the outline of the diagram, but can't get a fill in color because they are points. I can fill in the color when it's just points forming a line, with strokeLoop, but I can't get it to go from the first point (with points forming a line) with intermediate bezier curves, to fill in color in the right place. Here is my code, and I know it's probably really bad and everything but I'm just trying this out.

illustrateBézier c1 c2 x2 = fromSegments [bézier3 c1 c2 x2]

x2 = r2 ((-1.29328),-0.96997)
[c1,c2] = map r2 [(0,0), ((-0.8083),(-0.32332))]

-- x2 = r2 ((-202.69570000000002),(-589.7937700000001))
-- [c1,c2] = map r2 [((-201.4019),(-588.8238000000001)), ((-202.21020000000001),(-589.1471200000001))]

az2 = illustrateBézier c1 c2 x2 

illustrateBézier1 c3 c4 x3 = fromSegments [bézier3 c3 c4 x3]

x3 = r2 ((-2.1016),(-3.39488))
[c3,c4] = map r2 [((-0.485),(-0.64664)), ((-2.1016),(-3.39488))]

az3 = illustrateBézier1 c3 c4 x3

az1 = fromOffsets . map r2 $[(-0.32332,85.35713), (1.6166,0.96996), (3.07157,0.16166), (1.45494,-1.13162), (2.58658,0.0), (0.16167,2.9099), (6.95143,6.78977), (0.48499,2.58658), (3.39488,-1.93994), (0.64665,-0.16166), (0.32332,-3.07156), (1.45494,-1.61661), (1.13164,-0.16166), (1.93993,-1.45496), (3.07156,2.1016), (0.64665,2.90991), (1.93993,1.13162), (1.13163,2.42492), (3.87988,1.77827), (3.39488,5.98147), (2.74823,3.87986), (2.26326,2.74825), (1.45496,3.7182), (5.01149,1.77828), (5.17317,2.10159), (0.96996,4.36486), (0.48498,3.07156), (-0.96996,3.39489), (-1.77828,2.26325), (-1.61661,-0.8083), (-1.45495,-3.07157), (-2.74824,-1.45494), (-1.77827,-1.13164), (-0.80831,0.80831), (1.45495,2.74825), (0.16166,3.7182), (-1.13163,0.48498), (-1.93993,-1.93993), (-2.10159,-1.29329), (0.48498,1.61661), (1.29328,1.77828), (-0.8083,0.8083)]

az4 = fromOffsets . map r2 $[(-0.96997,-2.26326)]


illustrateBézier2 c5 c6 x4 = fromSegments [bézier3 c5 c6 x4]

x4 = r2 ((-0.96997),0.96996)
[c5,c6] = map r2 [(0,0), ((-0.32332), 1.29329)]

az5 = illustrateBézier2 c5 c6 x4

illustrateBézier3 c7 c8 x5 = fromSegments [bézier3 c7 c8 x5]

x5 = r2 ((-1.29329),(-1.45494))
[c7,c8] = map r2 [((-0.64665),(-0.32332)), ((-1.29329),(-1.45494))]

az6 = illustrateBézier3 c7 c8 x5


az7 = fromOffsets . map r2 $[ (1.77827,-1.93994), (-1.45495,-1.45495), (0.0,-5.0115), (-0.8083,0.0), (-0.8083,3.39488), (-1.13164,0.485), (-0.96996,-3.71822), (-0.64665,-3.71821), (-0.80831,-0.48498), (0.32333,5.65815), (0.0,1.13162), (-1.45496,-1.29328), (-3.55654,-5.98147), (-2.1016,-0.48498), (-0.64664,-3.71821), (-1.61661,-2.9099), (-1.61662,-1.13164), (0.0,-2.26325), (2.1016,-1.29329), (-0.48498,-0.32332), (-2.58658,0.64664), (-3.39489,-2.42491), (-2.58658,-2.90991), (-4.84983,-2.58658), (-4.04154,-2.58658), (1.2933,-3.23322), (0.0,-1.61661), (-1.77828,1.61661), (-2.9099,1.13163), (-3.71821,-1.13163), (-5.65815,-2.42491), (-5.49647,0.0), (-0.64664,0.48498), (-6.46645,-3.87988), (-2.1016,-0.32332), (-2.74824,-5.8198), (-3.55655,0.32332), (-3.55655,1.45495), (0.48499,4.52652), (1.13162,-2.9099), (0.96998,0.32332), (-1.45496,4.36485), (3.23322,-2.74824), (0.64665,1.61661), (-3.87987,4.36485), (-1.29329,-0.32332), (-0.48498,-1.93994), (-1.29329,-0.8083), (-1.29329,1.13163), (-2.74824,-1.77827), (-3.07157,2.1016), (-1.77826,2.10159), (-3.39489,2.1016), (-4.68818,-0.16167), (-0.48498,-2.10159), (3.7182,-0.64665), (0.0,-1.29328), (-2.26326,-0.64666), (0.96998,-2.42491), (2.26325,-3.87987), (0.0,-1.77827), (0.16166,-0.80831), (4.36486,-2.26326), (0.96996,1.29329), (2.74825,0.0), (-1.29329,-2.58657), (-3.71822,-0.32333), (-5.01149,2.74824), (-2.42492,3.39488), (-1.77827,2.58659), (-1.13163,2.26326), (-4.20319,1.45494), (-3.07157,2.58658), (-0.323321,1.61662), (2.263257,0.96997), (0.808313,2.10158), (-2.748249,3.23323), (-6.466439,4.2032), (-7.759747,4.20319), (-2.101597,1.13162), (-5.334818,1.13164), (-5.334826,2.26325), (1.778275,1.29329), (-1.454954,1.45495), (-0.484982,1.13163), (-2.748238,-0.96997), (-3.23322,0.16166), (-0.808312,2.26326), (-0.969963,0.0), (0.323321,-2.42492), (-3.556551,1.2933), (-2.909899,0.96996), (-3.394886,-1.29329), (-2.909901,1.93993), (-3.233224,0.0), (-2.101597,1.2933), (-1.616612,0.8083), (-2.101595,-0.32332), (-2.58658,-1.13163), (-2.263257,0.64665), (-0.969967,0.96996), (-1.616613,-1.13162), (0.0,-1.93994), (3.071564,-1.29329), (6.304787,0.64665), (4.364853,-1.61662), (2.101596,-2.10159), (2.909902,-0.64665), (1.778273,-0.80831), (2.748241,0.16166), (1.616612,1.2933), (0.969963,-0.32332), (2.263257,-2.74824), (3.07157,-0.96998), (3.39488,-0.64664), (1.293294,-0.32332), (0.646642,0.48498), (0.808312,0.0), (1.293284,-3.71821), (4.041533,-1.45494), (1.939936,-3.71821), (2.263259,-4.52652), (1.616615,-1.45495), (0.323321,-2.58658), (-1.616615,1.29329), (-3.394893,0.64665), (-0.646642,-2.42492), (-1.293284,-0.32332), (-0.969973,0.96996), (-0.16166,2.90991), (-1.454955,-0.16167), (-1.454944,-5.8198), (-1.293294,1.29328), (-1.131624,-0.48498), (-0.32332,-1.93993), (-4.041533,0.16166), (-2.101596,1.13163), (-2.586578,-0.32332), (1.454944,-1.45495), (0.484981,-2.58658), (-0.646641,-1.93994), (1.454954,-0.96996), (1.293284,-0.16166), (-0.646642,-1.77828), (0.0,-4.36485), (-0.969963,-0.96997), (-0.808312,1.45495), (-6.143123,0.0), (-1.454951,-1.29329), (-0.646645,-3.87986), (-2.101596,-3.55656), (0.0,-0.96996), (2.101596,-0.80831), (0.161661,-2.1016), (1.131628,-1.13162), (-0.808305,-0.48498), (-1.29329,0.48498), (-1.131628,-2.74824), (0.969967,-5.01151), (4.526514,-3.23321), (2.586575,-1.61662), (1.939936,-3.7182), (2.748249,-1.2933), (2.586578,1.13164), (0.323321,2.42492), (2.424917,-0.32334), (3.23322,-2.42491), (1.616615,0.64665), (0.969962,0.64664), (1.616615,0.0), (2.263259,-1.29329), (0.808313,-4.36486)]

illustrateBézier4 c9 c10 x6 = fromSegments [bézier3 c9 c10 x6]

x6 = r2 (0.969963,(-3.39488))
[c9,c10] = map r2 [(0,0), (0.323321,(-2.90989))]

az8 = illustrateBézier4 c9 c10 x6


illustrateBézier5 c11 c12 x7 = fromSegments [bézier3 c11 c12 x7]

x7 = r2 (0.969963,(-0.96996))
[c11,c12] = map r2 [(0.646642,(-0.48498)), (0.969963,(-0.96996))]

az9 = illustrateBézier5 c11 c12 x7
-- c 0,0 0.323321,-2.90989 0.969963,-3.39488 0.646642,-0.48498 0.969963,-0.96996 0.969963,-0.96996 

-- 
-- 
az10 = fromOffsets . map r2 $[ (-1.131623,-1.93994), (-2.58658,0.80831), (-3.23323,0.8083), (-1.939936,-0.48498), (-3.556541,-1.77828), (-5.011495,-0.16166), (-3.556551,-3.7182), (0.484981,-3.87987), (0.646652,-2.42492), (-2.101596,-1.77827), (-1.939938,-3.71822), (0.484983,-0.8083), (6.789771,-0.48498), (2.101596,0.0), (0.969963,0.96996), (0.646652,0.0), (-0.16166,-1.61661), (3.879862,-0.64664), (2.586577,0.32332), (1.454955,1.13163), (-1.454955,2.1016), (-0.484981,1.45494), (2.748249,1.61662), (5.011497,1.77827), (1.778276,-0.96996), (-2.263257,-4.36485), (-0.969974,-3.23323), (0.969974,-0.80831), (-3.394891,-1.93993), (-0.484983,-1.13164), (0.484983,-1.6166), (-0.808304,-3.87987), (-2.909909,-4.68818), (-2.424918,-4.20319), (2.909909,-1.93994), (3.233222,0.0), (1.778276,0.64665), (4.203192,-0.16166), (3.718205,-3.55654), (1.131633,-3.07157), (3.718212,-2.42492), (1.616604,0.96997), (2.748239,-0.64665), (3.718209,-2.1016), (1.13164,-0.16166), (0.96996,0.80832), (4.52651,-0.16167), (2.74824,-3.07156), (1.13163,0.0), (3.55655,2.42491), (1.93993,2.1016), (-0.48498,1.13163), (0.64664,1.13163), (1.61662,-1.61661), (3.87987,0.32332), (0.32332,3.7182), (1.93994,1.45496), (7.11309,0.64664), (6.30479,4.20319), (1.45494,-0.96996), (5.17317,2.58658), (2.10159,-0.64664), (1.93994,-0.80832), (4.84983,1.93994), (4.36486,2.9099)]

example3 = mconcat
           [az1 #scaleY (-1)  #lc black #fc blue #lw 0.5 #translate (158.0767 & (-453.67502)) 
           ,az2 #scaleY (-1) #lc red #fc blue #lw 0.5 #translate (201.4019 & (-588.8238000000001)) 
           ,az3 #scaleY (-1) #lc blue #fc blue #lw 0.5 #translate (200.10862 & (-587.8538300000001)) 
           ,az4 #scaleY (-1) #lc green #fc blue #lw 0.5 #translate (198.00702 & (-584.4589500000002)) 
           ,az5 #scaleY (-1) #lc red #fc blue #lw 0.5 #translate (197.03705000000002 & (-582.1956900000002)) 
           ,az6 #scaleY (-1) #lc blue #fc blue #lw 0.5 #translate (196.06708000000003 & (-583.1656500000003)) 
           ,az7 #scaleY (-1) #lc green #fc blue #lw 0.5 #translate (194.77379000000002 & (-581.7107100000003)) 
           ,az8 #scaleY (-1) #lc green #fc blue #lw 0.5 #translate (79.50934400000003 & (-491.6654000000003)) 
           ,az9 #scaleY (-1) #lc green #fc blue #lw 0.5 #translate (80.47930700000003 & (-488.2705200000003)) 
           ,az10 #scaleY (-1) #lc green #fc blue #lw 0.5 #translate (81.44927000000004 & (-487.3005600000003)) 
           ]

Answer 1

Actually, as the az1..az10 are just curves, you can't fill them, so you can delete the fc blue in the function example3, they do nothing. You can also map scaleY (-1) and lw 0.5, as they are common to every diagrams in the list, like that:

example3 = mconcat $ map (scale (-1) . lw 0.5)
       [ az1 # lc black # translate (r2 (158.0767, -453.67502)) 
       , az2 # lc red # translate (r2 (201.4019, -588.8238000000001)) 
       , az3 # lc blue # translate (r2 (200.10862, -587.8538300000001)) 
       , az4 # lc green # translate (r2 (198.00702, -584.4589500000002)) 
       , az5 # lc red # translate (r2 (197.03705000000002, -582.1956900000002)) 
       , az6 # lc blue # translate (r2 (196.06708000000003, -583.1656500000003)) 
       , az7 # lc green # translate (r2 (194.77379000000002, -581.7107100000003)) 
       , az8 # lc green # translate (r2 (79.50934400000003, -491.6654000000003)) 
       , az9 # lc green # translate (r2 (80.47930700000003, -488.2705200000003)) 
       , az10 # lc green # translate (r2 (81.44927000000004, -487.3005600000003)) 
       ]

The illustrateBézier functions are redundants, you can create az2, az3, az5, az6, az8 and az9 in the form:

az2 = fromSegments [bézier3 c1 c2 x2]
    where x2 = r2 (-1.29328, -0.96997)
          [c1, c2] = map r2 [(0,0), (-0.8083, -0.32332)]

-- Or if you want, a resuable function:
-- illustrateBézier :: R2 -> R2 -> R2 -> Diagram SVG R2
illustrateBézier ctrlpt1 ctrlpt2 endpt = fromSegments [bézier3 ctrlpt1 ctrlpt2 endpt]

-- So we can code az3 and others like this:
az3 = illustrateBézier c3 c4 x3
    where x3 = r2 (-2.1016, -3.39488)
          [c3, c4] = map r2 [(-0.485, -0.64664), (-2.1016, -3.39488)]
-- Even shorter:
az3 = illustrateBézier c3 c4 x3
    where [c3,c4,x3] = map r2 [(-0.485, -0.64664), (-2.1016, -3.39488), (-2.1016, -3.39488)]

When the diagram will be a kind of 'loop' and fillable, you can use fc blue on example3 like this example3 # fc blue or into like this example3 = fc blue . mconcat $ ...