hi @ThunderNixon,

placing images is a job for image(); imageObject() is for creating or modifying raster images inside DrawBot.

to draw an image at a given size:

1. get the width and height of the image
2. define the intended width and height
3. calculate the X and Y scaling factors
4. apply the scaling factors & draw the image

in code:

imgPath = 'someFolder/myImage.png'

# 1
srcWidth, srcHeight = imageSize(imgPath)

# 2
dstWidth, dstHeight = 500, 800

# 3
factorWidth  = dstWidth  / srcWidth
factorHeight = dstHeight / srcHeight

# 4
with savedState():
    scale(factorWidth, factorHeight)
    image(imgPath, (0, 0))

cheers!

the bump distortion filter might be useful for sketching and experimenting:

size(400, 400)

steps = 9
gridX = width()  / steps
gridY = height() / steps

im = ImageObject()
black = False
with im:
    for x in range(steps):
        for y in range(steps):
            if black:
                fill(0,)
                rect(x * gridX, y * gridY, gridX, gridY)
            black = not black
        if not steps % 2:
            black = not black

im.bumpDistortion(center=(width()/2, height()/2), radius=200, scale=0.8)
image(im, im.offset())

saveImage('bumpDistortion.png')

hello @ChrisSwift,

I think the error message is correct: there really isn’t any image at this URL. if you paste it in a browser, you will be redirected to another domain where the image is hosted.

it works fine if you use the actual image URL:

image("https://s3.amazonaws.com/f.cl.ly/items/1T3x1y372J371p0v1F2Z/drawBot.jpg", (100, 100))

not sure if this is a DrawBot bug…

cheers!

@MauriceMeilleur thanks for the points. remove overlap also works as expected with a lineTo-only version of the shape:

pts = [(-125.0, 275.0), (-125.0, -100.0), (-125.0, -99.99999999999999), (-125.0, -113.80711874576983), (-113.80711874576983, -124.99999999999999), (-100.0, -124.99999999999999), (125.0, -125.0), (125.0, 100.0), (125.0, 100.0), (125.0, 113.80711874576983), (113.80711874576983, 125.0), (100.0, 125.0), (-275.0, 125.0), (-275.0, 275.0), (100.0, 275.0), (99.99999999999999, 275.0), (196.64983122038882, 275.0), (275.0, 196.64983122038882), (275.0, 100.0), (275.0, -275.0), (-100.0, -275.0), (-100.00000000000003, -275.0), (-196.64983122038888, -275.0), (-275.0, -196.64983122038882), (-275.0, -99.99999999999997), (-275.0, 275.0), (-125.0, 275.0)]

B = BezierPath()
for i, pt in enumerate(pts):
    if i == 0:
        B.moveTo(pt)
    else:
        B.lineTo(pt)
B.closePath()

# (un)comment this line to test
# B.removeOverlap()

newPage(800, 800)
translate(400, 400)
fill(None)
stroke(1, 0, 0)
strokeWidth(8)
drawPath(B)

I don’t think the lack of curveTos plays a role in the result (but you never know).

let’s try it the other way around: can you provide a simple example in code of a shape where the whole path is erased when removing overlap? thanks!

hello @MauriceMeilleur,

I’ve created a simplified version of your shape for testing (see below). remove overlap works as expected, the inner shape is preserved:

B = BezierPath()
B.moveTo((10, 90))
B.lineTo((90, 90))
B.lineTo((90, 10))
B.lineTo((10, 10))
B.lineTo((10, 90))
B.lineTo((40, 90))
B.lineTo((40, 40))
B.lineTo((60, 40))
B.lineTo((60, 60))
B.lineTo((10, 60))
B.closePath()

newPage(100, 100)
frameDuration(3)
fill(None)
stroke(1, 0, 0)
drawPath(B)

B.removeOverlap()

newPage(100, 100)
frameDuration(3)
fill(None)
stroke(1, 0, 0)
drawPath(B)

# saveImage('removeOverlapTest.gif')

it would help if you could post your actual bezier points, so we can see if it’s a problem in the data.

ps. the color scheme is a nice reminder to add an illustration to the arcTo docs

can I ask you why suddenly everything is now in decimal numbers ?

think of it as percentages: the x/y point coordinates are defined in relation to the width/height dimensions of the shape, which are variable.

ps. width/height were used as scale factors – not the best implementation in hindsight, because it also scales the stroke width. this (below) is better, and maybe makes the percentages explanation clearer:

def myShape(x, y, w, h):
    save()
    translate(x, y)
    newPath()
    moveTo((0.0*w, 0.0*h))
    lineTo((1.0*w, 0.0*h))
    curveTo((0.7*w, 0.3*h), (0.7*w, 0.7*h), (1.0*w, 1.0*h))
    lineTo((0*w, 1.0*h))
    closePath()
    drawPath()
    restore()

cheers!

hello David,

rect(), oval(), etc are regular Python functions. you can create a new shape that behaves the same way by defining a new ‘shape drawing function’ that takes the same arguments (x, y, w, h).

here’s an example:

def myShape(x, y, w, h):
    save()
    translate(x, y)
    scale(w, h)
    newPath()
    moveTo((0., 0.0))
    lineTo((1.0, 0.0))
    curveTo((0.7, 0.3), (0.7, 0.7), (1.0, 1.0))
    lineTo((0, 1.0))
    closePath()
    drawPath()
    restore()

newPage(500, 500)

xMiddle = width()/2
yMiddle = height()/2

shapeWidth, shapeHeight = 354, 242

shapeX = xMiddle - shapeWidth/2
shapeY = yMiddle - shapeHeight/2

myShape(shapeX, shapeY, shapeWidth, shapeHeight)

notice that the (x,y) point positions are now defined as decimal numbers between 0.0 and 1.0, which are then scaled by the given width & height.

Voronoi is a lot of fun indeed. I gave scipy.spatial.Voronoi a try, and got it to work (sort of; some polygons are missing):

# based on http://stackoverflow.com/questions/27548363/from-voronoi-tessellation-to-shapely-polygons

from random import randrange
from scipy.spatial import Voronoi

size(600, 300)

pointsAmount = 160
points = [(randrange(width()), randrange(height())) for i in range(pointsAmount)]

V = Voronoi(points)
regions = [V.vertices[line] for line in V.regions if -1 not in line]

stroke(1)
strokeWidth(2)
for R in regions:
    pts = [(float(x), float(y)) for x, y in R]
    if len(pts):
        fill(random(), random(), 0.7, 0.7)
        polygon(*pts)

r = 1
stroke(None)
fill(0)
for x, y in points:
    oval(x-r, y-r, r*2, r*2)

saveImage('voronoi-drawbot-2.png')

and here is the bitmap version ported from PIL

happy voronoiing!

hello @bic,

the PIL example in your second post creates a Voronoi diagram as a raster image. in DrawBot, raster images can be created from scratch using ImageObject.

don’t forget that color coordinates in DrawBot are expressed as floats between 0.0 and 1.0, not as integers between 0 and 255 like in PIL. (so you’ll need to use random() instead of randrange(256) to generate the RGB color values)

it works give it a try!

hello @mrrouge,

you can draw an oval from center by subtracting the radius from the position:

x, y = 500, 500 # center position
r = 300 # radius
oval(x-r, y-r, r*2, r*2)

cheers!