jupyter notebook 中圖像的交互式標注

Question

我有一個圖片列表：

pictures = {im1,im2,im3,im4,im5,im6}

在哪里

im1:

IM2：

IM3：

IM4：

im5:

IM6：

我想將圖片分配給標簽（1、2、3、4 等）

比如這里圖片1到3屬於label 1，圖片4屬於label 2，圖片5屬於label 3，圖片6屬於label 4。

-> label = {1,1,1,2,3,4}

由於我需要在 label 時查看圖像，因此我需要一種方法來在標記它們時執行此操作。 我正在考慮創建一組圖像：

然后我通過單擊屬於相同標簽的第一張和最后一張圖片來定義范圍，例如：

你怎么認為？ 這有可能嗎？

我想為不同范圍的圖片分配不同的標簽。

例如：當一個人選擇完第一個 label 時，可以雙擊指示，然后選擇第二個 label 范圍，然后雙擊，然后選擇第三個 label 范圍，然后雙擊, 然后選擇第四個 label 范圍等。

不必雙擊即可更改標簽的選擇，它也可以只是一個按鈕或您可能有的任何其他想法。

最后應該有標簽列表。

Answer 1

從本質上講，您正在尋找的大多數交互都歸結為能夠顯示圖像，並實時檢測對它們的點擊。 在這種情況下，您可以使用 jupyter 小部件（又名ipywidgets ）模塊來實現您正在尋找的大部分（如果不是全部）。

查看此處描述的按鈕小部件，並解釋如何注冊其點擊事件。 問題 - 我們無法在按鈕上顯示圖像，而且我在ipywidgets文檔中找不到任何方法來執行此ipywidgets 。 有一個圖像小部件，但它不提供on_click事件。 所以構建一個自定義布局，在每個圖像下面都有一個按鈕：

COLS = 4
ROWS = 2
IMAGES = ...
IMG_WIDTH = 200
IMG_HEIGHT = 200

def on_click(index):
    print('Image %d clicked' % index)

import ipywidgets as widgets
import functools

rows = []

for row in range(ROWS):
    cols = []
    for col in range(COLS):
        index = row * COLS + col
        image = widgets.Image(
            value=IMAGES[index], width=IMG_WIDTH, height=IMG_HEIGHT
        )
        button = widgets.Button(description='Image %d' % index)
        # Bind the click event to the on_click function, with our index as argument
        button.on_click(functools.partial(on_click, index))

        # Create a vertical layout box, image above the button
        box = widgets.VBox([image, button])
        cols.append(box)

    # Create a horizontal layout box, grouping all the columns together
    rows.append(widgets.HBox(cols))

# Create a vertical layout box, grouping all the rows together
result = widgets.VBox(rows)

從技術上講，您還可以編寫一個自定義小部件來顯示圖像並監聽點擊，但我認為這不值得您花費時間和精力。

祝你好運！

Answer 2

qsl package 提供了執行此操作的小部件。 對於您的情況，以下代碼將允許您批量處理 label 張圖像。 完全公開， qsl是我開始的一個項目，因為我和你一樣，想要從 Jupyter 筆記本內部獲取 label 張圖像。

import qsl
from IPython.display import display

labeler = qsl.MediaLabeler(
    items=[
      {"target": "https://i.stack.imgur.com/cML6z.jpg"},
      {"target": "https://i.stack.imgur.com/6EVAP.jpg"},
      {"target": "https://i.stack.imgur.com/CAxUw.jpg"},
      {"target": "https://i.stack.imgur.com/8fhan.jpg"},
      {"target": "https://i.stack.imgur.com/eMXn5.jpg"},
      {"target": "https://i.stack.imgur.com/YFBfM.jpg"}
    ],
    # Optional, you can also configure the labeler from
    # the UI.
    config={
      "image": [
        {
          "name": "Type",
          "options": [
            {"name": "Foo"},
            {"name": "Bar"}
          ]
        }
      ]
    },
    # Optional, set to 1 if you want to label
    # one image at a time.
    batch_size=4,
    # Optionally, save labels to JSON. You
    # can also get the labels using `labeler.items`.
    jsonpath="labels.json"
)
display(labeler)

這會生成一個如下所示的 UI。

這是一個Google Colab notebook ，展示了如何在 Google Colab 中執行此操作。