Python Tkinter save canvas as image using PIL
Question: I have this code which lets the user draw on the canvas and save it as a
`jpeg` file.

As mentioned in [this post](http://stackoverflow.com/questions/9886274/how-
can-i-convert-canvas-content-to-an-image), I tried to draw in parallel on the
canvas and in memory using the PIL so that I can save it as a `jpeg` instead
of `postscript`. It seemed to be working until I found out that some of the
images I saved with PIL are not the same as what was drawn on the canvas.

I assume `canvas.create_line` and `draw.line` from the PIL image draw module
function similarly and should give similar output.

Below is what went wrong:

For example, when I draw a "T" it seems alright (Left is my drawing, right is
the saved image).

![enter image description here](http://i.stack.imgur.com/iutdf.jpg)![enter
image description here](http://i.stack.imgur.com/d43X5.jpg)

But when I draw an "A" , the output image seems a bit weird.

![enter image description here](http://i.stack.imgur.com/S881u.jpg)![enter
image description here](http://i.stack.imgur.com/k14nH.jpg)

This is my current code:

    
    
    import Tkinter as tk
    import Image,ImageDraw
    
    class ImageGenerator:
        def __init__(self,parent,posx,posy,*kwargs):
            self.parent = parent
            self.posx = posx
            self.posy = posy
            self.sizex = 200
            self.sizey = 200
            self.b1 = "up"
            self.xold = None
            self.yold = None 
            self.coords= []
            self.drawing_area=tk.Canvas(self.parent,width=self.sizex,height=self.sizey)
            self.drawing_area.place(x=self.posx,y=self.posy)
            self.drawing_area.bind("<Motion>", self.motion)
            self.drawing_area.bind("<ButtonPress-1>", self.b1down)
            self.drawing_area.bind("<ButtonRelease-1>", self.b1up)
            self.button=tk.Button(self.parent,text="Done!",width=10,bg='white',command=self.save)
            self.button.place(x=self.sizex/7,y=self.sizey+20)
            self.button1=tk.Button(self.parent,text="Clear!",width=10,bg='white',command=self.clear)
            self.button1.place(x=(self.sizex/7)+80,y=self.sizey+20)
    
            self.image=Image.new("RGB",(200,200),(255,255,255))
            self.draw=ImageDraw.Draw(self.image)
    
        def save(self):
            print self.coords
            self.draw.line(self.coords,(0,128,0),width=3)
            filename = "temp.jpg"
            self.image.save(filename)
    
        def clear(self):
            self.drawing_area.delete("all")
            self.coords=[]
    
        def b1down(self,event):
            self.b1 = "down"
    
        def b1up(self,event):
            self.b1 = "up"
            self.xold = None
            self.yold = None
    
        def motion(self,event):
            if self.b1 == "down":
                if self.xold is not None and self.yold is not None:
                    event.widget.create_line(self.xold,self.yold,event.x,event.y,smooth='true',width=3,fill='blue')
                    self.coords.append((self.xold,self.yold))
    
            self.xold = event.x
            self.yold = event.y
    
    if __name__ == "__main__":
        root=tk.Tk()
        root.wm_geometry("%dx%d+%d+%d" % (400, 400, 10, 10))
        root.config(bg='white')
        ImageGenerator(root,10,10)
        root.mainloop()
    

Where did I go wrong and what should I do to save the exact same picture that
is drawn on the canvas as a jpeg image?


Answer: I managed to solved my problem.In fact i was just being dumb. Even though
`canvas.create_line` and `draw.line` have the similar function, i didn't use
the same exact data to draw out both images. after making changes, this is my
working code.

    
    
    import Tkinter as tk
    import Image,ImageDraw
    
    class ImageGenerator:
        def __init__(self,parent,posx,posy,*kwargs):
            self.parent = parent
            self.posx = posx
            self.posy = posy
            self.sizex = 200
            self.sizey = 200
            self.b1 = "up"
            self.xold = None
            self.yold = None 
            self.drawing_area=tk.Canvas(self.parent,width=self.sizex,height=self.sizey)
            self.drawing_area.place(x=self.posx,y=self.posy)
            self.drawing_area.bind("<Motion>", self.motion)
            self.drawing_area.bind("<ButtonPress-1>", self.b1down)
            self.drawing_area.bind("<ButtonRelease-1>", self.b1up)
            self.button=tk.Button(self.parent,text="Done!",width=10,bg='white',command=self.save)
            self.button.place(x=self.sizex/7,y=self.sizey+20)
            self.button1=tk.Button(self.parent,text="Clear!",width=10,bg='white',command=self.clear)
            self.button1.place(x=(self.sizex/7)+80,y=self.sizey+20)
    
            self.image=Image.new("RGB",(200,200),(255,255,255))
            self.draw=ImageDraw.Draw(self.image)
    
        def save(self):
            filename = "temp.jpg"
            self.image.save(filename)
    
        def clear(self):
            self.drawing_area.delete("all")
            self.image=Image.new("RGB",(200,200),(255,255,255))
            self.draw=ImageDraw.Draw(self.image)
    
        def b1down(self,event):
            self.b1 = "down"
    
        def b1up(self,event):
            self.b1 = "up"
            self.xold = None
            self.yold = None
    
        def motion(self,event):
            if self.b1 == "down":
                if self.xold is not None and self.yold is not None:
                    event.widget.create_line(self.xold,self.yold,event.x,event.y,smooth='true',width=3,fill='blue')
                    self.draw.line(((self.xold,self.yold),(event.x,event.y)),(0,128,0),width=3)
    
            self.xold = event.x
            self.yold = event.y
    
    if __name__ == "__main__":
        root=tk.Tk()
        root.wm_geometry("%dx%d+%d+%d" % (400, 400, 10, 10))
        root.config(bg='white')
        ImageGenerator(root,10,10)
        root.mainloop()
    

