How to show multiple Canvases at the same time in Tkinter?

The Canvas widget in Tkinter is a versatile widget used to create illustrations, draw shapes, arcs, images, and complex layouts. You can display multiple canvases simultaneously using different approaches like separate windows, frames, or grid layouts.

Method 1: Multiple Canvases in the Same Window

The simplest approach is to create multiple canvas widgets within the same main window ?

import tkinter as tk

# Create main window
root = tk.Tk()
root.title("Multiple Canvases")
root.geometry("600x400")

# Create first canvas
canvas1 = tk.Canvas(root, width=200, height=150, bg="lightblue")
canvas1.grid(row=0, column=0, padx=10, pady=10)
canvas1.create_text(100, 75, text="Canvas 1", font=("Arial", 14, "bold"))
canvas1.create_oval(50, 50, 150, 100, fill="yellow")

# Create second canvas
canvas2 = tk.Canvas(root, width=200, height=150, bg="lightgreen")
canvas2.grid(row=0, column=1, padx=10, pady=10)
canvas2.create_text(100, 75, text="Canvas 2", font=("Arial", 14, "bold"))
canvas2.create_rectangle(50, 50, 150, 100, fill="red")

# Create third canvas
canvas3 = tk.Canvas(root, width=200, height=150, bg="lightyellow")
canvas3.grid(row=1, column=0, padx=10, pady=10)
canvas3.create_text(100, 75, text="Canvas 3", font=("Arial", 14, "bold"))
canvas3.create_polygon(100, 30, 50, 120, 150, 120, fill="blue")

# Create fourth canvas
canvas4 = tk.Canvas(root, width=200, height=150, bg="lightcoral")
canvas4.grid(row=1, column=1, padx=10, pady=10)
canvas4.create_text(100, 75, text="Canvas 4", font=("Arial", 14, "bold"))
canvas4.create_arc(50, 50, 150, 100, start=0, extent=180, fill="purple")

root.mainloop()

Method 2: Using Toplevel Windows

You can create multiple canvases in separate windows using Toplevel widgets ?

import tkinter as tk

def create_canvas_window(title, bg_color, shape_type):
    # Create a new window
    new_window = tk.Toplevel(root)
    new_window.title(title)
    new_window.geometry("300x250")
    
    # Create canvas in the new window
    canvas = tk.Canvas(new_window, width=250, height=200, bg=bg_color)
    canvas.pack(padx=20, pady=20)
    
    # Draw different shapes based on type
    if shape_type == "circle":
        canvas.create_oval(75, 75, 175, 175, fill="orange", outline="black", width=2)
    elif shape_type == "square":
        canvas.create_rectangle(75, 75, 175, 175, fill="cyan", outline="black", width=2)
    elif shape_type == "triangle":
        canvas.create_polygon(125, 50, 75, 150, 175, 150, fill="magenta", outline="black", width=2)
    
    canvas.create_text(125, 25, text=title, font=("Arial", 12, "bold"))

# Create main window
root = tk.Tk()
root.title("Canvas Manager")
root.geometry("300x200")

# Create buttons to open different canvas windows
tk.Button(root, text="Open Circle Canvas", 
          command=lambda: create_canvas_window("Circle Canvas", "lightblue", "circle")).pack(pady=10)

tk.Button(root, text="Open Square Canvas", 
          command=lambda: create_canvas_window("Square Canvas", "lightgreen", "square")).pack(pady=10)

tk.Button(root, text="Open Triangle Canvas", 
          command=lambda: create_canvas_window("Triangle Canvas", "lightyellow", "triangle")).pack(pady=10)

root.mainloop()

Method 3: Using Frames for Organization

Organize multiple canvases using frames for better layout control ?

import tkinter as tk

root = tk.Tk()
root.title("Organized Multiple Canvases")
root.geometry("800x600")

# Create main frame
main_frame = tk.Frame(root, bg="white")
main_frame.pack(fill="both", expand=True, padx=10, pady=10)

# Left frame for two canvases
left_frame = tk.Frame(main_frame, bg="gray90")
left_frame.pack(side="left", fill="both", expand=True, padx=(0, 5))

# Right frame for two canvases
right_frame = tk.Frame(main_frame, bg="gray90")
right_frame.pack(side="right", fill="both", expand=True, padx=(5, 0))

# Canvas 1 - Drawing area
canvas1 = tk.Canvas(left_frame, width=300, height=200, bg="white", relief="sunken", bd=2)
canvas1.pack(pady=10)
tk.Label(left_frame, text="Drawing Canvas", font=("Arial", 12, "bold")).pack()
canvas1.create_line(0, 0, 300, 200, fill="red", width=2)
canvas1.create_line(300, 0, 0, 200, fill="blue", width=2)

# Canvas 2 - Chart area
canvas2 = tk.Canvas(left_frame, width=300, height=200, bg="white", relief="sunken", bd=2)
canvas2.pack(pady=10)
tk.Label(left_frame, text="Chart Canvas", font=("Arial", 12, "bold")).pack()
# Simple bar chart
for i in range(5):
    height = 50 + i * 20
    canvas2.create_rectangle(50 + i * 40, 200 - height, 80 + i * 40, 200, 
                           fill=f"#{i*50:02x}{100:02x}{200-i*30:02x}")

# Canvas 3 - Image placeholder
canvas3 = tk.Canvas(right_frame, width=300, height=200, bg="white", relief="sunken", bd=2)
canvas3.pack(pady=10)
tk.Label(right_frame, text="Image Canvas", font=("Arial", 12, "bold")).pack()
canvas3.create_oval(100, 50, 200, 150, fill="gold", outline="darkgoldenrod", width=3)
canvas3.create_text(150, 100, text="IMAGE", font=("Arial", 16, "bold"))

# Canvas 4 - Text area
canvas4 = tk.Canvas(right_frame, width=300, height=200, bg="white", relief="sunken", bd=2)
canvas4.pack(pady=10)
tk.Label(right_frame, text="Text Canvas", font=("Arial", 12, "bold")).pack()
canvas4.create_text(150, 100, text="Multiple\nCanvases\nDemo", 
                   font=("Arial", 18, "bold"), justify="center")

root.mainloop()

Comparison

Conclusion

Use multiple canvases in the same window for dashboards, Toplevel windows for independent tools, and frames for organized layouts. Choose based on your application's specific requirements and user experience goals.