在 ipywidgets 中显示图例的颜色框

Question

对于我在 ipyvolume 中制作的模型图例，我想制作一个 widget.HTML，它在 widgets.HTML() 中的相应标签旁边显示一个小颜色框。

据我所知，您只能为 html 代码放置一行字符串。有人有好主意吗？

Answer 1

我决定只构建一个网格和所需颜色的彩色按钮：

def create_expanded_button(description):
    return Button(description=description, style={'font_weight': 'bold'}, layout=Layout( width='auto'))

def color_box (description, color):
    b1 = Button(description=description)
    b1.style.button_color = color
    return b1


# names and colors are two lists of length 11 and 22

cgrid = GridspecLayout(12, 2)
tgrid = GridspecLayout(12, 1)

c = 0
for i in range(12):
        for j in range(2):
                cgrid[i, j] = color_box(''.format(i, j), colors[c])
                c+=1 
     
            
for i in range(12):
        for j in range(1):
            tgrid[i, j] = create_expanded_button(names[i-1].format(i, j))
 
        
grid = GridspecLayout(2, 2, height='auto', width='auto')
grid[:, :1] = cgrid
grid[:, 1:] = tgrid
grid

在 ipywidgets 中显示图例的颜色框

Display colorbox for legend in ipywidgets

html

css

python

jupyter-notebook

ipywidgets