サイトアイコン アマチュア無線局JS2IIU

Panel応用編 第5回: ライブデータによるダッシュボードの構築

JS2IIU

こんにちは、JS2IIUです。Panelでどんなことが出来るのか、事例を交えて紹介しています。今回は応用編第5回です。よろしくお願いします。

はじめに

リアルタイムで更新されるデータを可視化するダッシュボードは、株価モニタリング、IoTデバイスの監視、天気データのトラッキングなど、多くの用途に使われます。Panelを使うと、APIやWebSocket、データベースなどからのライブデータを簡単に統合し、リアルタイムダッシュボードを構築することができます。本記事では、APIから取得したデータやWebSocketを利用したライブデータのダッシュボードを構築する方法を解説します。

ライブデータの基本: APIを利用したデータの取得

まずは、シンプルなAPIからデータを定期的に取得し、そのデータをPanelで可視化する例を見ていきましょう。今回は、例として架空の株価APIからデータを取得し、リアルタイムに更新されるグラフを表示します。サービスが異なっても基本的にこのようなスタイルで対応できるはずです。

import panel as pn
import holoviews as hv
import requests
import time
import pandas as pd

pn.extension('holoviews')

# データ取得用の関数
def get_stock_data():
    # 例: 架空のAPIからデータを取得
    response = requests.get("https://api.example.com/stock_prices")
    data = response.json()
    df = pd.DataFrame(data)
    return df

# 初期データ
df = get_stock_data()

# 初期プロット
curve = hv.Curve((df['time'], df['price']), 'Time', 'Price')

# Panelのコンポーネントとして設定
pane = pn.pane.HoloViews(curve, sizing_mode='stretch_width')

# 定期的にデータを更新する関数
def update_data():
    global df, curve
    df = get_stock_data()
    curve = hv.Curve((df['time'], df['price']), 'Time', 'Price')
    pane.object = curve

# 1分ごとにデータを更新
pn.state.add_periodic_callback(update_data, 60000)

# Panelレイアウトの表示
pn.Column(pane).show()

これにより、APIから1分ごとに最新のデータを取得し、それをリアルタイムで表示するダッシュボードが完成します。

pandas-datareaderを使った例

以下は、pandas-datareaderを使用してYahoo Financeからリアルタイムの株価データを取得し、Panelを使って定期的に更新されるグラフを表示するコードに修正した例です。pandas-datareaderはインストールが必要です。

pip install pandas-datareader

import panel as pn
import holoviews as hv
import pandas_datareader.data as web
import pandas as pd
import datetime

pn.extension('holoviews')

# データ取得用の関数
def get_stock_data():
    end = datetime.datetime.now()
    start = end - datetime.timedelta(days=30)  # 過去30日間のデータを取得
    df = web.DataReader('AAPL', 'yahoo', start, end)  # Appleの株価データを取得
    df.reset_index(inplace=True)
    return df

# 初期データ
df = get_stock_data()

# 初期プロット
curve = hv.Curve((df['Date'], df['Close']), 'Date', 'Close Price')

# Panelのコンポーネントとして設定
pane = pn.pane.HoloViews(curve, sizing_mode='stretch_width')

# 定期的にデータを更新する関数
def update_data():
    global df, curve
    df = get_stock_data()
    curve = hv.Curve((df['Date'], df['Close']), 'Date', 'Close Price')
    pane.object = curve

# 1分ごとにデータを更新
pn.state.add_periodic_callback(update_data, 60000)

# Panelレイアウトの表示
pn.Column(pane).show()

説明

  1. pandas-datareader: Yahoo Financeから株価データを取得するためにpandas_datareader.dataモジュールを使用します。この例では、Apple（AAPL）の株価データを取得します。
  2. get_stock_data関数: 過去30日間のデータを取得し、データフレームに変換して返します。
  3. update_data関数: 1分ごとに新しいデータを取得し、グラフを更新します。
  4. リアルタイム更新: pn.state.add_periodic_callbackを使い、1分ごとにデータが更新されるように設定しています。

このコードを実行すると、Appleの株価がリアルタイムで更新されて表示されます。

pandas-datareader — pandas-datareader 0.10.0 documentation
pandas-datareader.readthedocs.io

WebSocketを利用したリアルタイムデータの可視化

次に、WebSocketを利用してリアルタイムにデータを受信し、ダッシュボードに反映する方法を紹介します。WebSocketを使うことで、データの即時更新が可能になります。

以下は、WebSocketから株価データを受信し、リアルタイムでグラフを更新する例です。

import panel as pn
import holoviews as hv
import asyncio
import websockets
import json
import pandas as pd

pn.extension('holoviews')

# 初期データの準備
df = pd.DataFrame(columns=['time', 'price'])
curve = hv.Curve((df['time'], df['price']), 'Time', 'Price')
pane = pn.pane.HoloViews(curve, sizing_mode='stretch_width')

# WebSocketからデータを受信する非同期関数
async def update_from_websocket():
    global df, curve
    async with websockets.connect("wss://example.com/live-stock") as websocket:
        while True:
            data = await websocket.recv()
            json_data = json.loads(data)
            new_data = {'time': json_data['time'], 'price': json_data['price']}
            df = df.append(new_data, ignore_index=True)
            curve = hv.Curve((df['time'], df['price']), 'Time', 'Price')
            pane.object = curve

# 非同期処理を実行するためのスレッドの起動
loop = asyncio.get_event_loop()
loop.create_task(update_from_websocket())

# Panelレイアウトの表示
pn.Column(pane).show()

リアルタイムデータの管理: キャッシュとパフォーマンス

ライブデータを扱うダッシュボードでは、データの量が増えるにつれてパフォーマンスの問題が発生する可能性があります。Panelは、@pn.cacheや@pn.stateを使ってデータのキャッシュや効率的な更新をサポートしています。

次に、リアルタイムデータを一定量に制限して、パフォーマンスを最適化する例を紹介します。

import panel as pn
import holoviews as hv
import pandas as pd

pn.extension('holoviews')

# 最大データ数を設定
MAX_DATA_POINTS = 100

# 初期データ
df = pd.DataFrame(columns=['time', 'price'])
curve = hv.Curve((df['time'], df['price']), 'Time', 'Price')
pane = pn.pane.HoloViews(curve, sizing_mode='stretch_width')

# 新しいデータを追加しつつ、古いデータを削除
def update_data(new_time, new_price):
    global df, curve
    new_data = {'time': new_time, 'price': new_price}
    df = df.append(new_data, ignore_index=True)

    # データ数が多すぎる場合、古いデータを削除
    if len(df) > MAX_DATA_POINTS:
        df = df.iloc[-MAX_DATA_POINTS:]

    curve = hv.Curve((df['time'], df['price']), 'Time', 'Price')
    pane.object = curve

# データの更新を模倣
def simulate_data():
    import random
    from datetime import datetime
    while True:
        new_time = datetime.now()
        new_price = random.uniform(100, 200)
        update_data(new_time, new_price)

# Panelレイアウトの表示
pn.state.add_periodic_callback(simulate_data, 1000)
pn.Column(pane).show()

これにより、ライブデータが増加しても、古いデータが適切に削除され、ダッシュボードのパフォーマンスを維持できます。

まとめ

ライブデータを使ったダッシュボードの構築は、PanelとHoloViewsを使えば非常に簡単に実現できます。APIやWebSocketからデータを取得し、リアルタイムで更新するインターフェースを構築することで、データ監視や解析に役立つダッシュボードを作成できます。また、パフォーマンスを考慮したデータ管理も重要です。

次回は、Panelにおける認証とセキュリティの実装について解説します。お楽しみに！

補足：株価情報APIサービス

以下は、株価情報を提供する主なAPIサービスの特徴を、まとめたものです。具体的なAPIの使い方、詳細についてはそれぞれのサービスのリンク先を参照して下さい。

1. IEX Cloud

2. Tiingo

Stock Market Tools | Tiingo
A financial research platform dedicated to creating innovative financial tools for all, while adopting the motto, "Actively Do Good."
www.tiingo.com

3. Yfinance (Yahoo Finance)

GitHub - ranaroussi/yfinance: Download market data from Yahoo! Finance's API
Download market data from Yahoo! Finance's API. Contribute to ranaroussi/yfinance development by creating an account on GitHub.
github.com

4. pandas-datareader

pandas-datareader — pandas-datareader 0.10.0 documentation
pandas-datareader.readthedocs.io

5. Alpha Vantage

Free Stock APIs in JSON & Excel | Alpha Vantage
Alpha Vantage offers free stock APIs in JSON and CSV formats for realtime and historical stock market data, options, forex, commodity, cryptocurrency ...
www.alphavantage.co

6. Nasdaq Data Link (旧Quandl)

Nasdaq Data Link
The source for financial, economic, and alternative datasets, serving investment professionals.
data.nasdaq.com

各APIは異なる強みを持っており、必要なデータの種類やレート制限を考慮しながら最適なものを選ぶことが重要です。

モバイルバージョンを終了