Bokeh: X-axis Date format and Candle Stick graph Hover Date issues

1.3k Views Asked by At

I am new to Stackoverflow and I am trying to build a Candle stick Chart using Bokeh from python. I understand that there is a sample code in the Bokeh doc. I have tried to use the sample code and rebuild my graph. I have pasted my code below with arbitrary data for simplicity.

I have the following questions:

  1. How do we format the graph to have YYYY-MM-DD on the x-scale
  2. Can someone explain the W formula. I know we are getting half of day in m second. But Why ?
  3. When the code is executed, the date for the hover for y axis does not display for doji chart (ie meaning when open and close are the same). (this could be bcos there is no vbar) But How do we overcome it ?

Appreciate if someone can help :) enter image description here My code below:

import pandas as pd 
  
# intialise data of lists. 
data = {'Date':['2020-10-10', '2020-10-09', '2020-10-08', '2020-10-07', '2020-10-06', '2020-10-05', '2020-10-04', '2020-10-03'], 
        'open':[20, 21, 19, 18, 30, 10, 15, 18 ], 
        'high':[25, 28, 24, 20, 40, 10, 19, 18 ], 
        'low':[18, 20, 19, 15, 20, 10, 12, 18 ], 
        'close':[32, 18, 15, 20, 30, 15, 8, 20 ] } 
  
# Create DataFrame 
df = pd.DataFrame(data) 

df['Date2']   = pd.to_datetime(df['Date'], errors='coerce')

##graph below 
from math import pi
from bokeh.plotting import figure, output_file, show
from bokeh.models import ColumnDataSource, NumeralTickFormatter, HoverTool, DaysTicker, DatetimeTickFormatter

inc = df.close > df.open
dec = df.open > df.close
w = 12*60*60*1000 # half day in ms

TOOLS = "pan,wheel_zoom,box_zoom,reset,save"

p = figure(x_axis_type="datetime", tools=TOOLS )

# 1 Pls help how do we code YYYY-MM-DD on the x-scale ? 
p.xaxis.formatter=DatetimeTickFormatter(months = ['%m/%Y', '%b %Y'], years = ['%Y'])

p.xaxis.major_label_orientation = pi/4
p.grid.grid_line_alpha=0.8

# 2 Pls help on explaining the w
p.segment(df.Date2, df.high, df.Date2, df.low, color="black")
p.vbar(df.Date2[inc], w, df.open[inc], df.close[inc], fill_color="#D5E1DD", line_color="black")
p.vbar(df.Date2[dec], w, df.open[dec], df.close[dec], fill_color="#F2583E", line_color="black")

# 3 Pls help on the Hover tool, why single line do not have date displayed, how to we overcome it?
hover_tool = HoverTool(tooltips=[('Date',"@x{%Y-%m-%d}"), ('Close','$y')],
                       formatters={"@x": 'datetime'},)

p.add_tools(hover_tool)

show(p)  # open a browser
1

There are 1 best solutions below

0
On BEST ANSWER
  1. Add days=['%Y-%m-%d'] to the DatetimeTickFormatter constructor. All the formats are documented here
  2. The candles are a day apart in the data. Making their width half a day just creates some space between them
  3. The code creates implicit data sources for each renderer separately. The columns in those implicit data sources are named after the arguments in the renderers. vbar has the x argument, so its data source has such column. But segment has x0 and x1, so the data source doesn't have the x column and the hover tool doesn't know where to get the data from for the @x field. Ideally, you should create the data sources yourself with the desired columns and provide them along with the column names to the renderers. More details with lots of examples are in this documentation section: https://docs.bokeh.org/en/latest/docs/user_guide/data.html

A small note - you're showing $y as Close, but that's not correct. It's just a coordinate, not the actual "Close" value. When you start using data sources, you will be able to specify the right column name.