Question

我在jupyter笔记本中使用AutocompleteInput小部件。自动补全本身工作正常，但输出出现问题。

是否可以通过某种方式查看自动完成的输出而无需滚动（这实际上不是用户友好的）？（调整笔记本计算机的输出单元格大小，自动调整单元格大小，AutocompleteInput宽的选项）

这是我目前所做的：

input_widget  = AutocompleteInput(completions=list(df_competences['libelleCompetence']), title='Chercher une compétence', placeholder='Chercher une compétence', sizing_mode='scale_height', css_classes=['my_autocomplete_class'])
show(input_widget)

我一直在寻找很多可能性，但没有找到一种方法来实现这一目标...

Answer 1

万一有人遇到与我相同的问题，这就是我的解决方法：

我正在获取bokeh生成的HTML代码，删除bokeh使用的类并将其替换为我自己的类。然后，您只需要创建自己的css类以使自动完成输出合适即可。

代码如下：

from IPython.display import HTML
input_widget  = AutocompleteInput(completions=list(df_competences['libelleCompetence']), title='Chercher une compétence: ', placeholder='Chercher une compétence', sizing_mode='scale_both', css_classes=['my_autocomplete_class'])

script, div = components(input_widget)

div = div.replace('bk-root', 'my_class')
div = div.replace('<div class="my_class"', '<div class="my_class" style="width: 100%; max_height: 500;"')

HTML(script + div)

Answer 2

添加显示HTML命令，在其中指定显示的建议框的最小高度：

from IPython.core.display import display, HTML
input_widget  = AutocompleteInput(completions=list(df_competences['libelleCompetence']), title='Chercher une compétence', placeholder='Chercher une compétence', sizing_mode='scale_height', css_classes=['my_autocomplete_class'])
display(HTML('<style> .bk-root[id] { min-height:100pt } </style>'))
show(input_widget)

Jupyter笔记本单元中的Bokeh AutocompleteInput问题

2 个答案: