Lightweight Charts Long/Short Position Tool

This and all the line tools are converted from the 3.8 build via Vibe Coding and painstakingly tested by me to ensure it's not AI slop.

This package provides a specialized Long/Short Position tool for the Lightweight Charts v5+ plugin system. It is a critical risk management utility that visualizes entry, stop-loss, and profit-target levels, automatically calculating Risk:Reward ratios in real-time. It is part of a modular, high-performance drop-in replacement suite for the legacy v3.8 Line Tools Build.

🎥 Video Demo

line_tools_plugin_examples_003.mp4

⚠️ Prerequisites

IMPORTANT: This plugin cannot function on its own. It requires the Core Orchestrator to handle interactions, rendering logic, and state management.

• Required Core: lightweight-charts-line-tools-core . Have a look at the core repository to learn how to make your own line tools utilizing the core and contribute.

🛠 Installation & Building

This package is distributed as source code. To use it, you must clone the repository and build the distribution files locally.

1. Clone the repository:

   git clone https://github.com/difurious/lightweight-charts-line-tools-long-short-position.git
   cd lightweight-charts-line-tools-long-short-position

2. Install dependencies: (This will automatically download the Core orchestrator and other required libraries)

   npm install

3. Build the plugin: (This generates the /dist folder and /docs)

   npm run build

4. Output:

   • /dist: Contains the production ESM and UMD bundles.
   • /docs: Technical API documentation. Open docs/index.html and navigate to the LineToolLongShortPosition class to view all available configuration options (risk/reward colors, auto-text formatting, ratio calculations) and methods.

📦 The Plugin Ecosystem

IMPORTANT: The Core package is strictly an orchestrator; it does NOT include any line tools by default. To use any drawing functionality, you must install the specific tool plugins you require and register them with the Core instance. This modular approach allows you to keep your application footprint as small as possible by only including the logic for the tools you actually use.

Below are the official companion packages and the string keys used to invoke them via addLineTool:

• Standard Lines: (TrendLine, Ray, Arrow, ExtendedLine, HorizontalLine, HorizontalRay, VerticalLine, CrossLine, Callout)
• Freehand Tools: (Brush, Highlighter)
• Rectangle Tool: (Rectangle)
• Circle Tool: (Circle)
• Triangle Tool: (Triangle)
• Path Tool: (Path)
• Parallel Channel: (ParallelChannel)
• Fibonacci Retracement: (FibRetracement)
• Price Range: (PriceRange)
• Long/Short Position: (LongShortPosition)
• Text Tool: (Text)
• Market Depth: (MarketDepth)

🚀 Usage Example

Here is how to register and use the Long/Short Position tool in your chart.

import { createChart, CandlestickSeries } from 'lightweight-charts';
import { createLineToolsPlugin } from 'lightweight-charts-line-tools-core';
import { LineToolLongShortPosition } from 'lightweight-charts-line-tools-long-short-position';

const chart = createChart(document.getElementById('chart-container'));
const series = chart.addSeries(CandlestickSeries);

// 1. Initialize the Core Orchestrator
const lineTools = createLineToolsPlugin(chart, series);

// 2. Register the Long/Short Position Tool
lineTools.registerLineTool('LongShortPosition', LineToolLongShortPosition);

// 3. Start interactive drawing mode 
// (Click Entry point, then move and Click for Stop Loss. Target auto-generates at 3R)
lineTools.addLineTool('LongShortPosition');

The Test App

🧪 Testing & Validation

For developers and contributors, I provide a dedicated React Test Application.

This app is used to verify the integrity of the Core and all 12 plugins (21 line tools). It features an Automated Test Surface Generator that produces massive grids of tools to validate every style property, culling edge-case, and coordinate interpolation variant in a single view. Turn on the subscriptions and double click any tool you see to get its properties - options to understand what options do what. This is also a visual way to confirm all aspects of the tool are working properly.