在现有图形上添加一个没有 y 轴值的点（标记）

Question

I have a graph of my stocks portflio over some period of time, which looks like this:

I have a price for every 5 minutes of time, so x data is timestamps and y data is just numbers.

I also have a dataframe with times of operations, which contains a time of operation and its type (bought or sold) and looks like this:

I want to add a dot or some kind of a marker for every operation on my graph, but i don't know how to do this, I don't have y-values for it. And timestamps x-values are different from operations x-values, so i can't just take y-values from an existing graph. This is how I imagine it ideally, but for starters i just want to understand how to add my points on the graph:

. I'm using plotly, but i don't care if the solution requries matplotlib or anything else.

Answer 1

This is definitely doable in Plotly using annotations . There don't have to be y-values for the operations DataFrame because you can use the corresponding y-value from the stock data at the operations x-values. To plot the red markers, you can plot the operations_df and set the marker attributes as you like.

Then you can loop through the operations_df and place an annotation on the scatterplot based on the date of the entry, and its corresponding y-value on the stocks portfolio. Here is an example with some made up data, so you may need to tweak this code for your DataFrames.

import numpy as np
import pandas as pd

import plotly.graph_objs as go

## create some random data
np.random.seed(42)

df = pd.DataFrame(
  data=500*np.random.randint(0,1000,24), 
  columns=['price'], 
  index=pd.date_range(start='12/1/2020', end='12/1/2020 23:00:00', freq='H')
)

operations_df = pd.DataFrame(
  data=['Buy','Sell','Buy'], 
  columns=['Operation_type'], 
  index=pd.to_datetime(['12/1/2020 08:00:00', '12/1/2020 12:00:00', '12/1/2020 16:00:00'])
)

fig = go.Figure(data=[go.Scatter(
  x=df.index,
  y=df.price
  )])

fig.add_trace(go.Scatter(
  x=operations_df.index,
  y=[df.loc[date, 'price'] for date in operations_df.index],
  mode='markers',
  marker=dict(
    size=16,
    color="red")
  ))

for date, row in operations_df.iterrows():
  # print(date, df.loc[date, 'price'], row['Operation_type'])
  fig.add_annotation(
    x=pd.to_datetime(date),
    y=df.loc[date, 'price'],
    xref="x",
    yref="y",
    font=dict(
      size=16,
      color="red"
      ),
    text=row['Operation_type'],
    bordercolor="red",
    width=80,
    height=60,
    arrowcolor="red",
    ax=0,
    ay=-150
    )

fig.update_layout(showlegend=False)

fig.show()