Skip to content

v0.0.1

Latest

Choose a tag to compare

@srv91 srv91 released this 28 Jul 09:31
· 11 commits to main since this release

Trace Chart v0.0.1 - Initial Release

A lightweight, fully customizable financial charting library for global markets

We're excited to announce the first stable release of Trace Chart! Built on Apache ECharts with a focus on performance, customization, and ease of use for trading applications.

Key Features

Complete Charting Solution

  • 5 Chart Types: Candlestick, Line, Bar, Mountain, and Heikin Ashi
  • 7 Time Intervals: From 1-minute to daily charts
  • Zero-Config Demo: Works immediately with realistic market data
  • Real-time Updates: Optimized for high-frequency tick data

Technical Analysis Suite

  • Built-in Indicators: SMA, EMA, RSI, MACD, Bollinger Bands, Volume
  • Extensible Architecture: Easy custom indicator creation with performance optimization
  • Multi-panel Layout: Automatic indicator positioning (main chart, volume, oscillators)
  • Incremental Updates: Smart calculation system for real-time performance

Interactive Drawing Tools

  • 4 Drawing Types: Horizontal/Vertical lines, Rectangles, Circles
  • Full Editing Support: Drag, resize, and delete drawings
  • Per-Symbol Storage: Drawings persist when switching instruments
  • Context Menus: Right-click for drawing management

Multi-Market Ready

  • Indian Markets: Pre-configured for NSE, BSE, MCX, CDS exchanges
  • Global Support: Easily configurable for any market's trading hours
  • Timezone Handling: Built-in support for different market sessions
  • Holiday Management: Flexible market calendar system

Performance & Architecture

Optimized for Trading

  • Smart Updates: User interaction detection to pause updates during zooming/panning
  • Memory Management: Automatic cleanup and data retention limits
  • Incremental Indicators: Efficient calculation updates for real-time data
  • Event Consolidation: Centralized event management eliminates conflicts

Bundle Optimization

  • Modular Features: Disable unused components to reduce bundle size
  • Lazy Loading: Optional features loaded only when needed
  • Production Ready: Minified builds with source maps

Customization System

Complete Theme Control

const chart = new TraceChart('#chart', {
  theme: {
    backgroundColor: '#1a1a1a',
    bullishColor: '#26a69a',
    bearishColor: '#ef5350'
  }
});

Flexible Configuration

  • Runtime Updates: Change themes and settings without reloading
  • Feature Toggles: Enable/disable crosshairs, tooltips, volume, etc.
  • Custom Indicators: Simple API for adding technical analysis tools
  • Market Sessions: Configure trading hours for any global market

Developer Experience

Simple API

// Basic setup - works immediately
import TraceChart from 'trace-chart-lite';
const chart = new TraceChart('#container');

// Easy control
chart.setSymbol('RELIANCE', 'NSE');
chart.changeInterval('5min');
chart.addIndicator('sma', { period: 20 });

Real-time Integration

// Performance-optimized tick updates
chart.setTick('RELIANCE', {
  lastPrice: 1500.75,
  volume: 1500000,
  timestamp: Date.now()
});

Technical Highlights

  • Built on ECharts 5.4+: Leverages battle-tested rendering engine
  • ES6+ Modules: Modern JavaScript with tree-shaking support
  • TypeScript Ready: Full type definitions included
  • Zero Dependencies: Only requires ECharts as peer dependency
  • Cross-browser: Works on all modern browsers

Installation

npm install trace-chart-lite

CDN(UMD)

<script src="https://cdn.jsdelivr.net/npm/echarts@5.4.0/dist/echarts.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/trace-chart-lite@0.0.1/dist/trace-chart-lite.min.js"></script>

Quickstart

<div id="chart" style="width: 100%; height: 600px;"></div>
import TraceChart from 'trace-chart-lite';

const chart = new TraceChart('#chart', {
  demo: { enabled: true }  // Start with realistic demo data
});

What's Included

  • Complete charting engine with all chart types
  • 6 built-in technical indicators
  • Interactive drawing tools with full editing
  • Real-time data handling with performance optimization
  • Indian market sessions (NSE, BSE, MCX, CDS)
  • Comprehensive theming system
  • Demo mode with realistic market data
  • Full TypeScript support
  • Production-ready builds (ES6, UMD, minified)

What's Next

  • v1.1: More technical indicators (Stochastic, Williams %R, ATR)
  • v1.2: Advanced drawing tools (Fibonacci retracements, trend channels)
  • v1.3: Options chain visualization
  • v1.4: Multi-timeframe analysis

Try it now: npm install trace-chart-lite

License: AGPL-3.0