How to draw a coordinate system on top of an image using tkinter?
Asked Answered
J

1

2

I want to show an image and draw a coordinate system(x-axe, y-axe) on top of it. I can show the image

img = ImageTk.PhotoImage(Image.open(path).resize((400,400),Image.ANTIALIAS))
panel = tk.Label(root,image = img, width = 400, height = 400s)
panel.pack(size= "bottom", fill = "both", expand = "yes")
panel.place(rely = 073, rely = 0.5s) 

I can also draw a line for the x-axe/y-axe(it would be even better if you know a way to draw a flash instead of a line)

canvas = Canvas(root)
canvas.create_line(x0,y0,x1,y1)
canvas.pack()

What I cannot do is place this line on top of the image. I tried using canvas.place(), but when I put it on top of the image I cannot see the image anymore. Is there a way to make the canvas transparent ? Or is there something else I can do ? I'm new to Tkinter.

Thanks.

EDIT: apparently it is not possible to make a canvas transparent Transparent canvas in tkinter python

But can I add a background image in the canvas and then draw the line, so that I can see both ?

Jerrylee answered 22/7, 2016 at 12:20 Comment(1)
There are some mistakes in your code.Blen
C
5

You have to place the image on the canvas and then put the axis lines on top of it:

import Tkinter as tk
from PIL import Image, ImageTk

root = tk.Tk()

img_path = 'water-drop-splash.png'
img = ImageTk.PhotoImage(Image.open(img_path).resize((400,400), Image.ANTIALIAS))

canvas = tk.Canvas(root, height=400, width=400)
canvas.create_image(200, 200, image=img)
canvas.create_line(0, 200, 399, 200, dash=(2,2))  # x-axis
canvas.create_line(200, 0, 200, 399, dash=(2,2))  # y-axis
canvas.pack()

root.mainloop()

Ta-da!

screenshot of tkinter window displaying image and axes

Ced answered 22/7, 2016 at 13:10 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.