Fixed Mouse Wheel Zoom

Fixed Mouse Wheel Zoom 
Tags: General Topics

Coordinator
Apr 4 2007 at 5:09 AM
The latest changeset (20719) has the fix for MapImage_Wheel doesn't handle MouseEventArgs.Delta correctly and Null reference if no map loaded.

I also handle the MouseHover event in the MapImage control and set the focus to that control, so the mouse wheel works predictably. This was a problem for some users, such as jianyunli in MapImage didn't get MouseWheel event.

Apr 4 2007 at 4:11 PM
I have a problem compiling the Extensions assembly:

On PostGIS.cs line 195:
    if (!String.IsNullOrEmpty(_defintionQuery!=null))
      strSQL += this.DefinitionQuery + " AND ";

The code gives me the error: The best overloaded method match for 'string.IsNullOrEmpty(string)'.

Shouldn't the code be
    if (!String.IsNullOrEmpty(_defintionQuery))
      strSQL += this.DefinitionQuery + " AND ";


George J.

Coordinator
Apr 4 2007 at 4:39 PM
Yea, I noticed that too. I'm not sure what we are doing with that file - I think it is being deprecated in favor of the more current PostGIS2.cs provider. I'll mark it as a work item. Thanks for the heads up.

Coordinator
Apr 4 2007 at 4:39 PM
This discussion has been copied to Work Item 9355. You may wish to continue further discussion there.
 
