Tkinter 画布缩放 + 移动/平移

问题描述 投票:0回答:4

Tkinter 的画布小部件具有以下内置功能:

  • 使用

    canvas.scan_mark
    canvas.scan_dragto
    移动/平移画布(例如通过单击 + 拖动),请参阅 这个问题

  • 使用

    canvas.scale
    缩放画布上的矢量元素,但遗憾的是,这对于画布上的位图图像不起作用

幸运的是,

此方法允许缩放图像(通过手动重绘图像的缩放部分)。但是:

  1. 当我们重新绘制画布的特定部分时,移动/平移功能将不再起作用...

  2. 我们绝对需要渲染比当前显示的区域更多的区域,以允许移动/平移。假设画布上有 1000x1000 的位图,我们想要缩放 50 倍...如何避免内存中出现 50.000 x 50.000 像素的位图? (2.5 GB RAM 太大了)。我们可以考虑只渲染视口,或者比当前视口多一点以允许平移,但是一旦平移到达渲染区域的边缘该怎么办?

如何在 Tkinter 画布上拥有适用于图像的移动/平移 + 缩放功能?

python canvas tkinter tkinter-canvas
4个回答
65
投票
高级缩放示例。就像谷歌地图一样。

示例视频 (

longer video here):

它仅缩放一个图块,而不是整个图像。因此,缩放后的图块会占用恒定的内存,并且不会在大缩放时用巨大的调整大小的图像来填充它。对于简化的缩放示例

看这里

在 Windows 7 64 位和 Python 3.6.2 上测试。

不要忘记在脚本末尾放置图像的路径。

