內容簡介
**總結:**
Active Contour允許您在媒體圖片上定義互動輪廓區域。每個多邊形區域都可以與標題和URL關聯,輕鬆建立豐富的視覺導航、圖表和互動圖像內容。
**問題與答案:**
1. 什麼是Active Contour的功能?
- 直接在媒體庫中編輯輪廓
- 每個區域可以包含標題、超鏈接和自定義數據
- 可以從外部工具導入輪廓
- 支援Gutenberg Block
- 提供Shortcode支持
2. 如何在Active Contour中使用鍵盤快捷鍵?
- 刪除:從輪廓中刪除當前選定的點
- Numpad +:將選定的段落轉換為彎曲弧線(或增加弧度)
- Numpad –:減少弧度或將弧度切換回直線
- Shift(按住):啟用放大模式。按住Shift鍵時,在鼠標下方會出現放大鏡鏡頭,以幫助您更加精確地放置點
3. Active Contour的使用案例有哪些?
- 互動地圖和圖表
- 有提示或鏈接的信息圖
- 產品展示,帶有點擊/點按區域
- 教育或文檔內容
外掛標籤
開發者團隊
原文外掛簡介
Active Contour lets you define interactive contour areas on media images. Each polygonal area can be associated with a title & URL, making it easy to build rich visual navigation, diagrams, and interactive image content.
Features
Edit contours directly in the Media Library
Add, move, and delete points visually
Scaled preview with zoom and background options
Define attributes per area
Each area can include title, href, and custom data
Stored as JSON in image meta field
Import contours from external tools
Paste a JSON object describing one or multiple contours
Compatible with AI-generated data or exported data from vector tools
Preview and refine the result before saving
Gutenberg Block Support
Insert an image with interactive contours using the included block (Active Contour)
Live preview of the selected image and contour state
Shortcode Support
Use [active_contour id="123" cid="1,2"] to embed images with specific contours
Works anywhere shortcodes are supported (pages, posts, widgets)
Use cases
Interactive maps and diagrams
Infographics with tooltips or links
Product showcases with click/tap areas
Educational or documentation content
Keyboard Shortcuts
While editing points in the contour editor, you can use the following keyboard shortcuts for greater control:
Delete — Removes the currently selected point from the contour.
or Numpad + — Converts the selected segment into a curved arc (or increases arc intensity).
or Numpad – — Decreases arc curvature or switches arc back to straight line.
Shift (hold) — Activates zoom mode. While holding Shift, a magnifier lens appears under the cursor to help you place points more precisely.
Other behaviors:
Click on canvas — Adds a new point in the closest location or selects an existing one if clicked near.
Click and drag a point — Moves the selected point with the mouse.
