0

私は Web 開発の完全な初心者です。flaskmatplotlib を使用して pandas データフレームから複数行のグラフをプロットするアプリに取り組んでいましたが、 を介してデータ ポイントにツールチップを追加したいと考えていますmpld3。mpld3ツールチップの例は、散布図専用です。複数行のプロットでこれを行う方法は?

data = {'year': [2010, 2011, 2012, 2013, 2014, 2015, 2016,2017, 2018, 2019],
        'shop1': [10, 21, 20, 10, 23, 30, 31,45, 23, 56],
        'shop2': [10, 21, 20, 10, 12, 30, 78,45, 23, 56],
        'shop3': [10, 21, 20, 10, 34, 98, 31,45, 23, 56],}

df = pd.DataFrame(data)
df = df.set_index('year')
fig, ax = plt.subplots()
df.plot(ax=ax, marker='o')  
plt.grid(True)

mpld3.display()
4

1 に答える 1

-1

mpld3 がライン プロットのツールチップを提供しているようには見えないため、ポイント ツールチップを使用してライン プロットに適応させる必要があります。ここでの重要な観察は、ポイント ツールチップが matplotlib マーカーに依存していることです (こちらの説明を参照)。明らかに、多くの折れ線グラフではマーカーが必要ない場合があるため、以下の例ではマーカーの色をオフにしています。(私の例は、公式ドキュメントのポイント ツールチップの例の修正版です)

import matplotlib.pyplot as plt
import numpy as np
import pandas as pd
import mpld3
from mpld3 import plugins
import quandl


# Define some CSS to control our custom labels
css = """
table
{
  border-collapse: collapse;
}
th
{
  color: #ffffff;
  background-color: #000000;
}
td
{
  background-color: #cccccc;
}
table, th, td
{
  font-family:Arial, Helvetica, sans-serif;
  border: 1px solid black;
  text-align: right;
}
"""

fig, ax = plt.subplots()

df = quandl.get("YALE/SPCOMP")
ts = df['S&P Composite']

labels = []
for dt in ts.index:
    labels.append( str(dt) + '<br/>' + str(ts.loc[dt]))

lines = plt.plot(ts.index, ts.values, marker='o', ls='-', ms=5, markerfacecolor='None',markeredgecolor='None',)

ax.set_xlabel('x')
ax.set_ylabel('y')
ax.set_title('HTML tooltips', size=20)

tooltip = plugins.PointHTMLTooltip(lines[0], labels,
                                   voffset=10, hoffset=10, css=css)
plugins.connect(fig, tooltip)

mpld3.display()
于 2016-08-31T14:01:17.233 に答える