# -*- coding: utf-8 -*- # Advanced zoom example. Like in Google Maps. # It zooms only a tile, but not the whole image. So the zoomed tile occupies # constant memory and not crams it with a huge resized image for the large zooms. import random import tkinter as tk from tkinter import ttk from PIL import Image, ImageTk class AutoScrollbar(ttk.Scrollbar): ''' A scrollbar that hides itself if it's not needed. Works only if you use the grid geometry manager ''' def set(self, lo, hi): if float(lo) <= 0.0 and float(hi) >= 1.0: self.grid_remove() else: self.grid() ttk.Scrollbar.set(self, lo, hi) def pack(self, **kw): raise tk.TclError('Cannot use pack with this widget') def place(self, **kw): raise tk.TclError('Cannot use place with this widget') class Zoom_Advanced(ttk.Frame): ''' Advanced zoom of the image ''' def __init__(self, mainframe, path): ''' Initialize the main Frame ''' ttk.Frame.__init__(self, master=mainframe) self.master.title('Zoom with mouse wheel') # Vertical and horizontal scrollbars for canvas vbar = AutoScrollbar(self.master, orient='vertical') hbar = AutoScrollbar(self.master, orient='horizontal') vbar.grid(row=0, column=1, sticky='ns') hbar.grid(row=1, column=0, sticky='we') # Create canvas and put image on it self.canvas = tk.Canvas(self.master, highlightthickness=0, xscrollcommand=hbar.set, yscrollcommand=vbar.set) self.canvas.grid(row=0, column=0, sticky='nswe') self.canvas.update() # wait till canvas is created vbar.configure(command=self.scroll_y) # bind scrollbars to the canvas hbar.configure(command=self.scroll_x) # Make the canvas expandable self.master.rowconfigure(0, weight=1) self.master.columnconfigure(0, weight=1) # Bind events to the Canvas self.canvas.bind('<Configure>', self.show_image) # canvas is resized self.canvas.bind('<ButtonPress-1>', self.move_from) self.canvas.bind('<B1-Motion>', self.move_to) self.canvas.bind('<MouseWheel>', self.wheel) # with Windows and MacOS, but not Linux self.canvas.bind('<Button-5>', self.wheel) # only with Linux, wheel scroll down self.canvas.bind('<Button-4>', self.wheel) # only with Linux, wheel scroll up self.image = Image.open(path) # open image self.width, self.height = self.image.size self.imscale = 1.0 # scale for the canvaas image self.delta = 1.3 # zoom magnitude # Put image into container rectangle and use it to set proper coordinates to the image self.container = self.canvas.create_rectangle(0, 0, self.width, self.height, width=0) # Plot some optional random rectangles for the test purposes minsize, maxsize, number = 5, 20, 10 for n in range(number): x0 = random.randint(0, self.width - maxsize) y0 = random.randint(0, self.height - maxsize) x1 = x0 + random.randint(minsize, maxsize) y1 = y0 + random.randint(minsize, maxsize) color = ('red', 'orange', 'yellow', 'green', 'blue')[random.randint(0, 4)] self.canvas.create_rectangle(x0, y0, x1, y1, fill=color, activefill='black') self.show_image() def scroll_y(self, *args, **kwargs): ''' Scroll canvas vertically and redraw the image ''' self.canvas.yview(*args, **kwargs) # scroll vertically self.show_image() # redraw the image def scroll_x(self, *args, **kwargs): ''' Scroll canvas horizontally and redraw the image ''' self.canvas.xview(*args, **kwargs) # scroll horizontally self.show_image() # redraw the image def move_from(self, event): ''' Remember previous coordinates for scrolling with the mouse ''' self.canvas.scan_mark(event.x, event.y) def move_to(self, event): ''' Drag (move) canvas to the new position ''' self.canvas.scan_dragto(event.x, event.y, gain=1) self.show_image() # redraw the image def wheel(self, event): ''' Zoom with mouse wheel ''' x = self.canvas.canvasx(event.x) y = self.canvas.canvasy(event.y) bbox = self.canvas.bbox(self.container) # get image area if bbox[0] < x < bbox[2] and bbox[1] < y < bbox[3]: pass # Ok! Inside the image else: return # zoom only inside image area scale = 1.0 # Respond to Linux (event.num) or Windows (event.delta) wheel event if event.num == 5 or event.delta == -120: # scroll down i = min(self.width, self.height) if int(i * self.imscale) < 30: return # image is less than 30 pixels self.imscale /= self.delta scale /= self.delta if event.num == 4 or event.delta == 120: # scroll up i = min(self.canvas.winfo_width(), self.canvas.winfo_height()) if i < self.imscale: return # 1 pixel is bigger than the visible area self.imscale *= self.delta scale *= self.delta self.canvas.scale('all', x, y, scale, scale) # rescale all canvas objects self.show_image() def show_image(self, event=None): ''' Show image on the Canvas ''' bbox1 = self.canvas.bbox(self.container) # get image area # Remove 1 pixel shift at the sides of the bbox1 bbox1 = (bbox1[0] + 1, bbox1[1] + 1, bbox1[2] - 1, bbox1[3] - 1) bbox2 = (self.canvas.canvasx(0), # get visible area of the canvas self.canvas.canvasy(0), self.canvas.canvasx(self.canvas.winfo_width()), self.canvas.canvasy(self.canvas.winfo_height())) bbox = [min(bbox1[0], bbox2[0]), min(bbox1[1], bbox2[1]), # get scroll region box max(bbox1[2], bbox2[2]), max(bbox1[3], bbox2[3])] if bbox[0] == bbox2[0] and bbox[2] == bbox2[2]: # whole image in the visible area bbox[0] = bbox1[0] bbox[2] = bbox1[2] if bbox[1] == bbox2[1] and bbox[3] == bbox2[3]: # whole image in the visible area bbox[1] = bbox1[1] bbox[3] = bbox1[3] self.canvas.configure(scrollregion=bbox) # set scroll region x1 = max(bbox2[0] - bbox1[0], 0) # get coordinates (x1,y1,x2,y2) of the image tile y1 = max(bbox2[1] - bbox1[1], 0) x2 = min(bbox2[2], bbox1[2]) - bbox1[0] y2 = min(bbox2[3], bbox1[3]) - bbox1[1] if int(x2 - x1) > 0 and int(y2 - y1) > 0: # show image if it in the visible area x = min(int(x2 / self.imscale), self.width) # sometimes it is larger on 1 pixel... y = min(int(y2 / self.imscale), self.height) # ...and sometimes not image = self.image.crop((int(x1 / self.imscale), int(y1 / self.imscale), x, y)) imagetk = ImageTk.PhotoImage(image.resize((int(x2 - x1), int(y2 - y1)))) imageid = self.canvas.create_image(max(bbox2[0], bbox1[0]), max(bbox2[1], bbox1[1]), anchor='nw', image=imagetk) self.canvas.lower(imageid) # set image into background self.canvas.imagetk = imagetk # keep an extra reference to prevent garbage-collection path = 'doge.jpg' # place path to your image here root = tk.Tk() app = Zoom_Advanced(root, path=path) root.mainloop()

编辑:

我创建了更高级的缩放功能。有“图像金字塔”可平滑缩放大图像,甚至能够打开和缩放高达数 GB 的巨大 TIFF 文件。

版本 3.0 在 Windows 7 64 位和 Python 3.7 上进行了测试。

# -*- coding: utf-8 -*- # Advanced zoom for images of various types from small to huge up to several GB import math import warnings import tkinter as tk from tkinter import ttk from PIL import Image, ImageTk class AutoScrollbar(ttk.Scrollbar): """ A scrollbar that hides itself if it's not needed. Works only for grid geometry manager """ def set(self, lo, hi): if float(lo) <= 0.0 and float(hi) >= 1.0: self.grid_remove() else: self.grid() ttk.Scrollbar.set(self, lo, hi) def pack(self, **kw): raise tk.TclError('Cannot use pack with the widget ' + self.__class__.__name__) def place(self, **kw): raise tk.TclError('Cannot use place with the widget ' + self.__class__.__name__) class CanvasImage: """ Display and zoom image """ def __init__(self, placeholder, path): """ Initialize the ImageFrame """ self.imscale = 1.0 # scale for the canvas image zoom, public for outer classes self.__delta = 1.3 # zoom magnitude self.__filter = Image.ANTIALIAS # could be: NEAREST, BILINEAR, BICUBIC and ANTIALIAS self.__previous_state = 0 # previous state of the keyboard self.path = path # path to the image, should be public for outer classes # Create ImageFrame in placeholder widget self.__imframe = ttk.Frame(placeholder) # placeholder of the ImageFrame object # Vertical and horizontal scrollbars for canvas hbar = AutoScrollbar(self.__imframe, orient='horizontal') vbar = AutoScrollbar(self.__imframe, orient='vertical') hbar.grid(row=1, column=0, sticky='we') vbar.grid(row=0, column=1, sticky='ns') # Create canvas and bind it with scrollbars. Public for outer classes self.canvas = tk.Canvas(self.__imframe, highlightthickness=0, xscrollcommand=hbar.set, yscrollcommand=vbar.set) self.canvas.grid(row=0, column=0, sticky='nswe') self.canvas.update() # wait till canvas is created hbar.configure(command=self.__scroll_x) # bind scrollbars to the canvas vbar.configure(command=self.__scroll_y) # Bind events to the Canvas self.canvas.bind('<Configure>', lambda event: self.__show_image()) # canvas is resized self.canvas.bind('<ButtonPress-1>', self.__move_from) # remember canvas position self.canvas.bind('<B1-Motion>', self.__move_to) # move canvas to the new position self.canvas.bind('<MouseWheel>', self.__wheel) # zoom for Windows and MacOS, but not Linux self.canvas.bind('<Button-5>', self.__wheel) # zoom for Linux, wheel scroll down self.canvas.bind('<Button-4>', self.__wheel) # zoom for Linux, wheel scroll up # Handle keystrokes in idle mode, because program slows down on a weak computers, # when too many key stroke events in the same time self.canvas.bind('<Key>', lambda event: self.canvas.after_idle(self.__keystroke, event)) # Decide if this image huge or not self.__huge = False # huge or not self.__huge_size = 14000 # define size of the huge image self.__band_width = 1024 # width of the tile band Image.MAX_IMAGE_PIXELS = 1000000000 # suppress DecompressionBombError for the big image with warnings.catch_warnings(): # suppress DecompressionBombWarning warnings.simplefilter('ignore') self.__image = Image.open(self.path) # open image, but down't load it self.imwidth, self.imheight = self.__image.size # public for outer classes if self.imwidth * self.imheight > self.__huge_size * self.__huge_size and \ self.__image.tile[0][0] == 'raw': # only raw images could be tiled self.__huge = True # image is huge self.__offset = self.__image.tile[0][2] # initial tile offset self.__tile = [self.__image.tile[0][0], # it have to be 'raw' [0, 0, self.imwidth, 0], # tile extent (a rectangle) self.__offset, self.__image.tile[0][3]] # list of arguments to the decoder self.__min_side = min(self.imwidth, self.imheight) # get the smaller image side # Create image pyramid self.__pyramid = [self.smaller()] if self.__huge else [Image.open(self.path)] # Set ratio coefficient for image pyramid self.__ratio = max(self.imwidth, self.imheight) / self.__huge_size if self.__huge else 1.0 self.__curr_img = 0 # current image from the pyramid self.__scale = self.imscale * self.__ratio # image pyramide scale self.__reduction = 2 # reduction degree of image pyramid w, h = self.__pyramid[-1].size while w > 512 and h > 512: # top pyramid image is around 512 pixels in size w /= self.__reduction # divide on reduction degree h /= self.__reduction # divide on reduction degree self.__pyramid.append(self.__pyramid[-1].resize((int(w), int(h)), self.__filter)) # Put image into container rectangle and use it to set proper coordinates to the image self.container = self.canvas.create_rectangle((0, 0, self.imwidth, self.imheight), width=0) self.__show_image() # show image on the canvas self.canvas.focus_set() # set focus on the canvas def smaller(self): """ Resize image proportionally and return smaller image """ w1, h1 = float(self.imwidth), float(self.imheight) w2, h2 = float(self.__huge_size), float(self.__huge_size) aspect_ratio1 = w1 / h1 aspect_ratio2 = w2 / h2 # it equals to 1.0 if aspect_ratio1 == aspect_ratio2: image = Image.new('RGB', (int(w2), int(h2))) k = h2 / h1 # compression ratio w = int(w2) # band length elif aspect_ratio1 > aspect_ratio2: image = Image.new('RGB', (int(w2), int(w2 / aspect_ratio1))) k = h2 / w1 # compression ratio w = int(w2) # band length else: # aspect_ratio1 < aspect_ration2 image = Image.new('RGB', (int(h2 * aspect_ratio1), int(h2))) k = h2 / h1 # compression ratio w = int(h2 * aspect_ratio1) # band length i, j, n = 0, 1, round(0.5 + self.imheight / self.__band_width) while i < self.imheight: print('\rOpening image: {j} from {n}'.format(j=j, n=n), end='') band = min(self.__band_width, self.imheight - i) # width of the tile band self.__tile[1][3] = band # set band width self.__tile[2] = self.__offset + self.imwidth * i * 3 # tile offset (3 bytes per pixel) self.__image.close() self.__image = Image.open(self.path) # reopen / reset image self.__image.size = (self.imwidth, band) # set size of the tile band self.__image.tile = [self.__tile] # set tile cropped = self.__image.crop((0, 0, self.imwidth, band)) # crop tile band image.paste(cropped.resize((w, int(band * k)+1), self.__filter), (0, int(i * k))) i += band j += 1 print('\r' + 30*' ' + '\r', end='') # hide printed string return image def redraw_figures(self): """ Dummy function to redraw figures in the children classes """ pass def grid(self, **kw): """ Put CanvasImage widget on the parent widget """ self.__imframe.grid(**kw) # place CanvasImage widget on the grid self.__imframe.grid(sticky='nswe') # make frame container sticky self.__imframe.rowconfigure(0, weight=1) # make canvas expandable self.__imframe.columnconfigure(0, weight=1) def pack(self, **kw): """ Exception: cannot use pack with this widget """ raise Exception('Cannot use pack with the widget ' + self.__class__.__name__) def place(self, **kw): """ Exception: cannot use place with this widget """ raise Exception('Cannot use place with the widget ' + self.__class__.__name__) # noinspection PyUnusedLocal def __scroll_x(self, *args, **kwargs): """ Scroll canvas horizontally and redraw the image """ self.canvas.xview(*args) # scroll horizontally self.__show_image() # redraw the image # noinspection PyUnusedLocal def __scroll_y(self, *args, **kwargs): """ Scroll canvas vertically and redraw the image """ self.canvas.yview(*args) # scroll vertically self.__show_image() # redraw the image def __show_image(self): """ Show image on the Canvas. Implements correct image zoom almost like in Google Maps """ box_image = self.canvas.coords(self.container) # get image area box_canvas = (self.canvas.canvasx(0), # get visible area of the canvas self.canvas.canvasy(0), self.canvas.canvasx(self.canvas.winfo_width()), self.canvas.canvasy(self.canvas.winfo_height())) box_img_int = tuple(map(int, box_image)) # convert to integer or it will not work properly # Get scroll region box box_scroll = [min(box_img_int[0], box_canvas[0]), min(box_img_int[1], box_canvas[1]), max(box_img_int[2], box_canvas[2]), max(box_img_int[3], box_canvas[3])] # Horizontal part of the image is in the visible area if box_scroll[0] == box_canvas[0] and box_scroll[2] == box_canvas[2]: box_scroll[0] = box_img_int[0] box_scroll[2] = box_img_int[2] # Vertical part of the image is in the visible area if box_scroll[1] == box_canvas[1] and box_scroll[3] == box_canvas[3]: box_scroll[1] = box_img_int[1] box_scroll[3] = box_img_int[3] # Convert scroll region to tuple and to integer self.canvas.configure(scrollregion=tuple(map(int, box_scroll))) # set scroll region x1 = max(box_canvas[0] - box_image[0], 0) # get coordinates (x1,y1,x2,y2) of the image tile y1 = max(box_canvas[1] - box_image[1], 0) x2 = min(box_canvas[2], box_image[2]) - box_image[0] y2 = min(box_canvas[3], box_image[3]) - box_image[1] if int(x2 - x1) > 0 and int(y2 - y1) > 0: # show image if it in the visible area if self.__huge and self.__curr_img < 0: # show huge image h = int((y2 - y1) / self.imscale) # height of the tile band self.__tile[1][3] = h # set the tile band height self.__tile[2] = self.__offset + self.imwidth * int(y1 / self.imscale) * 3 self.__image.close() self.__image = Image.open(self.path) # reopen / reset image self.__image.size = (self.imwidth, h) # set size of the tile band self.__image.tile = [self.__tile] image = self.__image.crop((int(x1 / self.imscale), 0, int(x2 / self.imscale), h)) else: # show normal image image = self.__pyramid[max(0, self.__curr_img)].crop( # crop current img from pyramid (int(x1 / self.__scale), int(y1 / self.__scale), int(x2 / self.__scale), int(y2 / self.__scale))) # imagetk = ImageTk.PhotoImage(image.resize((int(x2 - x1), int(y2 - y1)), self.__filter)) imageid = self.canvas.create_image(max(box_canvas[0], box_img_int[0]), max(box_canvas[1], box_img_int[1]), anchor='nw', image=imagetk) self.canvas.lower(imageid) # set image into background self.canvas.imagetk = imagetk # keep an extra reference to prevent garbage-collection def __move_from(self, event): """ Remember previous coordinates for scrolling with the mouse """ self.canvas.scan_mark(event.x, event.y) def __move_to(self, event): """ Drag (move) canvas to the new position """ self.canvas.scan_dragto(event.x, event.y, gain=1) self.__show_image() # zoom tile and show it on the canvas def outside(self, x, y): """ Checks if the point (x,y) is outside the image area """ bbox = self.canvas.coords(self.container) # get image area if bbox[0] < x < bbox[2] and bbox[1] < y < bbox[3]: return False # point (x,y) is inside the image area else: return True # point (x,y) is outside the image area def __wheel(self, event): """ Zoom with mouse wheel """ x = self.canvas.canvasx(event.x) # get coordinates of the event on the canvas y = self.canvas.canvasy(event.y) if self.outside(x, y): return # zoom only inside image area scale = 1.0 # Respond to Linux (event.num) or Windows (event.delta) wheel event if event.num == 5 or event.delta == -120: # scroll down, smaller if round(self.__min_side * self.imscale) < 30: return # image is less than 30 pixels self.imscale /= self.__delta scale /= self.__delta if event.num == 4 or event.delta == 120: # scroll up, bigger i = min(self.canvas.winfo_width(), self.canvas.winfo_height()) >> 1 if i < self.imscale: return # 1 pixel is bigger than the visible area self.imscale *= self.__delta scale *= self.__delta # Take appropriate image from the pyramid k = self.imscale * self.__ratio # temporary coefficient self.__curr_img = min((-1) * int(math.log(k, self.__reduction)), len(self.__pyramid) - 1) self.__scale = k * math.pow(self.__reduction, max(0, self.__curr_img)) # self.canvas.scale('all', x, y, scale, scale) # rescale all objects # Redraw some figures before showing image on the screen self.redraw_figures() # method for child classes self.__show_image() def __keystroke(self, event): """ Scrolling with the keyboard. Independent from the language of the keyboard, CapsLock, <Ctrl>+<key>, etc. """ if event.state - self.__previous_state == 4: # means that the Control key is pressed pass # do nothing if Control key is pressed else: self.__previous_state = event.state # remember the last keystroke state # Up, Down, Left, Right keystrokes if event.keycode in [68, 39, 102]: # scroll right: keys 'D', 'Right' or 'Numpad-6' self.__scroll_x('scroll', 1, 'unit', event=event) elif event.keycode in [65, 37, 100]: # scroll left: keys 'A', 'Left' or 'Numpad-4' self.__scroll_x('scroll', -1, 'unit', event=event) elif event.keycode in [87, 38, 104]: # scroll up: keys 'W', 'Up' or 'Numpad-8' self.__scroll_y('scroll', -1, 'unit', event=event) elif event.keycode in [83, 40, 98]: # scroll down: keys 'S', 'Down' or 'Numpad-2' self.__scroll_y('scroll', 1, 'unit', event=event) def crop(self, bbox): """ Crop rectangle from the image and return it """ if self.__huge: # image is huge and not totally in RAM band = bbox[3] - bbox[1] # width of the tile band self.__tile[1][3] = band # set the tile height self.__tile[2] = self.__offset + self.imwidth * bbox[1] * 3 # set offset of the band self.__image.close() self.__image = Image.open(self.path) # reopen / reset image self.__image.size = (self.imwidth, band) # set size of the tile band self.__image.tile = [self.__tile] return self.__image.crop((bbox[0], 0, bbox[2], band)) else: # image is totally in RAM return self.__pyramid[0].crop(bbox) def destroy(self): """ ImageFrame destructor """ self.__image.close() map(lambda i: i.close, self.__pyramid) # close all pyramid images del self.__pyramid[:] # delete pyramid list del self.__pyramid # delete pyramid variable self.canvas.destroy() self.__imframe.destroy() class MainWindow(ttk.Frame): """ Main window class """ def __init__(self, mainframe, path): """ Initialize the main Frame """ ttk.Frame.__init__(self, master=mainframe) self.master.title('Advanced Zoom v3.0') self.master.geometry('800x600') # size of the main window self.master.rowconfigure(0, weight=1) # make the CanvasImage widget expandable self.master.columnconfigure(0, weight=1) canvas = CanvasImage(self.master, path) # create widget canvas.grid(row=0, column=0) # show widget filename = './data/img_plg5.png' # place path to your image here #filename = 'd:/Data/yandex_z18_1-1.tif' # huge TIFF file 1.4 GB #filename = 'd:/Data/The_Garden_of_Earthly_Delights_by_Bosch_High_Resolution.jpg' #filename = 'd:/Data/The_Garden_of_Earthly_Delights_by_Bosch_High_Resolution.tif' #filename = 'd:/Data/heic1502a.tif' #filename = 'd:/Data/land_shallow_topo_east.tif' #filename = 'd:/Data/X1D5_B0002594.3FR' app = MainWindow(tk.Tk(), path=filename) app.mainloop()
附注这是使用高级缩放进行

