{"spec_id":"depth-order-book","library":"bokeh","language":"python","code":"\"\"\" anyplot.ai\ndepth-order-book: Order Book Depth Chart\nLibrary: bokeh 3.9.1 | Python 3.13.13\nQuality: 90/100 | Created: 2026-06-15\n\"\"\"\n\nimport os\nimport sys\n\n\n# Prevent self-import: this file is named bokeh.py, which shadows the installed\n# bokeh package when its directory sits at the front of sys.path.\n_this_dir = os.path.dirname(os.path.abspath(__file__))\nsys.path = [p for p in sys.path if os.path.abspath(p or \".\") != _this_dir]\n\nimport time\nfrom pathlib import Path\n\nimport numpy as np\nfrom bokeh.io import output_file, save\nfrom bokeh.models import BoxAnnotation, Label, NumeralTickFormatter, Range1d, Span\nfrom bokeh.plotting import figure\nfrom selenium import webdriver\nfrom selenium.webdriver.chrome.options import Options\n\n\n# Theme\nTHEME = os.getenv(\"ANYPLOT_THEME\", \"light\")\nPAGE_BG = \"#FAF8F1\" if THEME == \"light\" else \"#1A1A17\"\nELEVATED_BG = \"#FFFDF6\" if THEME == \"light\" else \"#242420\"\nINK = \"#1A1A17\" if THEME == \"light\" else \"#F0EFE8\"\nINK_SOFT = \"#4A4A44\" if THEME == \"light\" else \"#B8B7B0\"\nINK_MUTED = \"#6B6A63\" if THEME == \"light\" else \"#A8A79F\"\n\n# Semantic colors — bid=green (buy/support), ask=red (sell/resistance)\nBID_COLOR = \"#009E73\"  # Imprint position 1\nASK_COLOR = \"#AE3030\"  # Imprint position 5, semantic anchor for sell/loss\n\n# Data — BTC/USD snapshot, 50 levels per side, $1 tick increments\nnp.random.seed(42)\nmid_price = 60_000.0\nspread = 12.0\nn_levels = 50\n\nbid_prices = mid_price - spread / 2 - np.arange(n_levels)\nask_prices = mid_price + spread / 2 + np.arange(n_levels)\n\n# Volume grows away from mid price (deeper liquidity at worse prices)\nbid_qty = 0.05 + np.arange(1, n_levels + 1) * 0.15 + np.random.exponential(0.3, n_levels)\nask_qty = 0.05 + np.arange(1, n_levels + 1) * 0.15 + np.random.exponential(0.3, n_levels)\n\n# Liquidity walls at specific levels\nbid_qty[15] += 8.0\nbid_qty[30] += 5.0\nask_qty[12] += 7.5\nask_qty[28] += 4.0\n\ncum_bid = np.cumsum(bid_qty)\ncum_ask = np.cumsum(ask_qty)\nmax_cum = max(cum_bid[-1], cum_ask[-1])\n\n# Build bid step polygon (prices decrease from best bid outward)\nx_bid_poly = [bid_prices[0]]\ny_bid_poly = [0.0]\nfor i in range(n_levels):\n    x_bid_poly.append(bid_prices[i])\n    y_bid_poly.append(cum_bid[i])\n    if i < n_levels - 1:\n        x_bid_poly.append(bid_prices[i + 1])\n        y_bid_poly.append(cum_bid[i])\nx_bid_poly.append(bid_prices[-1])\ny_bid_poly.append(0.0)\n\n# Build ask step polygon (prices increase from best ask outward)\nx_ask_poly = [ask_prices[0]]\ny_ask_poly = [0.0]\nfor i in range(n_levels):\n    x_ask_poly.append(ask_prices[i])\n    y_ask_poly.append(cum_ask[i])\n    if i < n_levels - 1:\n        x_ask_poly.append(ask_prices[i + 1])\n        y_ask_poly.append(cum_ask[i])\nx_ask_poly.append(ask_prices[-1])\ny_ask_poly.append(0.0)\n\n# Title — scaled for length\ntitle = \"BTC/USD Order Book Depth · depth-order-book · python · bokeh · anyplot.ai\"\nn_chars = len(title)\ntitle_fontsize = f\"{max(34, round(50 * 67 / n_chars))}pt\"\n\n# Figure\np = figure(\n    width=3200,\n    height=1800,\n    title=title,\n    x_axis_label=\"Price (USD)\",\n    y_axis_label=\"Cumulative Volume (BTC)\",\n    toolbar_location=None,\n    x_range=Range1d(bid_prices[-1] - 6, ask_prices[-1] + 6),\n    y_range=Range1d(0, max_cum * 1.12),\n    min_border_bottom=160,\n    min_border_left=180,\n    min_border_top=110,\n    min_border_right=60,\n)\n\n# Bid fill + staircase outline\np.patch(x=x_bid_poly, y=y_bid_poly, fill_color=BID_COLOR, fill_alpha=0.25, line_color=None)\np.line(x=x_bid_poly[:-1], y=y_bid_poly[:-1], line_color=BID_COLOR, line_width=3.5, line_alpha=0.95)\n\n# Ask fill + staircase outline\np.patch(x=x_ask_poly, y=y_ask_poly, fill_color=ASK_COLOR, fill_alpha=0.25, line_color=None)\np.line(x=x_ask_poly[:-1], y=y_ask_poly[:-1], line_color=ASK_COLOR, line_width=3.5, line_alpha=0.95)\n\n# Spread gap highlight — BoxAnnotation covers the bid-ask spread region\np.add_layout(\n    BoxAnnotation(left=bid_prices[0], right=ask_prices[0], fill_color=INK_MUTED, fill_alpha=0.07, line_color=None)\n)\n\n# Mid price dashed vertical line\np.add_layout(\n    Span(\n        location=mid_price, dimension=\"height\", line_color=INK_SOFT, line_dash=\"dashed\", line_width=2.5, line_alpha=0.65\n    )\n)\n\n# Mid price and spread annotations — secondary info uses smaller text for hierarchy\np.add_layout(\n    Label(\n        x=mid_price + 2.0,\n        y=max_cum * 0.88,\n        text=f\"Mid: ${mid_price:,.0f}\",\n        text_font_size=\"22pt\",\n        text_color=INK_SOFT,\n        text_align=\"left\",\n        background_fill_color=None,\n    )\n)\np.add_layout(\n    Label(\n        x=mid_price + 2.0,\n        y=max_cum * 0.78,\n        text=f\"Spread: ${spread:.0f}\",\n        text_font_size=\"20pt\",\n        text_color=INK_MUTED,\n        text_align=\"left\",\n        background_fill_color=None,\n    )\n)\n\n# Side labels — direct labeling on each curve at the midpoint\np.add_layout(\n    Label(\n        x=bid_prices[22],\n        y=cum_bid[22] + max_cum * 0.05,\n        text=\"Bids\",\n        text_font_size=\"42pt\",\n        text_color=BID_COLOR,\n        text_align=\"center\",\n        text_font_style=\"bold\",\n        background_fill_color=None,\n    )\n)\np.add_layout(\n    Label(\n        x=ask_prices[22],\n        y=cum_ask[22] + max_cum * 0.05,\n        text=\"Asks\",\n        text_font_size=\"42pt\",\n        text_color=ASK_COLOR,\n        text_align=\"center\",\n        text_font_style=\"bold\",\n        background_fill_color=None,\n    )\n)\n\n# Theme chrome\np.background_fill_color = PAGE_BG\np.border_fill_color = PAGE_BG\np.outline_line_color = None\n\np.title.text_color = INK\np.title.text_font_size = title_fontsize\np.title.text_font_style = \"bold\"\n\np.xaxis.axis_label_text_color = INK\np.yaxis.axis_label_text_color = INK\np.xaxis.axis_label_text_font_size = \"42pt\"\np.yaxis.axis_label_text_font_size = \"42pt\"\np.xaxis.major_label_text_color = INK_SOFT\np.yaxis.major_label_text_color = INK_SOFT\np.xaxis.major_label_text_font_size = \"34pt\"\np.yaxis.major_label_text_font_size = \"34pt\"\n# Remove all axis spine lines for a clean open look — data and tick labels provide structure\np.xaxis.axis_line_color = None\np.yaxis.axis_line_color = None\np.xaxis.major_tick_line_color = INK_SOFT\np.yaxis.major_tick_line_color = INK_SOFT\np.xaxis.minor_tick_line_color = None\np.yaxis.minor_tick_line_color = None\n\np.xgrid.grid_line_color = INK\np.ygrid.grid_line_color = INK\np.xgrid.grid_line_alpha = 0.15\np.ygrid.grid_line_alpha = 0.15\n\np.xaxis.formatter = NumeralTickFormatter(format=\"0,0\")\n\n# Save HTML artifact\noutput_file(f\"plot-{THEME}.html\")\nsave(p)\n\n# Screenshot via headless Chrome (Selenium)\nW, H = 3200, 1800\nopts = Options()\nfor arg in (\n    \"--headless=new\",\n    \"--no-sandbox\",\n    \"--disable-dev-shm-usage\",\n    \"--disable-gpu\",\n    f\"--window-size={W},{H}\",\n    \"--hide-scrollbars\",\n):\n    opts.add_argument(arg)\ndriver = webdriver.Chrome(options=opts)\n# CDP override forces an exact W×H viewport regardless of outer window chrome\ndriver.execute_cdp_cmd(\n    \"Emulation.setDeviceMetricsOverride\", {\"width\": W, \"height\": H, \"deviceScaleFactor\": 1, \"mobile\": False}\n)\ndriver.get(f\"file://{Path(f'plot-{THEME}.html').resolve()}\")\ntime.sleep(3)\ndriver.save_screenshot(f\"plot-{THEME}.png\")\ndriver.quit()\n"}