drafts

I think the circCoords is a bit overkill
its creating an circular x, y coordinate while looping over the width and height of the page. You are drawing a lot of ovals

radius = 100
translate(width() *.5, height() *.5)

inSteps = 1
# inSteps = 15

for angle in range(0, 360, inSteps):
    factor = angle / 360 * 2
    if factor > 1:
        factor = 2 - factor    
    
    x = cos(radians(angle)) * radius
    y = sin(radians(angle)) * radius
    
    fill(factor, 0, 1)
    oval(x - 5, y - 5, 10, 10)

indeed, letters are collected into glyph runs with the same drawing attributes, so if you change a thing (like fill color) then you will get a box for each letter.

good luck!

I don't know what you are trying to do but textBoxCharacterBounds is really handy to retrieve typesetted information.

help(textBoxCharacterBounds)


t = FormattedString()
t.fontSize(50)
t += "hello"

t.font("Times")
t.fill(1, 1, 0)
t += " world"
t.font("Times-Bold")
t.fill(1, 0, 0)
t += " fooj"

textBox(t, (0, 0, 400, 400))

textRects = textBoxCharacterBounds(t, (0, 400, 400, 400))


for textRect in textRects:
    x, y, w, h = textRect.bounds
    
    fill(random(), random(), random(), .3)    
    rect(x, y - textRect.baselineOffset, w, h)
    
    text(textRect.formattedSubString, (x, y))

moving this into a github issue

follow up here: https://github.com/typemytype/drawbot/issues/417

this would be handy

how to add it:

Create a custom NSLayoutManager for the code editor and overwrite drawGlyphsForGlyphRange_atPoint_ and draw something like a rainbow or dots or ...

also see https://github.com/coteditor/CotEditor/blob/89afb53f207309bfee2b1070ada3f258e1e0d6ef/CotEditor/Sources/LayoutManager.swift#L312

@pi said in Is it possible do this processing.gif in drawbot?:

@frederik: Why is it 0.38?

the handle of the off curve is 38% of the distance between the oncurve points, that seems to be generating nice curves

an other solution!

# amount of corners, 6 will create a hexagon
corners = 6
# the radius of the circle
radius = 100
# amount of frames
frames = 24
# calculate the step in radians of each corner
angleStep = pi * 2 / corners
# calculate the distance between each point on the circle
# based on the cos, sin of the angle the opposite 'c' can be
# calculated with pythagoras 
distance = sqrt((radius - cos(angleStep) * radius) ** 2 + (sin(angleStep) * radius) ** 2)
# calculate the offcurve handle length
offCurveLength = distance * 0.38
# the extremes of factors we would like to use
minFactor = .3
maxFactor = 2 
# start the loop
for i in range(frames):
    # calculate a factor and normalize so it goes from 0 -> 1 -> 0
    # to create a loop
    factor = i / (frames) * 2
    if factor > 1:
        factor = 2 - factor
    # interpolate the factor with our min max settings
    factor = minFactor + (maxFactor - minFactor) * factor
    # create a new page
    newPage(radius * 4, radius * 4)
    # draw a white background (gifs dont have an alpha value)
    with savedState():
        fill(1)
        rect(0, 0, width(), height())
    # translate to the middle
    translate(width() / 2, height() / 2)
    # create a pen
    pen = BezierPath()
    # use the pen as a point pen
    # so we can just add point instead of segments
    pen.beginPath()
    # start a loop over all corners
    for i in range(corners):
        # get the angle of each corner
        angle = angleStep * i    
        # get the x, y position based on the angle and radius    
        x = cos(angle) * radius
        y = sin(angle) * radius            
        # get the off curces based on the hooked angle (+90°) 
        # and multiply by the factor         
        offx1 = (x + cos(angle + pi / 2) * offCurveLength) * factor
        offy1 = (y + sin(angle + pi / 2) * offCurveLength) * factor
            
        offx2 = (x - cos(angle + pi / 2) * offCurveLength) * factor
        offy2 = (y - sin(angle + pi / 2) * offCurveLength) * factor
        # add the point to the point pen path
        pen.addPoint((offx2, offy2))
        pen.addPoint((x, y), segmentType="curve")
        pen.addPoint((offx1, offy1))        
    # tell the path the drawing is done
    pen.endPath()
    # draw the path
    stroke(1, 0, 1, 1)
    strokeWidth(10)
    fill(None)
    drawPath(pen)
# save the gif
saveImage("circleHex.gif")

cool !

cool, thanks for sharing!

the resulting animated gif