带有多边形的手动图像注释的 GitHub 应用程序。


17
投票
(问题 TITLE 并不表明它专注于位图。我在这里为那些对画布的基本缩放/平移支持感兴趣并通过搜索引擎找到这里的人添加答案)

支持缩放(使用滚轮)和移动/平移(使用左键拖动)的基本机制如下:

from tkinter import ALL, EventType canvas.bind("<MouseWheel>", do_zoom) canvas.bind('<ButtonPress-1>', lambda event: canvas.scan_mark(event.x, event.y)) canvas.bind("<B1-Motion>", lambda event: canvas.scan_dragto(event.x, event.y, gain=1)) def do_zoom(event): x = canvas.canvasx(event.x) y = canvas.canvasy(event.y) factor = 1.001 ** event.delta canvas.scale(ALL, x, y, factor, factor)

简单扩展:支持各个轴单独缩放,通过查看Ctrl和Shift的状态,如下:

def do_zoom(event): x = canvas.canvasx(event.x) y = canvas.canvasy(event.y) factor = 1.001 ** event.delta is_shift = event.state & (1 << 0) != 0 is_ctrl = event.state & (1 << 2) != 0 canvas.scale(ALL, x, y, factor if not is_shift else 1.0, factor if not is_ctrl else 1.0)

