Plotly,streamlit:如何保持全屏视图

Posted

技术标签:

【中文标题】Plotly,streamlit:如何保持全屏视图【英文标题】:Plotly, streamlit: how to keep the fullscreen view 【发布时间】:2021-10-25 20:04:51 【问题描述】:

我正在构建有关全球疫苗接种率的等值线图。为了使用顺序颜色进行绘图,我使用Plotly 绘制地图,并使用streamlit 使用Python 在网页上渲染地图。但是地图太小了,我试过fig.update_layout()调整大小,但是地图没有居中。工具栏上的“全屏查看”正好解决了我的问题,因为它居中并且始终适合屏幕。那么,有没有办法让它全屏显示呢?

这是我的代码:

import streamlit as st
import pandas as pd
import plotly.express as px

vaccination_data = pd.read_csv('vaccinations.csv')
df = pd.DataFrame(vaccination_data)

def vaccination_lastest_date_by_country(df):
  return df.groupby('location').last().reset_index()

country_lastest_vaccination = vaccination_lastest_date_by_country(df)

df_vaccination_by_country = country_lastest_vaccination.sort_values(by='total_vaccinations_per_hundred', ascending=True)

fig = px.choropleth(df_vaccination_by_country, locations="iso_code",
                    color="total_vaccinations_per_hundred", 
                    hover_name="location",
                    color_continuous_scale=px.colors.sequential.Plasma) # should be able to adjust the color

fig.update_layout(autosize=False, width= 1200, height=800) # map not centered

st.plotly_chart(fig)

数据公开:https://github.com/owid/covid-19-data/blob/master/public/data/vaccinations/README.md

【问题讨论】:

试试st.plotly_chart(fig,height=800) 【参考方案1】:

我设法使用@Pluviophile 评论、use_container_width=Truest.set_page_config(layout="wide") 使其工作。我确实使用了chloropleth examples 之一来获取要显示的数据。

fig.update_layout(title_text="title", margin="r": 0, "t": 0, "l": 0, "b": 0, height=800)
st.plotly_chart(fig, use_container_width=True)

整个代码如下:

import json
from urllib.request import urlopen

import pandas as pd
import streamlit as st
import plotly.express as px


st.set_page_config(
    layout="wide",
)

with urlopen(
    "https://raw.githubusercontent.com/plotly/datasets/master/geojson-counties-fips.json"
) as response:
    counties = json.load(response)


df = pd.read_csv(
    "https://raw.githubusercontent.com/plotly/datasets/master/fips-unemp-16.csv",
    dtype="fips": str,
)


fig = px.choropleth(
    df,
    geojson=counties,
    locations="fips",
    color="unemp",
    color_continuous_scale="Viridis",
    range_color=(0, 12),
    scope="usa",
    labels="unemp": "unemployment rate",
)
fig.update_layout(title_text="title", margin="r": 0, "t": 0, "l": 0, "b": 0, height=800)
st.plotly_chart(fig, use_container_width=True)

【讨论】:

以上是关于Plotly,streamlit:如何保持全屏视图的主要内容,如果未能解决你的问题,请参考以下文章

如何使用python在streamlit和plotly中创建列?

如何让 Plotly 根据 Streamlit 应用程序中的屏幕分辨率调整绘图大小?

Python数据分析师使用低代码Streamlit实现Web数据可视化方法——Plotly可视化基础篇

如何在 streamlit 上按周期分组绘制图表?

如何制作 Plotly Indicator 仪表的网格?

全屏视频后iOS状态栏保持横向