Встраивание локальных изображений с относительными путями с помощью HoverTool в Bokeh - PullRequest
0 голосов
/ 22 октября 2018

Я пытаюсь создать график, на котором при наведении курсора на глиф отображается изображение, подобное этому примеру змеи из документов:

Если я предоставлю серию панелей данных / DataSourceColumn@images, содержащий абсолютные пути, код работает нормально при использовании show, но если я предоставлю относительные пути к текущему рабочему каталогу (subfolder_from_cwd / filename.png), изображения не будут отображаться при использовании show.Моя цель - создать переносимый html-файл, содержащий данные, но, похоже, с абсолютными путями функции save output_save к html не встраивают изображения, поэтому мне нужно использовать относительные пути.

Я пытался:

  • Включение имени текущего рабочего каталога в путь к папке
  • Изменение file://@images на @images

Но я не уверен, что еще можно попробовать.

Спасибо за любую помощь.

def make_bokeh_plot(dataframe, title):
    def style(p):
        p.title.align = 'center'
        p.title.text_font_size = '18pt'
        p.xaxis.axis_label_text_font_size = '12pt'
        p.xaxis.major_label_text_font_size = '12pt'
        p.yaxis.axis_label_text_font_size = '12pt'
        p.yaxis.major_label_text_font_size = '12pt'

        return p



    #make a histogram, keeping the image path
    arr_df, frequencies, edges  = make_histogram_df(dataframe.score.values, bins=100)

    #Make a list of the paths indexes by histrogram index bins
    img_path_series=make_img_path_series(edges,dataframe)
    #merge it with arr_df
    arr_df["images"]=img_path_series
    print(arr_df["images"].head())

    #Make df into a bokeh friendly format 
    arr_src = ColumnDataSource(arr_df)

    # Set up the figure same as before
    p = figure(plot_width = 500, plot_height = 500, title = title,
                x_range=(0, 1),
              x_axis_label = 'Scores', y_axis_label = 'Count')

    # Add a quad glyph with source this time
    p.quad(bottom=0, top='count', left='left', right='right', source=arr_src,
           fill_color='red', line_color='black')

    # Add style to the plot
    styled_p = style(p)

    # Add a hover tool referring to the formatted columns
    hover = HoverTool(tooltips = [('Delay', '@f_interval'),
                                  ('Count', '@f_count'),
                                  ('Image', '@images')])

    # src="file://@images" height="200" alt="@imgs" width="200"
    #file://
    hover = HoverTool(tooltips ="""
            <div>
                <div>
                    <img
                        src="file://@images" alt="@imgs" 
                        style="float: left; margin: 0px 15px 15px 0px;"
                        border="2"
                    ></img>
                </div>
                <div>
                    <span style="font-size: 15px;">@f_count @f_interval</span>
                    <span style="font-size: 10px; color: #696;">($x, $y)</span>
                </div>
            """)


    # Add the hover tool to the graph
    styled_p.add_tools(hover)

    show(p)

    return p

При запуске сервера через bokeh serve --show script.py изображения не отображаются даже с абсолютными путями.Точно так же я пробовал различные способы записи относительного пути при запуске его в качестве сервера.

Ответы [ 2 ]

0 голосов
/ 20 августа 2019

Я только что столкнулся с той же проблемой.Для меня работает использование относительных путей (файлы изображений находятся в том же каталоге, что и сгенерированный HTML, поэтому я просто предоставляю имена файлов) и заменяю src="file://@images" на src="@images".

0 голосов
/ 22 октября 2018

Это не может работать.Браузеры не будут загружать file:// URL-адреса со страниц, которые были загружены через HTTP.Для этого файлы изображений должны будут обслуживаться с реального веб-сервера и загружаться через http:// URL-адреса.

...