更多鼠标轮事件:一些小鼠对<MouseWheel>

中的不同事件做出反应,即事件
<4>
<5>
。可能需要额外的事件处理程序,如下所示。请注意,这个例子是迂腐的。显然,放大和缩小处理程序可以通过一些数学和 lambda 折叠成一个处理程序。

def do_zoom_in(event): x = canvas.canvasx(event.x) y = canvas.canvasy(event.y) factor = 1.1 canvas.scale(ALL, x, y, factor, factor) def do_zoom_out(event): x = canvas.canvasx(event.x) y = canvas.canvasy(event.y) factor = 0.9 canvas.scale(ALL, x, y, factor, factor) canvas.bind('<4>', do_zoom_in) canvas.bind('<5>', do_zoom_out)
    

1
投票
在这种情况下,您可以考虑使用地图图块。这些图块可以特定于缩放级别。根据平移和缩放级别选择图块后,您可以使用

Canvas.create_image

 将它们放置在画布上。

假设您有一些带有坐标和图像的图块类,您可以根据平移、缩放和帧大小选择可见图块。

for tile in visible_tiles(pan_center, frame_dimensions, zoom_level): canvas.create_image(tile.x, tile.y, anchor=Tkinter.NW, image=tile.image)

John Sample 和 Elias Ioup 撰写的“基于切片的地理空间信息系统”中有完整的示例,位于“切片映射客户端”一章中。

