Embeddings / app.py
de-Rodrigo's picture
Bokeh Native Functionality in Strimlit
1280fd8
raw
history blame
1.18 kB
# Ejemplo usando st.bokeh_chart en lugar de st.components.v1.html
from bokeh.plotting import figure
from bokeh.models import ColumnDataSource, HoverTool
import streamlit as st
import numpy as np
import random
# Generar datos
N = 10
x = np.random.rand(N)
y = np.random.rand(N)
red_image = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mP8z8BQDwAF/wK+bNykAAAAAElFTkSuQmCC"
blue_image = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mN8/f8/AwAI/AL+fB/9AAAAAElFTkSuQmCC"
images = [random.choice([red_image, blue_image]) for _ in range(N)]
labels = ["subset1" if img == red_image else "subset2" for img in images]
source = ColumnDataSource(data=dict(x=x, y=y, img=images, label=labels))
p = figure(title="Interactive Plot with Hover Images", tools="hover", width=600, height=600)
p.scatter('x', 'y', size=15, source=source, fill_color="navy", alpha=0.5)
hover = p.select_one(HoverTool)
hover.tooltips = """
<div>
<div>
<span style="font-size: 12px; font-weight: bold;">Label: @label</span>
</div>
<div>
<img src="@img" alt="Image" style="width:100px;"/>
</div>
</div>
"""
st.bokeh_chart(p)