Streamlit パートの書き込みとテキスト要素

王林
リリース: 2024-09-06 06:02:01
オリジナル
459 人が閲覧しました

Streamlit Part Write and Text Elements

Getting Started with Streamlit: A Beginner's Guide

Code can be found here: GitHub - jamesbmour/blog_tutorials:

Video version of blog can be found here: https://youtu.be/EQcqNW7Nw7M

Introduction

Streamlit is an open-source app framework that allows you to create beautiful, interactive web applications with minimal effort. If you’re a data scientist, machine learning engineer, or anyone working with data, Streamlit is the perfect tool to turn your Python scripts into interactive apps quickly. In this tutorial, we will dive into the basics of Streamlit by exploring some of its powerful features, such as st.write(), magic commands, and text elements.

Let’s get started by building a simple app to demonstrate these functionalities!

Setting Up Your Streamlit Environment

Before we jump into the code, make sure you have Streamlit installed. If you haven't installed it yet, you can do so with the following command:

pip install streamlit
ログイン後にコピー

Now, let’s start coding our first Streamlit app.

Building Your First Streamlit App

1. Adding a Title to Your App

Streamlit makes it incredibly easy to add titles and headings to your app. The st.title() function allows you to display a large title at the top of your application, which serves as the main heading.

import streamlit as st

st.title("Introduction to Streamlit: Part 1")

ログイン後にコピー

This will display a large, bold title at the top of your app.

Streamlit Write Elements

Using st.write() for Versatile Output

The st.write() function is one of the most versatile functions in Streamlit. You can use it to display almost anything, including text, data frames, charts, and more—all with a single line of code.

Displaying a DataFrame

Let's start by displaying a simple DataFrame using st.write().

import pandas as pd

df = pd.DataFrame({
    "Column 1": [1, 2, 3, 4],
    "Column 2": [10, 20, 30, 40]
})

st.write("DataFrame using st.write() function")
st.write(df)

ログイン後にコピー

This code creates a DataFrame with two columns and displays it directly in your app. The beauty of st.write() is that it automatically formats the DataFrame into a neat table, complete with scroll bars if needed.

Displaying Markdown Text

Another cool feature of st.write() is its ability to render Markdown text. This allows you to add formatted text, such as headers, subheaders, and paragraphs, with ease.

markdown_txt = (
    "### This is a Markdown Header\\n"
    "#### This is a Markdown Subheader\\n"
    "This is a Markdown paragraph.\\n"
)
st.write(markdown_txt)

ログイン後にコピー

With just a few lines of code, you can add rich text to your app.

Streaming Data with st.write_stream()

Streamlit also allows you to stream data to your app in real-time using the st.write_stream() function. This is particularly useful for displaying data that updates over time, such as sensor readings or live analytics.

import time

st.write("## Streaming Data using st.write_stream() function")
stream_btn = st.button("Click Button to Stream Data")

TEXT = """
# Stream a generator, iterable, or stream-like sequence to the app.
"""

def stream_data(txt="Hello, World!"):
    for word in txt.split(" "):
        yield word + " "
        time.sleep(0.01)

if stream_btn:
    st.write_stream(stream_data(TEXT))

ログイン後にコピー

In this example, when the button is clicked, the app will start streaming data word by word from the TEXT string, simulating real-time data updates.

Streamlit Text Elements

In addition to data streaming, Streamlit provides several text elements to enhance the presentation of your app.

Headers and Subheaders

You can easily add headers and subheaders using st.header() and st.subheader():

st.header("This is a Header")
st.subheader("This is a Subheader")

ログイン後にコピー

These functions help structure your content, making your app more organized and visually appealing.

Captions

Captions are useful for adding small notes or explanations. You can add them using st.caption():

st.caption("This is a caption")

ログイン後にコピー

Displaying Code

If you want to display code snippets in your app, you can use st.code():

code_txt = """
import pandas as pd
import streamlit as st

st.title("Streamlit Tutorials")
for i in range(10):
    st.write(i)
"""
st.code(code_txt)

ログイン後にコピー

This will display the code in a nicely formatted, syntax-highlighted block.

Displaying Mathematical Expressions

For those who need to include mathematical equations, Streamlit supports LaTeX:

st.latex(r"e = mc^2")
st.latex(r"\\int_a^b x^2 dx")

ログイン後にコピー

These commands will render LaTeX equations directly in your app.

Adding Dividers

To separate different sections of your app, you can use st.divider():

st.write("This is some text below the divider.")
st.divider()
st.write("This is some other text below the divider.")

ログイン後にコピー

Dividers add a horizontal line between sections, helping to break up the content visually.

Conclusion

In this introductory tutorial, we covered the basics of Streamlit, including how to use st.write() to display data and text, and how to stream data using st.write_stream(). We also explored various text elements to enhance the structure and readability of your app.

Streamlit makes it incredibly easy to create interactive web applications with just a few lines of code. Whether you're building dashboards, data exploration tools, or any other data-driven app, Streamlit provides the tools you need to get started quickly.

In the next tutorial, we’ll dive deeper into widgets and interactivity features in Streamlit. Stay tuned!

如果您发现本教程有帮助,请不要忘记分享并订阅更多内容。下一篇文章见!

如果您想支持我的写作或请我喝杯啤酒:https://buymeacoffee.com/bmours

以上がStreamlit パートの書き込みとテキスト要素の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:dev.to
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート