PINE LIBRARY
Scale
Scale Library v1 - The Ultimate UI Framework for Pine Script™
Construct. Visualize. Deploy.
📢 ABOUT
Scale is a comprehensive, open-source UI framework meticulously designed to simplify the creation of advanced visual scales, interactive progress bars, and complex dashboards in Pine Script™. It abstracts away the cumbersome and error-prone complexity of manual drawing (such as managing lines, labels, boxes, and calculations) into a clean, chainable, and highly intuitive method suite.
Whether you're building a simple RSI indicator, a dynamic MACD histogram, or a complex multi-metric trading dashboard, Scale handles the heavy lifting of:
• Auto-scaling: Intelligently calculates positions relative to bars or time, ensuring your UI elements are perfectly aligned regardless of chart zoom or resolution.
• Real-time updates: Flawlessly handles intra-bar price changes, providing smooth and accurate visualizations on every tick without flickering.
• Theming: Offers robust support for aesthetic customization, including smooth gradients, auto-coloring based on conditions, and custom branding.
• Responsive layout: Features granular padding, offset, and alignment controls so your visual components flexibly adapt to any chart environment.
✨ WHAT'S NEW IN v1
📛 Method Badges
Quickly identify method capabilities and execution context with visual badges:
• 🔵 method-primary — The core function required to initialize a specific feature or element.
• 🟣 chainable — Indicates the method returns the setup object itself, allowing for elegant, single-line method chaining (e.g., `scale.build().addMarker().show()`).
• 🟡 realtime — Specialized methods that update fluidly on every tick (realtime data), ideal for timers and loaders.
• 🔷 since-v6 — Leverages the latest Pine Script™ v6 features for maximum performance.
📊 Icon Reference Tables
No more guessing icon indices! Comprehensive tables are integrated directly into this documentation, showing every available icon for Markers, Rulers, Trends, and more.
🎯 Inline Examples
Every core module is accompanied by copy-paste ready examples, getting you from an empty script to a functioning UI in seconds.
🚀 QUICK START
1. Import the library
Bring the Scale framework into your script:
Pine Script®
2. Create a Theme (optional but recommended)
Define your aesthetic preferences early on:
Pine Script®
3. Build and Deploy
Create your scale, feed it data, and add components:
Pine Script®
🔧 CORE METHODS
build() 🔵 primary 🟣 chainable
The foundational engine that initializes your scale's model, view, and controller. It explicitly defines *what* data is visualized, *where* it is anchored on the chart, and the dimensional constraints.
Pine Script®
• `__theme` (theme) — Required: Theme object encapsulating your colors/styling.
• `_xOffset` (int) — Required: Horizontal offset relative to `bar_index` (can be historical or future bars).
• `_y` (float) — Required: Vertical y-coordinate anchor (price/value level).
• `_src` (float) — Required: The incoming source value to visualize (e.g., RSI, Stochastic, custom oscillator).
• `_length` (int) — Required: Mathematical lookback length for internal calculations and dynamic ranges.
• `_minValue` (float) — Required: Minimum baseline value of the scale (representing 0%).
• `_maxValue` (float) — Required: Maximum ceiling value of the scale (representing 100%).
• `_numBars` (int) — Default: 10: Total number of discrete segments or 'ticks' comprising the bar.
• `_barWidth` (int) — Default: 2: Visual width of each individual segment in chart bars.
• `_barHeight` (int) — Default: 5: Visual vertical thickness of the bar in pixels.
• `_prefill` (bool) — Default: true: Determines fill behavior (Left-to-Right progression vs Center-out Range).
• `_dynamic` (bool) — Default: false: If explicitly set to true, minimum and maximum values will auto-adapt to the source data's historical extremes.
show() / hide() 🟣 chainable
Conditionally control visibility. Highly effective for decluttering the chart based on specific market conditions, timeframes, or user toggles.
Pine Script®
🎨 ELEMENT METHODS
Modular add-ons that enhance the visual clarity and depth of your scale.
addLabel() 🔵 primary 🟣 chainable
Attaches a clean, customizable text label at specific anchor points relative to the scale geometry.
Pine Script®
addMarker() 🔵 primary 🟣 chainable
Places a precise symbol or shape exactly at the current value's interpolated position along the scale.
Pine Script®
📊 Marker Icon Table (_icon)
• 0: ▼ : ▲ | 5: ↧ : ↥ | 10: ⁝
• 1: ▽ : △ | 6: ⇟ : ⇞ | 11: ⋎ : ⋏
• 2: ▾ : ▴ | 7: ↓ : ↑ | 12: ⋁ : ⋀
• 3: ▿ : ▵ | 8: |
• 4: ⇣ : ⇡ | 9: ⁞
addMark() 🔵 primary 🟣 chainable
Injects a static structural mark at a specific numerical offset. Highly useful for visualizing thresholds, midlines, or historic support/resistance levels.
Pine Script®
📊 Mark Icon Table (_mark)
• 0: | | 4: ⁞
• 1: ¦ | 5: ⁝
• 2: ┼ | 6: ▼ : ▲
• 3: ≎ | 7: ▽ : △
addBadge() 🔵 primary 🟣 chainable
Generates a prominent text badge with a dedicated background block. Perfect for communicating state, establishing titles, or flagging status alerts.
Pine Script®
📈 INDICATOR METHODS
Sophisticated overlays for visualizing statistical data, volatility, and market structure directly alongside your scale.
addRuler() 🔵 primary 🟣 chainable
Deploys a structural background ruler complete with distinct start, center, and end markers, defining the scale's boundaries for better readability.
Pine Script®
📊 Ruler Icon Table (_icon)
• 0: ├ -┼- ┤ | 6: ╟ -╥- ╢
• 1: ├ -┴- ┤ | 7: ⥢ -≎- ⥤
• 2: ├ -┬- ┤ | 8: ⥏ -≏- ⥑
• 3: ╞ -╧- ╡ | 9: | - | - |
• 4: ╞ -╤- ╡ | 10: | - ¦ - |
• 5: ╟ -╨- ╢ | 11: ⁅ - ¦ - ⁆
addAvg() 🔵 primary 🟣 chainable
Computes and visually embeds a Simple Moving Average (SMA) of the incoming source data, allowing you to compare the current value to its historical mean.
Pine Script®
📊 Average Icon Table
*Text Icons (_textIcon)*: [0] ⌀, [1] Ø, [2] ∅
*Marker Icons (_markerIcon)*: Utilizes the Standard Marker Set (0-12, refer to addMarker)
addRange() 🔵 primary 🟣 chainable
Tracks and plots the Highest High and Lowest Low over a specified period, visually expressing volatility and market extremities relative to the scale limits.
Pine Script®
📊 Range Icon Table (_textIcon)
• 0: L - H | 5: ▼ : ▲
• 1: ⇊ - ⇈ | 6: ▽ : △
• 2: ↓ - ↑ | 7: ▾ : ▴
• 3: ⇣ - ⇡ | 8: ▿ : ▵
• 4: ↧ - ↥
addTrend() 🔵 primary 🟣 chainable
Calculates and projects a directional trend indicator (rising, falling, or neutral) derived from the source data's momentum profile.
Pine Script®
📊 Trend Icon Table (_icon)
• 0: ◀-|-▶ | 6: ⟪-|-⟫
• 1: ◁-|-▷ | 7: ↓-=-↑
• 2: <-±-> | 8: ⇊-=-⇈
• 3: ‹-±-› | 9: ↧-±-↥
• 4: «-±-» | 10: ⇣-±-⇡
• 5: ⟨-|-⟩
addAlert() 🔵 primary 🟣 chainable
Flags the exact position where a crossover or crossunder event occurs relative to a critical target level.
Note: This acts as an on-chart visual companion; you must still configure a backend TradingView alert system for notifications.
Pine Script®
⚡ ANIMATION & DECORATION
addTimer() 🟡 realtime 🟣 chainable
Embeds an active countdown timer tied to the current bar's close, updating continuously tick-by-tick.
Pine Script®
addLoader() 🟡 realtime 🟣 chainable
Attaches a kinetic spinning or loading animation that forces visual updates on every incoming tick, conveying active data processing to the user.
Pine Script®
📊 Loader Icon Table (_loaderIcon)
• 0: ◜-◝-◞-◟ | 4: ⨫-⨬
• 1: ◎-◉ | 5: ▰▱▱...
• 2: ⋮-⋰-⋯-⋱ | 6: ⊶⊷⊶⊷...
• 3: ≓-≒-≑
addDecoration() 🔵 primary 🟣 chainable
Caps your scale with polished decorative brackets or enclosing corners, framing the data and finalizing the professional aesthetic.
Pine Script®
📊 Decoration Icon Table (_decor)
• 0: ◤-◥ : ◣-◢ | 5: ⊢-⊣
• 1: ⌜-⌝ : ⌞-⌟ | 6: ◖-◗
• 2: ⌏-⌎ : ⌍-⌌ | 7: ⟦-⟧
• 3: ◜-◝ : ◟-◞ | 8: ⟪-⟫
• 4: ⊞-⊟ | 9: ⟨-⟩
📋 CHANGELOG
✅ Initial release of the Scale UI framework
✅ Implemented multi-element coordinate management
✅ Added dynamic scaling and formatting options
✅ Included comprehensive visual decorators
🙏 RELATED LIBRARIES
Check out ScaleValidator for robust input validation that can be used alongside this framework.
Also check out Motion for animating labels and colors dynamically!
Happy coding! 🚀
Made with ☕ by cryptolinx
Construct. Visualize. Deploy.
📢 ABOUT
Scale is a comprehensive, open-source UI framework meticulously designed to simplify the creation of advanced visual scales, interactive progress bars, and complex dashboards in Pine Script™. It abstracts away the cumbersome and error-prone complexity of manual drawing (such as managing lines, labels, boxes, and calculations) into a clean, chainable, and highly intuitive method suite.
Whether you're building a simple RSI indicator, a dynamic MACD histogram, or a complex multi-metric trading dashboard, Scale handles the heavy lifting of:
• Auto-scaling: Intelligently calculates positions relative to bars or time, ensuring your UI elements are perfectly aligned regardless of chart zoom or resolution.
• Real-time updates: Flawlessly handles intra-bar price changes, providing smooth and accurate visualizations on every tick without flickering.
• Theming: Offers robust support for aesthetic customization, including smooth gradients, auto-coloring based on conditions, and custom branding.
• Responsive layout: Features granular padding, offset, and alignment controls so your visual components flexibly adapt to any chart environment.
✨ WHAT'S NEW IN v1
📛 Method Badges
Quickly identify method capabilities and execution context with visual badges:
• 🔵 method-primary — The core function required to initialize a specific feature or element.
• 🟣 chainable — Indicates the method returns the setup object itself, allowing for elegant, single-line method chaining (e.g., `scale.build().addMarker().show()`).
• 🟡 realtime — Specialized methods that update fluidly on every tick (realtime data), ideal for timers and loaders.
• 🔷 since-v6 — Leverages the latest Pine Script™ v6 features for maximum performance.
📊 Icon Reference Tables
No more guessing icon indices! Comprehensive tables are integrated directly into this documentation, showing every available icon for Markers, Rulers, Trends, and more.
🎯 Inline Examples
Every core module is accompanied by copy-paste ready examples, getting you from an empty script to a functioning UI in seconds.
🚀 QUICK START
1. Import the library
Bring the Scale framework into your script:
2. Create a Theme (optional but recommended)
Define your aesthetic preferences early on:
3. Build and Deploy
Create your scale, feed it data, and add components:
🔧 CORE METHODS
build() 🔵 primary 🟣 chainable
The foundational engine that initializes your scale's model, view, and controller. It explicitly defines *what* data is visualized, *where* it is anchored on the chart, and the dimensional constraints.
• `__theme` (theme) — Required: Theme object encapsulating your colors/styling.
• `_xOffset` (int) — Required: Horizontal offset relative to `bar_index` (can be historical or future bars).
• `_y` (float) — Required: Vertical y-coordinate anchor (price/value level).
• `_src` (float) — Required: The incoming source value to visualize (e.g., RSI, Stochastic, custom oscillator).
• `_length` (int) — Required: Mathematical lookback length for internal calculations and dynamic ranges.
• `_minValue` (float) — Required: Minimum baseline value of the scale (representing 0%).
• `_maxValue` (float) — Required: Maximum ceiling value of the scale (representing 100%).
• `_numBars` (int) — Default: 10: Total number of discrete segments or 'ticks' comprising the bar.
• `_barWidth` (int) — Default: 2: Visual width of each individual segment in chart bars.
• `_barHeight` (int) — Default: 5: Visual vertical thickness of the bar in pixels.
• `_prefill` (bool) — Default: true: Determines fill behavior (Left-to-Right progression vs Center-out Range).
• `_dynamic` (bool) — Default: false: If explicitly set to true, minimum and maximum values will auto-adapt to the source data's historical extremes.
show() / hide() 🟣 chainable
Conditionally control visibility. Highly effective for decluttering the chart based on specific market conditions, timeframes, or user toggles.
🎨 ELEMENT METHODS
Modular add-ons that enhance the visual clarity and depth of your scale.
addLabel() 🔵 primary 🟣 chainable
Attaches a clean, customizable text label at specific anchor points relative to the scale geometry.
addMarker() 🔵 primary 🟣 chainable
Places a precise symbol or shape exactly at the current value's interpolated position along the scale.
📊 Marker Icon Table (_icon)
• 0: ▼ : ▲ | 5: ↧ : ↥ | 10: ⁝
• 1: ▽ : △ | 6: ⇟ : ⇞ | 11: ⋎ : ⋏
• 2: ▾ : ▴ | 7: ↓ : ↑ | 12: ⋁ : ⋀
• 3: ▿ : ▵ | 8: |
• 4: ⇣ : ⇡ | 9: ⁞
addMark() 🔵 primary 🟣 chainable
Injects a static structural mark at a specific numerical offset. Highly useful for visualizing thresholds, midlines, or historic support/resistance levels.
📊 Mark Icon Table (_mark)
• 0: | | 4: ⁞
• 1: ¦ | 5: ⁝
• 2: ┼ | 6: ▼ : ▲
• 3: ≎ | 7: ▽ : △
addBadge() 🔵 primary 🟣 chainable
Generates a prominent text badge with a dedicated background block. Perfect for communicating state, establishing titles, or flagging status alerts.
📈 INDICATOR METHODS
Sophisticated overlays for visualizing statistical data, volatility, and market structure directly alongside your scale.
addRuler() 🔵 primary 🟣 chainable
Deploys a structural background ruler complete with distinct start, center, and end markers, defining the scale's boundaries for better readability.
📊 Ruler Icon Table (_icon)
• 0: ├ -┼- ┤ | 6: ╟ -╥- ╢
• 1: ├ -┴- ┤ | 7: ⥢ -≎- ⥤
• 2: ├ -┬- ┤ | 8: ⥏ -≏- ⥑
• 3: ╞ -╧- ╡ | 9: | - | - |
• 4: ╞ -╤- ╡ | 10: | - ¦ - |
• 5: ╟ -╨- ╢ | 11: ⁅ - ¦ - ⁆
addAvg() 🔵 primary 🟣 chainable
Computes and visually embeds a Simple Moving Average (SMA) of the incoming source data, allowing you to compare the current value to its historical mean.
📊 Average Icon Table
*Text Icons (_textIcon)*: [0] ⌀, [1] Ø, [2] ∅
*Marker Icons (_markerIcon)*: Utilizes the Standard Marker Set (0-12, refer to addMarker)
addRange() 🔵 primary 🟣 chainable
Tracks and plots the Highest High and Lowest Low over a specified period, visually expressing volatility and market extremities relative to the scale limits.
📊 Range Icon Table (_textIcon)
• 0: L - H | 5: ▼ : ▲
• 1: ⇊ - ⇈ | 6: ▽ : △
• 2: ↓ - ↑ | 7: ▾ : ▴
• 3: ⇣ - ⇡ | 8: ▿ : ▵
• 4: ↧ - ↥
addTrend() 🔵 primary 🟣 chainable
Calculates and projects a directional trend indicator (rising, falling, or neutral) derived from the source data's momentum profile.
📊 Trend Icon Table (_icon)
• 0: ◀-|-▶ | 6: ⟪-|-⟫
• 1: ◁-|-▷ | 7: ↓-=-↑
• 2: <-±-> | 8: ⇊-=-⇈
• 3: ‹-±-› | 9: ↧-±-↥
• 4: «-±-» | 10: ⇣-±-⇡
• 5: ⟨-|-⟩
addAlert() 🔵 primary 🟣 chainable
Flags the exact position where a crossover or crossunder event occurs relative to a critical target level.
Note: This acts as an on-chart visual companion; you must still configure a backend TradingView alert system for notifications.
⚡ ANIMATION & DECORATION
addTimer() 🟡 realtime 🟣 chainable
Embeds an active countdown timer tied to the current bar's close, updating continuously tick-by-tick.
addLoader() 🟡 realtime 🟣 chainable
Attaches a kinetic spinning or loading animation that forces visual updates on every incoming tick, conveying active data processing to the user.
📊 Loader Icon Table (_loaderIcon)
• 0: ◜-◝-◞-◟ | 4: ⨫-⨬
• 1: ◎-◉ | 5: ▰▱▱...
• 2: ⋮-⋰-⋯-⋱ | 6: ⊶⊷⊶⊷...
• 3: ≓-≒-≑
addDecoration() 🔵 primary 🟣 chainable
Caps your scale with polished decorative brackets or enclosing corners, framing the data and finalizing the professional aesthetic.
📊 Decoration Icon Table (_decor)
• 0: ◤-◥ : ◣-◢ | 5: ⊢-⊣
• 1: ⌜-⌝ : ⌞-⌟ | 6: ◖-◗
• 2: ⌏-⌎ : ⌍-⌌ | 7: ⟦-⟧
• 3: ◜-◝ : ◟-◞ | 8: ⟪-⟫
• 4: ⊞-⊟ | 9: ⟨-⟩
📋 CHANGELOG
✅ Initial release of the Scale UI framework
✅ Implemented multi-element coordinate management
✅ Added dynamic scaling and formatting options
✅ Included comprehensive visual decorators
🙏 RELATED LIBRARIES
Check out ScaleValidator for robust input validation that can be used alongside this framework.
Also check out Motion for animating labels and colors dynamically!
Happy coding! 🚀
Made with ☕ by cryptolinx
Pine腳本庫
秉持TradingView一貫精神，作者已將此Pine代碼以開源函式庫形式發佈，方便我們社群中的其他Pine程式設計師重複使用。向作者致敬！您可以在私人專案或其他開源發表中使用此函式庫，但在公開發表中重用此代碼須遵守社群規範。
免責聲明
這些資訊和出版物並非旨在提供，也不構成TradingView提供或認可的任何形式的財務、投資、交易或其他類型的建議或推薦。請閱讀使用條款以了解更多資訊。
Pine腳本庫
秉持TradingView一貫精神，作者已將此Pine代碼以開源函式庫形式發佈，方便我們社群中的其他Pine程式設計師重複使用。向作者致敬！您可以在私人專案或其他開源發表中使用此函式庫，但在公開發表中重用此代碼須遵守社群規範。
免責聲明
這些資訊和出版物並非旨在提供，也不構成TradingView提供或認可的任何形式的財務、投資、交易或其他類型的建議或推薦。請閱讀使用條款以了解更多資訊。