import tkinter as tk from PIL import Image, ImageTk # ==================== 配置文件路径 ==================== BACKGROUND_PATH = "1.jpg" BASE_STATION_PATH = "base_station.png" PHONE_ICON_PATH = "phone.png" # ==================== 坐标定义 ==================== BS_X, BS_Y = 400, 300 # 基站逻辑坐标 # ==================== 固定图标大小 ==================== FIXED_BS_SIZE = (32, 32) FIXED_PHONE_SIZE = (24, 24) # ==================== 全局变量 ==================== zoom_factor = 1.0 img_x, img_y = 0, 0 drag_start = None bg_image_tk = None bs_icon_tk = None phone_icon_tk = None canvas_images = [] # 存储所有动态图标的 canvas ID phones = {} # 手机字典:{ phone_id: { 'x': x, 'y': y } } # ==================== 创建主窗口 ==================== root = tk.Tk() root.title("多手机管理系统") root.geometry("1200x900") left_frame = tk.Frame(root) left_frame.pack(side="left", fill="both", expand=True) right_frame = tk.Frame(root, width=300, bg="lightgray") right_frame.pack(side="right", fill="y") canvas = tk.Canvas(left_frame, bg="black") canvas.pack(fill="both", expand=True) # ==================== 状态栏 ==================== status_label = tk.Label(right_frame, text="就绪", fg="green", bg="lightgray", wraplength=280) status_label.pack(pady=10) def update_status(text, color="black"): status_label.config(text=text, fg=color) # ==================== 加载图像 ==================== try: bg_image = Image.open(BACKGROUND_PATH) except FileNotFoundError: print(f"[警告] {BACKGROUND_PATH} 不存在,使用蓝色占位图") bg_image = Image.new("RGB", (800, 600), "blue") # 加载基站图标 try: bs_raw = Image.open(BASE_STATION_PATH).convert("RGBA") bs_resized = bs_raw.resize(FIXED_BS_SIZE, Image.Resampling.LANCZOS) bs_icon_tk = ImageTk.PhotoImage(bs_resized) except FileNotFoundError: print(f"[警告] {BASE_STATION_PATH} 不存在,生成白色圆形") bs_img = Image.new("RGBA", FIXED_BS_SIZE, (0, 0, 0, 0)) from PIL import ImageDraw draw = ImageDraw.Draw(bs_img) draw.ellipse((2, 2, 30, 30), fill=(255, 255, 255, 200), outline="gray", width=3) bs_icon_tk = ImageTk.PhotoImage(bs_img) # 加载手机图标 try: phone_raw = Image.open(PHONE_ICON_PATH).convert("RGBA") phone_resized = phone_raw.resize(FIXED_PHONE_SIZE, Image.Resampling.LANCZOS) phone_icon_tk = ImageTk.PhotoImage(phone_resized) except FileNotFoundError: print(f"[警告] {PHONE_ICON_PATH} 不存在,生成绿色圆形") phone_img = Image.new("RGBA", FIXED_PHONE_SIZE, (0, 0, 0, 0)) from PIL import ImageDraw draw = ImageDraw.Draw(phone_img) draw.ellipse((2, 2, 22, 22), fill=(0, 200, 0, 180), outline="white", width=2) phone_icon_tk = ImageTk.PhotoImage(phone_img) # ==================== 渲染函数 ==================== def render_background(): global bg_image_tk w, h = bg_image.size new_size = (int(w * zoom_factor), int(h * zoom_factor)) resized_bg = bg_image.resize(new_size, Image.Resampling.LANCZOS) bg_image_tk = ImageTk.PhotoImage(resized_bg) canvas.delete("background") canvas.create_image(img_x, img_y, anchor="nw", image=bg_image_tk, tags="background") def draw_icons(): global canvas_images for img_id in canvas_images: canvas.delete(img_id) canvas_images.clear() # --- 绘制基站 --- screen_bs_x = img_x + int(BS_X * zoom_factor) screen_bs_y = img_y + int(BS_Y * zoom_factor) bs_id = canvas.create_image(screen_bs_x, screen_bs_y, image=bs_icon_tk, anchor="center", tags="icon") canvas_images.append(bs_id) # --- 绘制所有手机 --- for pid, data in phones.items(): x, y = data['x'], data['y'] sx = img_x + int(x * zoom_factor) sy = img_y + int(y * zoom_factor) phone_id = canvas.create_image(sx, sy, image=phone_icon_tk, anchor="center", tags=("phone", pid)) canvas_images.append(phone_id) # 可选:添加标签文字 label_id = canvas.create_text(sx, sy + 15, text=str(pid), fill="white", font=("Arial", 9), tags=("label", pid)) canvas_images.append(label_id) # 显示信息 canvas.create_text(10, 10, anchor="nw", text=f"缩放: {zoom_factor:.2f}x", fill="yellow", font=("Arial", 12), tags="info") canvas.create_text(10, 30, anchor="nw", text=f"设备数: {len(phones)}", fill="cyan", font=("Arial", 12), tags="info") def redraw(): render_background() draw_icons() # ==================== UI 控件区 ==================== tk.Label(right_frame, text="📱 多手机管理", font=("Arial", 16), bg="lightgray").pack(pady=10) # 手机 ID 输入 tk.Label(right_frame, text="手机ID:", bg="lightgray").pack(pady=5) entry_id = tk.Entry(right_frame, width=25, font=("Arial", 11)) entry_id.pack(pady=2) # X 坐标 tk.Label(right_frame, text="X 坐标:", bg="lightgray").pack(pady=5) entry_x = tk.Entry(right_frame, width=25, font=("Arial", 11)) entry_x.pack(pady=2) # Y 坐标 tk.Label(right_frame, text="Y 坐标:", bg="lightgray").pack(pady=5) entry_y = tk.Entry(right_frame, width=25, font=("Arial", 11)) entry_y.pack(pady=2) # 添加或更新手机 def on_add_update(): try: pid = entry_id.get().strip() if not pid: raise ValueError("ID 不能为空") x = int(entry_x.get()) y = int(entry_y.get()) except ValueError as e: update_status(f"❌ 输入错误:{e}", "red") return w, h = bg_image.size if not (0 <= x < w): update_status(f"❌ X 超出范围 [0, {w})", "red") return if not (0 <= y < h): update_status(f"❌ Y 超出范围 [0, {h})", "red") return phones[pid] = {'x': x, 'y': y} update_phone_list() redraw() update_status(f"✅ 已添加/更新 {pid}", "green") # 删除手机 def on_delete(): pid = entry_id.get().strip() if pid in phones: del phones[pid] update_phone_list() redraw() update_status(f"🗑️ 已删除 {pid}", "orange") else: update_status(f"❌ 找不到手机 {pid}", "red") # 清空所有手机 def on_clear_all(): if phones: phones.clear() update_phone_list() redraw() update_status("🧹 已清空所有设备", "orange") else: update_status("ℹ️ 无设备可清除", "gray") # 列表框显示当前手机 phone_listbox = tk.Listbox(right_frame, height=8, width=30, font=("Arial", 10)) phone_listbox.pack(pady=10) def update_phone_list(): phone_listbox.delete(0, tk.END) for pid in phones: phone_listbox.insert(tk.END, f"{pid}") def on_list_select(event): selection = phone_listbox.curselection() if selection: index = selection[0] pid = phone_listbox.get(index).split()[0] # 获取 ID data = phones[pid] entry_id.delete(0, tk.END) entry_id.insert(0, pid) entry_x.delete(0, tk.END) entry_x.insert(0, str(data['x'])) entry_y.delete(0, tk.END) entry_y.insert(0, str(data['y'])) phone_listbox.bind("<<ListboxSelect>>", on_list_select) # 按钮区域 btn_frame = tk.Frame(right_frame, bg="lightgray") btn_frame.pack(pady=10) tk.Button(btn_frame, text="➕ 添加/更新", bg="#4CAF50", fg="white", command=on_add_update).grid(row=0, column=0, padx=5, pady=2) tk.Button(btn_frame, text="➖ 删除", bg="#F44336", fg="white", command=on_delete).grid(row=0, column=1, padx=5, pady=2) tk.Button(btn_frame, text="🧹 清空全部", bg="#FF9800", fg="white", command=on_clear_all).grid(row=1, column=0, columnspan=2, pady=5) # ==================== 鼠标事件(缩放 & 拖拽)==================== def on_scroll(event): global zoom_factor if event.delta > 0 or getattr(event, 'num', None) == 4: zoom_factor *= 1.1 else: zoom_factor /= 1.1 zoom_factor = max(0.1, min(zoom_factor, 10)) redraw() def on_drag_start(event): global drag_start drag_start = (event.x, event.y) def on_drag_motion(event): global drag_start, img_x, img_y if drag_start: dx = event.x - drag_start[0] dy = event.y - drag_start[1] img_x += dx img_y += dy drag_start = (event.x, event.y) redraw() def on_drag_release(event): global drag_start drag_start = None # 绑定事件 canvas.bind("<MouseWheel>", on_scroll) canvas.bind("<Button-4>", on_scroll) canvas.bind("<Button-5>", on_scroll) canvas.bind("<ButtonPress-1>", on_drag_start) canvas.bind("<B1-Motion>", on_drag_motion) canvas.bind("<ButtonRelease-1>", on_drag_release) # 初始化 update_phone_list() redraw() # 启动主循环 root.mainloop() 该代码是针对基站用户移动的模拟,能对其进行模块化分析,并告知想添加新功能该在哪个区域?
最新发布
11-20
<script> document.addEventListener('DOMContentLoaded', (event) => { const images = document.querySelectorAll('img'); images.forEach((image) => { image.addEventListener('click', (event) => { var original_image = document.getElementById("new_image"); if (image.alt != 'no'){ reset_image(); original_image.src = image.src; document.getElementById('image-background').style.cssText='display:block;display: flex;'; } }); }); }); </script> <style> #image-background{ top: 0px; left: 0px; width: 100%; z-index: 95; height: 100%; display: none; height: 100vh; position: fixed; overflow: hidden; align-items: center; justify-content: center; background-color: rgba(0,0,0,0.75); -webkit-transition-duration: 0.2s; transition-duration: 0.2s; } #image-background img { cursor: grab; max-width: 100%; max-height: 100%; border-radius: 8px; -webkit-transition-duration: 0.2s; transition-duration: 0.2s; } #image-background button { border: none; color: black; font-size: 16px; margin: 4px 2px; cursor: pointer; font-size: 18px; overflow: hidden; padding: 15px 26px; text-align: center; align-items: center; border-radius: 10px; text-decoration: none; justify-content: center; display: inline-block; backdrop-filter: blur(6px); font-family: 'Microsoft Yahei'; background-color: rgba(255, 255, 255, 0.5); -webkit-transition-duration: 0.2s; transition-duration: 0.2s; } #image-background button:hover { box-shadow: 0 0 8px rgba(0, 0, 255, 0.6),0 0 16px rgba(0, 0, 255, 0.4), 0 0 32px rgba(0, 0, 255, 0.2); -webkit-transition-duration: 0.2s; transition-duration: 0.2s; } .image-background_close{ top: 10px; right: 12.5px; font-size: 40px; position: fixed; font-weight: bold; padding: 2px 20px; background-color: none; color: rgba(255,255,255,0.75); -webkit-transition-duration: 0.2s; transition-duration: 0.2s; } .image-background_close:hover{ cursor: pointer; border-radius: 6px; text-decoration: none; color: rgba(255,255,255,1); background-color:rgba(0,0,0,0.5); -webkit-transition-duration: 0.2s; transition-duration: 0.2s; } </style> <script> function demo(e){ if(e.wheelDelta){ if(e.wheelDelta > 0){ zoomIn(); } if(e.wheelDelta < 0){ zoomOut(); } } } window.addEventListener("mousewheel",demo) </script> <div id="image-background"> <span style="font-size:22px;font-family:'Microsoft Yahei';background-color:rgba(0,0,0,0.2);padding:10px 20px;border-radius:4px;color:white;top:10px;left:12.5px;position:fixed;z-index:9999;"> 图片预览 </span> <img style="position: absolute;"id="new_image"> </br> <div align="center"style="position:fixed;bottom:0;width:100%;"> <span class="image-background_close"onclick="document.getElementById('image-background').style.cssText='display:none';"> × </span> <button onclick="zoomIn()"> 放大图片 </button> <button onclick="zoomOut()"> 缩小图片 </button> <button onclick="rotateClockwise()"> 顺时针旋转90° </button> <button onclick="counterclockwiseRotation()"> 逆时针旋转90° </button> <button onclick="reset_image()"> 1:1 </button> <button onclick="window.open(new_image.src);"> 在新窗口打开图片 </button> <button onclick="information()"> 查看图片信息 </button> </div> </div> <script> function reset_image(){ scale = 1; rotateAngle = 0; var image_number = document.getElementsByTagName('img'); var image_number = image_number.length - 1; var img = document.getElementById('new_image'); document.getElementById('new_image').style.transform = `scale(${scale})`; document.getElementById('new_image').style.transform = `rotate(${rotateAngle}deg) scale(${scale})`; img.style.top = '50%'; img.style.left = '50%'; img.style.transform = 'translate(-50%, -50%)'; } function zoomIn() { scale += 0.1; document.getElementById('new_image').style.transform = `rotate(${rotateAngle}deg) scale(${scale})`; } function zoomOut() { scale -= 0.1; if(scale < 0.1){ scale = 0.1; return false; } else{ document.getElementById('new_image').style.transform = `rotate(${rotateAngle}deg) scale(${scale})`; } } function rotateClockwise() { rotateAngle += 90; document.getElementById('new_image').style.transform = `rotate(${rotateAngle}deg) scale(${scale})`; } function counterclockwiseRotation() { rotateAngle -= 90; document.getElementById('new_image').style.transform = `rotate(${rotateAngle}deg) scale(${scale})`; } function information(){ alert( "<span style='color:lightblue;'><b>["+new_image.width+"×"+new_image.height+"]</b></span>图片<b>信息</b></span>", "<img src="+new_image.src+"></br></br><p style='font-size:18px;color:black'>图片宽度:<b>"+new_image.width+"</b></br>图片高度:<b>"+new_image.height+"</b></br>图片格式:<b>"+new_image.src.substr(new_image.src.lastIndexOf(".")+1)+"</b></br>路径:<a href='"+new_image.src+"'>"+new_image.src+"</a></br><span>"+new_image.title+"</span>", "关闭<b>图片信息</b>" ) } </script> <img src="80cf53f3-168e-4.png"> <script type="text/javascript"> window.onload = function(){ var new_image = document.getElementById("new_image"); move(new_image); }; function move(obj){ obj.onmousedown = function(event){ obj.setCapture && obj.setCapture(); event = event ||window.event var ol = event.clientX -obj.offsetLeft; var ot = event.clientY - obj.offsetTop; document.onmousemove = function(event){ event = event ||window.event var left = event.clientX-ol; var top = event.clientY-ot; obj.style.left = left+"px"; obj.style.top = top+"px"; }; document.onmouseup = function(){ document.onmousemove = null; document.onmouseup = null; obj.releaseCapture && obj.releaseCapture(); }; return false; }; }; </script> 以上代码中,拖拽功能有bug,拖动之后会恢复到中心位置,而且不能支持放大、旋转后拖动,修复上面的代码存在的bug
07-03
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值