提供的答案非常好,并且也适用于非常大的图像。但是,如果您想要缩放/平移来缩放鼠标点并将图像保留在框架中,请参阅随附的代码。您可以调整

1
投票
功能中的

def mouse_wheel(self, event)

,使变焦达到您想要的远或远。此外,您还需要调整 
max_y = scale * 3072
max_x = scale * 4096
 以使用要显示的图像的宽度/高度常数。 *请注意,这允许您在任意帧大小中使用全尺寸图像分辨率。只需确保将 canvas_w 和 canvas_h 设置为与您尝试显示的图像相同的比例即可。
import tkinter as tk             
from PIL import Image, ImageTk  
import numpy as np                                

class PanZoomCanvas(tk.Frame):
    def __init__(self, master,canvas_w,canvas_h):
        super().__init__(master)
        self.pil_image = None   # Image data to be displayed

        self.zoom_cycle = 0

        self.create_widget(canvas_w,canvas_h) # Create canvas
        
        # Initial affine transformation matrix
        self.reset_transform()
 
    # Define the create_widget method.
    def create_widget(self,width,height):
        # Canvas
        self.canvas = tk.Canvas(self.master, background="black", width = width,height = height)
        self.canvas.pack() 

        # Controls
        self.master.bind("<Button-1>", self.mouse_down_left)                   # MouseDown
        self.master.bind("<B1-Motion>", self.mouse_move_left)                  # MouseDrag
        self.master.bind("<Double-Button-1>", self.mouse_double_click_left)    # MouseDoubleClick
        self.master.bind("<MouseWheel>", self.mouse_wheel)                     # MouseWheel


    def set_image(self, filename):
        '''To open an image file'''
        if not filename:
            return
        # PIL.Image
        self.pil_image = Image.open(filename)
        # Set the affine transformation matrix to display the entire image.
        self.zoom_fit(self.pil_image.width, self.pil_image.height)
        # To display the image
        self.draw_image(self.pil_image)

    # -------------------------------------------------------------------------------
    # Mouse events
    # -------------------------------------------------------------------------------
    def mouse_down_left(self, event):
        self.__old_event = event

    def mouse_move_left(self, event):
        if (self.pil_image == None):
            return
        
        self.translate(event.x - self.__old_event.x, event.y - self.__old_event.y)
        self.redraw_image()
        self.__old_event = event



    def mouse_double_click_left(self, event):
        if self.pil_image == None:
            return
        self.zoom_fit(self.pil_image.width, self.pil_image.height)
        self.redraw_image() 

    def mouse_wheel(self, event):
        if self.pil_image == None:
            return

        if (event.delta < 0):
            if self.zoom_cycle <= 0:
                return
            # Rotate upwards and shrink
            self.scale_at(0.8, event.x, event.y)
            self.zoom_cycle -= 1
        else:
            if self.zoom_cycle >= 9:
                return
            #  Rotate downwards and enlarge
            self.scale_at(1.25, event.x, event.y)
            self.zoom_cycle += 1
    
        self.redraw_image() # Refresh
        
    # -------------------------------------------------------------------------------
    # Affine Transformation for Image Display
    # -------------------------------------------------------------------------------

    def reset_transform(self):
        self.mat_affine = np.eye(3) # 3x3の単位行列

    def translate(self, offset_x, offset_y,zoom = False):
        mat = np.eye(3) # 3x3 identity matrix
        mat[0, 2] = float(offset_x)
        mat[1, 2] = float(offset_y)
        # Get the current canvas size
        canvas_width = self.canvas.winfo_width()
        canvas_height = self.canvas.winfo_height()
        
        # Get the current scale
        scale = self.mat_affine[0, 0]
        max_y = scale * 3072
        max_x = scale * 4096
        self.mat_affine = np.dot(mat, self.mat_affine)

        if not zoom:
            if abs(self.mat_affine[0,2]) > abs(max_x-canvas_width):
                self.mat_affine[0,2] = -(max_x-canvas_width)
            if abs(self.mat_affine[1,2]) > abs(max_y-canvas_height):
                self.mat_affine[1,2] = -(max_y-canvas_height)

        if self.mat_affine[0, 2] > 0.0:
            self.mat_affine[0, 2] = 0.0
        if self.mat_affine[1,2] > 0.0:
            self.mat_affine[1,2]  = 0.0

    def scale(self, scale:float):
        mat = np.eye(3) # 3x3 identity matrix

        mat[0, 0] = scale
        mat[1, 1] = scale
        self.mat_affine = np.dot(mat, self.mat_affine)

    def scale_at(self, scale:float, cx:float, cy:float):

        # Translate to the origin
        self.translate(-cx, -cy, True)
        # Scale
        self.scale(scale)
        # Restore
        self.translate(cx, cy)

    def zoom_fit(self, image_width, image_height):

        # Update canvas object and get size
        self.master.update()
        canvas_width = self.canvas.winfo_width()
        canvas_height = self.canvas.winfo_height()

        if (image_width * image_height <= 0) or (canvas_width * canvas_height <= 0):
            return

        # Initialization of affine transformation
        self.reset_transform()

        scale = 1.0
        offsetx = 0.0
        offsety = 0.0
        if (canvas_width * image_height) > (image_width * canvas_height):
            # The widget is horizontally elongated (resizing the image vertically)
            scale = canvas_height / image_height
            # Align the remaining space to the center by offsetting horizontally
            offsetx = (canvas_width - image_width * scale) / 2
        else:
            # The widget is vertically elongated (resizing the image horizontally)
            scale = canvas_width / image_width
            # Align the remaining space to the center by offsetting vertically
            offsety = (canvas_height - image_height * scale) / 2

        # Scale
        self.scale(scale)
        # Align the remaining space to the center
        self.translate(offsetx, offsety)
        self.zoom_cycle = 0

    def to_image_point(self, x, y):
        '''Convert coordinates from the canvas to the image'''
        if self.pil_image == None:
            return []
        # Convert coordinates from the image to the canvas by taking the inverse of the transformation matrix.
        mat_inv = np.linalg.inv(self.mat_affine)
        image_point = np.dot(mat_inv, (x, y, 1.))
        if  image_point[0] < 0 or image_point[1] < 0 or image_point[0] > self.pil_image.width or image_point[1] > self.pil_image.height:
            return []

        return image_point

    # -------------------------------------------------------------------------------
    # Drawing 
    # -------------------------------------------------------------------------------

    def draw_image(self, pil_image):
        
        if pil_image == None:
            return

        self.pil_image = pil_image

        # Canvas size
        canvas_width = self.canvas.winfo_width()
        canvas_height = self.canvas.winfo_height()

        # Calculate the affine transformation matrix from canvas to image data
        # (Calculate the inverse of the display affine transformation matrix)
        mat_inv = np.linalg.inv(self.mat_affine)

        # Convert the numpy array to a tuple for affine transformation
        affine_inv = (
            mat_inv[0, 0], mat_inv[0, 1], mat_inv[0, 2],
            mat_inv[1, 0], mat_inv[1, 1], mat_inv[1, 2]
        )

        # Apply affine transformation to the PIL image data
        dst = self.pil_image.transform(
            (canvas_width, canvas_height),  # Output size
            Image.AFFINE,   # Affine transformation
            affine_inv,     # Affine transformation matrix (conversion matrix from output to input)
            Image.NEAREST   # Interpolation method, nearest neighbor
        )

        im = ImageTk.PhotoImage(image=dst)

        # Draw the image
        item = self.canvas.create_image(
            0, 0,           # Image display position (top-left coordinate)
            anchor='nw',    # Anchor, top-left is the origin
            image=im        # Display image data
        )
        self.image = im

    def redraw_image(self):
        '''Redraw the image'''
        if self.pil_image == None:
            return
        self.draw_image(self.pil_image)


if __name__ == "__main__":
    root = tk.Tk()
    root.geometry('1200x900')
    app = PanZoomCanvas(master=root,canvas_w = 1024,canvas_h = 768)
    app.canvas.config(bg = 'grey')
    app.set_image('image_path_here')
    app.mainloop()


© www.soinside.com 2019 - 2024. All rights reserved.